// Begin new JavaScript 
var ContentSlider = Class.create({
  
  // This starts as class is initialized/activated 
  initialize: function() {
   	  	
		// Default Settings
		this.SliderOuter = "content-slider-outer"; // Outside Slider Div Id
		this.SliderInner = "content-slider-inner"; // Inside Slider Div Id
		this.SliderPannel = "content-slider-pannel"; // Slider Pannels Class Name 
		this.SliderPannelActive = "content-slider-pannel-active"; // Current Active Slider Class 
		
		this.Speed = 5000;
		this.ActivePannel = ""; // First/Current Active Slider Id, if blank, the first div in the SliderInner  
		this.SliderWidth = 620;
		
		this.AutoPlay = true; // Automaticly Start Playing 
		this.AutoPlaying = false; // Must start as false!!
		
		this.SliderPlayButton = "slider_play_button"; // Id of Slider Play Button 
		this.SliderStopButton = "slider_stop_button"; // Id of Slider Stop Button
		
		this.activatedAlready = false; // must start as false, holds true if button clicked or event in place 
  },
  
  // Load Slider ( Begin ) 
  LoadSlider: function() {
  
		if( this.ActivePannel == '' ) {
			this.ActivePannel = this.FirstBox();
		} 
		this.MakeDivVisible(this.ActivePannel);	
		
		// Begin Slider App 
		
		// If autoplaying set to true, then auto play
		if(this.AutoPlay == true) {
			this.AutoRun();
		}
		
		//var images = document.getElementById(this.SliderOuter).getElementsByTagName('.'+this.SliderInner);
		//for(var img_index = 0; img_index < images.length; img_index++)
		//	$(this.ActivePannel).style.left = '0px';
	 
	 //alert($(this.ActivePannel).style.left);	
	 //if( $(this.ActivePannel).style.left == '293px' ) $(this.ActivePannel).style.left = '0px';
  },
  
  // Show Next Slide 
  NextSlide: function() {
  
  		if(this.NextBox()) {
			
			// hide current box
			this.MakeDivHidden(this.ActivePannel);
			// set new  current box
			this.ActivePannel = this.NextBox(); 
			// make new current slide active  
			this.MakeDivVisible(this.ActivePannel);  
		
		} else {
			// Last Slide 
			this.GoToSliderPannel(this.FirstBox()); // Go To First
		}
  },
  
  // Show Previous Slide 
  PreviousSlide: function() {
  
  		if(this.PreviousBox()) {
			
			// hide current box
			this.MakeDivHidden(this.ActivePannel);
			// set new  current box
			this.ActivePannel = this.PreviousBox(); 
			// make new current slide active  
			this.MakeDivVisible(this.ActivePannel);   
		
		} else {
			// First Slide
			this.GoToSliderPannel(this.LastBox()); // Go To Last
		}
  },
  
  //  
  AutoRun: function() {
  
	  if(this.AutoPlaying == false) {
	  
	 	 //this.SlidersAutoPlayTimer = setInterval('my_content_slider.NextSlide()', this.Speed);
		 this.SlidersAutoPlayTimer = setInterval(this.NextSlide.bind(this), this.Speed);
	  	 this.AutoPlaying = true;
		 
		 $(this.SliderPlayButton).className = "active";
		 $(this.SliderStopButton).className = "";
	  }
  },
  
  //  
  EndAutoRun: function() {
  
	   if(this.AutoPlaying == true) {
	   
	   	  clearTimeout(this.SlidersAutoPlayTimer);
	   	  this.AutoPlaying = false;
		  
		  $(this.SliderPlayButton).className = "";
		  $(this.SliderStopButton).className = "active";
	   }
  },
  
  //  
  FirstSlide: function() {
  
  		if(this.ActivePannel != this.FirstBox()) {
			this.GoToSliderPannel(this.FirstBox()); // Go To First
		}
  },
  
  //  
  LastSlide: function() {
  
  		if(this.ActivePannel != this.LastBox()) {
			this.GoToSliderPannel(this.LastBox()); // Go To Last
		}
  },
  
  //  
  GoToSliderPannel: function(NewSlide) {
  
  		if(this.ActivePannel != NewSlide) {
			// hide current box
			this.MakeDivHidden(this.ActivePannel);
			// set new  current box
			this.ActivePannel = NewSlide; 		
			// show new current box
			this.MakeDivVisible(this.ActivePannel);  
		}
  },
  
  // make box visible
  MakeDivVisible: function(el) {
		
		if(this.activatedAlready == true) {
			setTimeout(this.MakeDivVisible.bind(this,el), 300);
		}
		else {
		this.activatedAlready = true; // begin the app active var 
	 
  		if( ($(el).style.left=='') || ( $(el).style.left == '-'+ (this.SliderWidth+293) +'px' )) $(el).style.left = '-'+this.SliderWidth+'px';
		
		
			new Effect.Move($(el), {
			   x: this.SliderWidth, 
			   duration: 0.4,
			   transition: Effect.Transitions.sinoidal 
			});
	
			$(el).className = this.SliderPannelActive;
			
			setTimeout(this.setNotActive.bind(this), 300);
			
		}
  },
  
  setNotActive: function() {
	  this.activatedAlready = false;
  },
  
  // make box invisible
  MakeDivHidden: function(el) {
		
		new Effect.Move($(el), {
		   x: this.SliderWidth, 
		   duration: 0.4, 
		   transition: Effect.Transitions.sinoidal 
		});
							
		setTimeout(this.setDivBack.bind(this, el), 600);
	
  },
  
  setDivBack: function(el) {
  
  		$(el).className = this.SliderPannel;
		
		$(el).setStyle({
		  'left': -this.SliderWidth+'px'
		});
							
  },
  
  // get next box id
  NextBox: function() {
  
	 if($(this.ActivePannel).next('.' + this.SliderPannel)) {
	  	return $(this.ActivePannel).next('.' + this.SliderPannel).id;
	 } else {
	 	return false;
	 }
  },
  
  // get previous box id
  PreviousBox: function() {
  
	 if($(this.ActivePannel).previous('.' + this.SliderPannel)) {
	    return $(this.ActivePannel).previous('.' + this.SliderPannel).id;
	 } else {
	 	return false;
	 }
  },
  
  // get first box id
  FirstBox: function() {
  		
	  return $(this.SliderInner).down('div.'+this.SliderPannel).id;
  },
  
  // get first box id
  LastBox: function() {
  
  		return $$("#"+this.SliderInner+" div."+this.SliderPannel+":last-child")[0]; 
	   // return $(this.SliderInner).select(":last-child div")[0];
  },
  
  // USER AVAILABLE FUNCTIONS
  // get first box id
  runFirst: function() {
  
  		if(this.AutoPlaying == true) {
			this.EndAutoRun();
		}
		setTimeout(this.FirstSlide.bind(this), 600);
  },
  // get last box id
  runLast: function() {
  
  		if(this.AutoPlaying == true) {
			this.EndAutoRun();
		}
		setTimeout(this.LastSlide.bind(this), 600);
  },
  // get last box id
  runNext: function() {
  
  		if(this.AutoPlaying == true) {
			this.EndAutoRun();
		}
		setTimeout(this.NextSlide.bind(this), 600);
  },
  // get last box id
  runPrevious: function() {
  
  		if(this.AutoPlaying == true) {
			this.EndAutoRun();
		}
		setTimeout(this.PreviousSlide.bind(this), 600);
  },
  // get last box id
  runSlide: function(slideId) {
  
  		if(this.AutoPlaying == true) {
			this.EndAutoRun();
		}
		setTimeout(this.GoToSliderPannel.bind(this,slideId), 600);
  }

});