jQuery(document).ready(function() {
	jQuery(".paging").show();
	jQuery(".paging a:first").addClass("active");

	var imageWidth = jQuery(".window").width();
	var imageSum = jQuery(".image_reel img").size();
	var imageReelWidth = imageWidth * imageSum;

	jQuery(".image_reel").css({
		'width' : imageReelWidth
	});

	// Paging and Slider Function
	rotate = function() {
	    var triggerID = $active.attr("rel") - 1;
	    var image_reelPosition = triggerID * imageWidth;
	    jQuery(".paging a").removeClass('active');
	    $active.addClass('active');

	    // Slider Animation
	    jQuery(".image_reel").animate({
	        left: - image_reelPosition
	    }, 500 );
	};

	// Rotation and Timing Event
	rotateSwitch = function(){
	    play = setInterval(function() {
	        $active = jQuery('.paging a.active').next();
	        if ($active.length === 0) { 
	            $active = jQuery('.paging a:first');
	        }
	        rotate();
	    }, 7000);
	};
	rotateSwitch();

	// On Hover
	jQuery(".image_reel a").hover(function() {
	    clearInterval(play);
	}, function() {
	    rotateSwitch();
	});	

	// On Click
	jQuery(".paging a").click(function() {
	    $active = jQuery(this); //Activate the clicked paging
	    //Reset Timer
	    clearInterval(play); //Stop the rotation
	    rotate(); //Trigger rotation immediately
	    rotateSwitch(); // Resume rotation timer
	    return false; //Prevent browser jump to link anchor
	});
});