//handles the slides on the homepage
var slides = {
    
	current_slide: 1,
	ai: null,
	automate_dir: 'R',
	dur: 0.8, //duration of effects
	automate_dur: 4, //how long to stay on each slide when using automatic movement
	
    move: function( dir ) {
        
      //check we are allowed to move, if not return
      //var c = parseInt( $('innertrack').getStyle( 'left' ) );
      //if( c >= 0 && dir == 'L' || c <= this.max_x && dir == 'R' ) return;
      
      //cancel queues
      $('slides_arrow_left').stopObserving( 'click' );
      $('slides_arrow_right').stopObserving( 'click' );

	    
	    //move image around
	    if( dir == 'R' ) {
	    
	    	var divToMove = $$('#innertrack .popupimg')[0];
	    	var newDiv = divToMove.clone();
	    	var newImg = divToMove.down('img').clone();
	
	    	$('innertrack').insert( { 'bottom': newDiv } );
	    	newDiv.insert( newImg );
	    	newDiv.observe( 'click', caseStudies.zoom );
	    
	    } else {
	    
	    	var divToMove = $$('#innertrack .popupimg')[8]; // 8 = total images - 1
	    	var newDiv = divToMove.clone();
	    	var newImg = divToMove.down('img').clone();
	
	    	$('innertrack').insert( { 'top': newDiv } );
	    	newDiv.insert( newImg );
	    	$('innertrack').setStyle( 'left: ' + ( parseInt( $('innertrack').getStyle( 'left' ), 10 ) - slides.w ) +'px' );
	    	newDiv.observe( 'click', caseStudies.zoom );
	    
      }

  
      //move
      new Effect.Move( 'innertrack', {
        x: this.w * ( dir == 'L' ? 1 : -1 ),
        y: 0,
        mode: 'relative',
        duration: slides.dur,
        queue: 'end', scope: 'slides', limit: 1,
        afterFinish: function() {
        
          slides.update_buttons();
          $('slides_arrow_left').observe( 'click', function(e) { e.stop(); slides.move('L'); clearTimeout( slides.ai ) } );
          $('slides_arrow_right').observe( 'click', function(e) { e.stop(); slides.move('R'); clearTimeout( slides.ai ) } );

          divToMove.remove();
            
        	if( dir == 'R' ) {   	    	
	    			$('innertrack').setStyle( 'left: ' + ( parseInt( $('innertrack').getStyle( 'left' ), 10 ) + slides.w ) +'px' );
	    		}

        }
      } );
    
    },
    
    init: function() {
  
      this.w = 161; //width of slide
      this.n = 7; //number of slides
      this.max_x = this.w * ( this.n - 1 ) * -1;
      
      $('slides_arrow_left').observe( 'click', function() { slides.move('L'); clearTimeout( slides.ai ) } );
      $('slides_arrow_right').observe( 'click', function() { slides.move('R'); clearTimeout( slides.ai ) } );
      
      this.update_buttons();
		
			//automate slide moving if nothing is pressed
			if( this.n > 1 ) this.ai = setTimeout( function() { slides.automate() }, slides.automate_dur * 1000 );
        
    }, 
	
	automate: function() {
		
		//do we need to change the direction?
		//if( this.automate_dir == 'R' && this.current_slide == this.n ) this.automate_dir = 'L';
		//else if( this.automate_dir == 'L' && this.current_slide == 1 ) this.automate_dir = 'R';
		
		//update current slide
		this.current_slide = this.automate_dir == 'L' ? this.current_slide - 1 : this.current_slide + 1;
		
		//move
		this.move( this.automate_dir );
		
		//recurse
		this.ai = setTimeout( function() { slides.automate() }, ( slides.automate_dur + slides.dur ) * 1000 );
		
	},
    
  update_buttons: function() {
              
      var f = 0.5; //opacity to fade to
      var dur = 0.3; //duration of fade
      var c = parseInt( $('innertrack').getStyle( 'left' ) ) - 7;
	
      //handle going left...
      if( c >= -7 ) $('slides_arrow_left').morph( 'opacity: ' + f, { duration: dur } ).setStyle( 'cursor: default' );
      else if( $('slides_arrow_left').getStyle( 'opacity' ) == f ) $('slides_arrow_left').morph( 'opacity: 1', { duration: dur } ).setStyle( 'cursor: pointer' );

      //handle going right...
      if( c <= slides.max_x ) $('slides_arrow_right').morph( 'opacity: ' + f, { duration: dur } ).setStyle( 'cursor: default' );
      else if( $('slides_arrow_right').getStyle( 'opacity' ) == f ) $('slides_arrow_right').morph( 'opacity: 1', { duration: dur } ).setStyle( 'cursor: pointer' );

  }
    
}

document.observe( 'dom:loaded', slides.init.bind(slides) );