$(document).ready(function() {
    
    $(".image_link").show();
    $(".image_link a:first").addClass("active");
    
    
    var imageWidth = $(".image_ticker").width();
    var imageSum = $(".image img").size();
    var imageReelWidth = imageWidth * imageSum;

    $(".image").css({'width' : imageReelWidth});
    
    rotate = function(){
      var triggerID = $active.attr("rel") - 1; //Get number of times to slide
      var imagePosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
  
      $(".image_link a").removeClass('active'); //Remove all active class
      $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
  
      //Slider Animation
      $(".image").animate({
          left: -imagePosition
      }, 500 );

    }; 
    
    rotateSwitch = function(){
      play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
          $active = $('.image_link a.active').next(); //Move to the next image_link
          if ( $active.length === 0) { //If image_link reaches the end...
              $active = $('.image_link a:first'); //go back to first
          }
          //alert($active.attr('rel'));
          rotate(); //Trigger the image_link and slider function
      }, 5000); //Timer speed in milliseconds (7 seconds)
    };
    
    $(".image_link a").click(function(){
        $active = $(this);
        rotate();
    });
    rotateSwitch();
});