var Showcase = new Class({

	//implements
	Implements: [Options],
	
	inFx: new Array(),
	outFx: new Array(),
	timer: null,
	isSliding: 0,
	origColor: null,
	direction: 0,
	leftPics: new Array(),
	rightPics: new Array(),
	curSide: 0,  //left = 0, right = 1
	prevLeft: null, 
	prevRight: null,
	

	//options
	options: {
	slideTimer: 6000,  		//time between slides (1 second = 1000), a.k.a. the interval duration
	transitionTime: 2000, 	//transition time (1 second = 1000)
	items:  null, 				//Get array of image (links)
	itemNum: -1,
	leftBox: null,
	rightBox: null,
	initBox: null
	},

	//initialization
	initialize: function(options) {
		//set options
		this.setOptions(options);
	
		this.options.items.each(function(v, k){
			  //v = the element
			  //k = the index
			  
			  
			  //get image
			  var tempEl = v.getElement('a');
			  var theHref = tempEl.getProperty('href')
			  var tempImg = new Asset.image(theHref);
			  var theClone = tempImg.clone();
			  
			  v.empty();
			  this.options.leftBox.grab(tempImg);
			  this.options.rightBox.grab(theClone);
			  
			  this.leftPics.push(tempImg);
			  this.rightPics.push(theClone);
			  
			  var imgSize = tempImg.getSize();
			  var imgW = imgSize.x;
			  var imgH = imgSize.y;
			  
			  
			  //positioning/opacity setup
			 tempImg.setStyle('opacity', 0);
			 theClone.setStyle('opacity', 0);
			  
			  var hDiff = (433 - imgH)/2;
			  tempImg.setStyle('top', hDiff);
			  theClone.setStyle('top', hDiff);
			  
			  var wDiff = (433 - imgW)/2;
			  tempImg.setStyle('left', wDiff);
			  theClone.setStyle('left', wDiff);
			 //end center
			  
			  //end positioning/opacity
			  
		
		 }, this);
	
	},

	//a method that does whatever you want
	start: function() {
		this.options.initBox.destroy();
		
		this.changeIt();
		this.changeIt();
		
		this.theTimer = this.changeIt.periodical(this.options.slideTimer, this, null);
		
	},


	changeIt: function(passedID) {

		var numItems = this.options.items.length;  //get number of slider items
		
		//get item to fade out
		if(this.curSide == 0){
			var curItem = this.prevLeft;
		}
		else{
			var curItem = this.prevRight;
		}
		
		/*
		if(this.direction == 0){
			if(this.options.itemNum > 0){
				this.options.itemNum++; 
			}
			else{
				this.options.itemNum = (numItems - 1);
			}
		}
		*/
		this.upIndex();
		
		//now get pic to fade in, checking curSide to see which side
		if(this.curSide == 0){
			
			var newItem = this.leftPics[this.options.itemNum];	
			this.prevLeft = newItem;
			this.curSide = 1;
			
		}
		else{
			
			var newItem = this.rightPics[this.options.itemNum];
			this.prevRight = newItem;
			this.curSide = 0;
			
		}
		
		
		//set up our animation stylings for out and in motions (note:  Fx.Styles does NOT exist in moo 1.2, so we must use Fx.Morph or Fx.Tween)
		var item_in = new Fx.Morph(newItem, {
			     duration: this.options.transitionTime, 
			     transition: Fx.Transitions.Cubic.easeOut, 
			     link: 'ignore',
			     
			     onStart: this.toggleSlidingOn.create({
					bind: this
				}),
			     
			     onComplete: this.toggleSlidingOff.create({
					bind: this
				})
			     
		});
		
		item_in.start({
			'opacity':[0,1]
		});
		
		if(curItem != null){
			var item_out = new Fx.Morph(curItem, {
				     duration: this.options.transitionTime, 
				     transition: Fx.Transitions.Cubic.easeOut, 
				     link: 'ignore'
			});
			
			item_out.start({
				'opacity':[0]
			});
		}
		
		
		//newNumItem.morph({'color': '#FFFFFF'});
		//curNumItem.morph({'color':  this.origColor});
		
	},
	
	//--------------------------------------------------------------------------------------------------------
	//supplementary functions  (mini-functions)
	//--------------------------------------------------------------------------------------------------------	
	numPress: function (e, theIndex) {
		
		if((this.isSliding == 0) && (this.options.itemNum != theIndex)){
			if(this.isPaused == 0){
				$clear(this.theTimer);
				this.theTimer = this.slideIt.periodical(this.options.slideTimer, this, null);
			}
			this.slideIt(theIndex);
		}
	
	},
	
	toggleSlidingOn: function () {
		this.isSliding = 1;  //prevents extra clicks
	},
	
	toggleSlidingOff: function () {
		this.isSliding = 0;  //prevents extra clicks
	},
	
	upIndex: function () {
		this.options.itemNum++;
		if (this.options.itemNum >= this.options.items.length) {
			this.options.itemNum = 0;
		}
	},
	
	//fade in
	showIt: function(el){ 
		
		//get item to slide out
		var curItem = el;	
		
		//set up our animation
		var fade_in = new Fx.Morph(el, {
			     duration: transitionTime, 
			     transition: Fx.Transitions.Cubic.easeOut, 
			     link: 'ignore'
		});
		
		fade_in.start({
		'opacity': 1
		});
		
	}	
	//------------------------  end supp. functions -----------------------------------------//
	
	

});