var SL_Slider = new Class({

	//implements
	Implements: [Options],
	
	//variables setup
	numNav: new Array(),	//will store number nav elements (if used)
	timer: null,				//periodical function variable holder
	isSliding: 1,				//flag for animation/click prevention
	direction: 1,				//flag for direction (forward/reverse)
	origColor: null,			//variable for holding original number's color (will probably revert to CSS for this)

	//options
	options: {
	slideTimer: 8000,  		//Time between slides (1 second = 1000), a.k.a. the interval duration
	isPaused: 0,				//flag for paused state
	transitionTime: 5000, 	//Transition time (1 second = 1000)
	container: null,			//container element
	items:  null, 				//Array of elements for sliding
	itemNum: 0,				//Current item number
	hasControls: false,		//Whether or not the controls box will be used
	numNavActive: false,	//Whether or not the number navigation will be used
	numNavHolder: null,	//Element that holds the number navigation
	playBtn: null,				//Play (and pause) button element
	prevBtn: null,				//Previous button element
	nextBtn: null				//Next button element
	},

	//initialization
	initialize: function(options) {
		//set options
		this.setOptions(options);

		//remove any scrollbar(s) on the container
		//this.options.container.setStyle('overflow', "hidden");


		//setup items (a.k.a. slides) from list
		this.options.items.each(function(el, i){
             //alert($type(el));
			 if(i!=0) {
                        //alert(i);

        	//alert(el);
		//f.y.i.  el = the element, i = the index
			  el.setStyle('display', 'block');
              el.setStyle('opacity', 0);
			  //positioning/opacity setup
    		  el.setStyle('position', "absolute");

			  //get size of item and move that far above the container
			  var itemH = el.getSize().y;
			  var itemW = el.getSize().x;
			  //el.setStyle('top', (-1 * itemH));
			  el.setStyle('top', 0);
			  // set height of container
			  this.options.container.setStyle('height', itemH);
    			 }

		 }, this);
	
	},

	//startup method
	start: function() {

		this.slideIt(this.options.itemNum);
        this.delayTimer = this.slideIt.delay(this.options.slideTimer,this,this.options.itemNum+1);
		//$clear(this.delayTimer)
	},


	slideIt: function(passedID) {
		//alert("ID: " + passedID);
		//$clear(this.delayTimer);

		//get item to slide out
		var curItem = this.options.items[this.options.itemNum];
		
		if(this.options.numNavActive){
			var curNumItem =  this.numNav[this.options.itemNum];
		}
		
		if(this.direction == 1){
			var curX = this.options.container.getSize().x;
			//var curY = this.options.container.getSize().y;
			var curY = (-1 * this.options.container.getSize().y);
		}
		else{
			var curX = (-1 * this.options.container.getSize().x);
			//var curY = (-1 * this.options.container.getSize().y);
			var curY = this.options.container.getSize().y;
		}

		this.changeIndex();
		
		//check for passedID presence
		if(passedID != null) {
			if(this.options.itemNum != passedID){
				this.options.itemNum = passedID;
			}
		}
		
		//now get item to slide in using new index
		var newItem = this.options.items[this.options.itemNum];


//		 		alert("ID: " + passedID);

		if(this.options.numNavActive){
			var newNumItem =  this.numNav[this.options.itemNum];
		}
		
/*
		if(this.direction == 1){
			var newX = (-1 * newItem.getSize().x);
			var newY = (-1 * newItem.getSize().y);
		}
		else{
			var newX = newItem.getSize().x;
			var newY = newItem.getSize().y;
		}
*/
		//set up our animation stylings
		var item_in = new Fx.Morph(newItem, {
		     duration: this.options.transitionTime,
		     //transition: 'cubic:inOut',
		     //link: 'ignore',

		     onStart: this.toggleSlidingOn.create({
				bind: this
			}),

		     onComplete: this.toggleSlidingOff.create({
				bind: this
			})

		});
 if (passedID>0) {
		item_in.start({
			'opacity':1
			//'left' : [newX, 0]
			//'top' : [0]
		});
}
		if(curItem != newItem){
			var item_out = new Fx.Morph(curItem, {
				     //duration: this.options.transitionTime,
				     //transition: 'cubic:inOut',
				     //link: 'ignore'
			});

 if (passedID>0) {
 	//alert(passedID);
			item_out.start({
				'opacity':0
				//'left' : [(curX)]
				//'top' : [(curY)]
			});
		}
              		}
   		//this.options.container.setStyle('height', (-1*newY));

	
	},
	
	//--------------------------------------------------------------------------------------------------------
	//supplementary functions  (mini-functions)
	//--------------------------------------------------------------------------------------------------------
	pauseIt: function () {
		
		//only move if not currently moving
		if(this.isSliding == 0){
			if(this.options.isPaused == 0){
				this.options.isPaused = 1;
				$clear(this.theTimer);
				//this.options.playBtn.set('text', 'play');
			}
			else{
				this.options.isPaused = 0;
				this.slideIt();
				this.theTimer = this.slideIt.periodical(this.options.slideTimer, this, null);
				//this.options.playBtn.set('text', 'pause');
			}
			
		} //end if not sliding
		
	},
	
	changeIndex: function() {
		var numItems = this.options.items.length;  //get number of slider items
		
		//change index based on value of 'direction' parameter
		if(this.direction == 1){
			if(this.options.itemNum < (numItems - 1)){
				this.options.itemNum++; 
			}
			else{
				this.options.itemNum = 0;
			}
		}
		else if(this.direction == 0){
			if(this.options.itemNum > 0){
				this.options.itemNum--; 
			}
			else{
				this.options.itemNum = (numItems - 1);
			}
		}	
		
	},
	
	numPress: function (e, theIndex) {
		
		if((this.isSliding == 0) && (this.options.itemNum != theIndex)){
			if(this.options.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
	}
	
	//------------------------  end supp. functions -----------------------------------------//
	
	

});