// code:
var xinc = 200;
var xcoord = 0;
var grey = '#b3b3b3';

$(document).ready(function(){
  // if javascript is enabled, only the first slide is revealed:
  $('#slideIntroContainer').css('height', '200px');
  // if javascript is enabled, reveal the slide controls:
  $('#slideIntroControls').css('display', 'block');
  // if javascript is enabled, constrain height::
  $('#slideIntro').css('height', '236px');
  
  // previous button begins greyed-out:
  $('#slideIntroPrevious').css('color', grey);

  // controls:
  $('#slideIntroNext').click(function(){
    if(xcoord > (xinc*3)*-1){
      $('#slideIntroPrevious').css('color', '#00f');
      xcoord -= xinc;
    }
    $('#slideIntroImage').animate({top: xcoord});
        
    if(xcoord <= (xinc*3)*-1){
      $(this).css('color', grey);
    }
  });
  
  $('#slideIntroPrevious').click(function(){
    if(xcoord < 0){
      $('#slideIntroNext').css('color', '#00f');
      xcoord += xinc;
    }
    $('#slideIntroImage').animate({top: xcoord});

    if(xcoord >= 0){
      $(this).css('color', grey);
    }
  });
  
  // anchor link slide control:
  // if javascript is enabled, add anchor link underlines and pointer cursor:
  $('#columnLeft a').css('text-decoration', 'underline');
  $('#columnLeft a').css('cursor', 'pointer');
  
  $('#slideIntro1').click(function(){
    xcoord = 0;
    $('#slideIntroImage').animate({top: xcoord});
    $('#slideIntroNext').css('color', '#00f');
    $('#slideIntroPrevious').css('color', grey);
  });
  $('#slideIntro2').click(function(){
    xcoord = -200;
    $('#slideIntroImage').animate({top: xcoord});
    $('#slideIntroNext').css('color', '#00f');
    $('#slideIntroPrevious').css('color', '#00f');
  });
  $('#slideIntro3').click(function(){
    xcoord = -400;
    $('#slideIntroImage').animate({top: xcoord});
    $('#slideIntroNext').css('color', '#00f');
    $('#slideIntroPrevious').css('color', '#00f');
  });
  $('#slideIntro4').click(function(){
    xcoord = -600;
    $('#slideIntroImage').animate({top: xcoord});
    $('#slideIntroNext').css('color', grey);
    $('#slideIntroPrevious').css('color', '#00f');
  });

});