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(){
		/* jQuery('.main_view').css({
			'background' : 'url(image/include-loader.gif) 50% 50% no-repeat'
		}); */
	    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
	});

	jQuery(".prev").click(function() {
		$active = jQuery('.paging a.active').prev();
	    if($active.length === 0) { 
	    	$active = jQuery('.paging a:first');
	    }
	    rotate();
	});

	jQuery(".next").click(function() {
		$active = jQuery('.paging a.active').next();
	    if($active.length === 0) { 
	    	$active = jQuery('.paging a:first');
	    }
	    rotate();
	});
});
