// JavaScript Document
var totalWidth = 0;
var slideTime = null;
var currentSlide = 1;
var totalSlides = 0;
var pauseSlide = false;
var normalSpeed = 400; // millisecs
var rewindSpeed = 1800; // millisecs
var slideMotion = 0; // millisecs
var autoSlideSpeed = 6000; // millisecs
var btnPlay = "fileadmin/templates/images/btnPlay_03.png";
var btnPause = "fileadmin/templates/images/btnPause_03.png";

jQuery(function()
{
	// get .panel
	jQuery(".panel").css(
	{
		width: 455,
		float: "left"
	});
	// prevent defaults movers-row
	jQuery("#movers-row").find("a").click(slideThePanel).eq(0).addClass("cross-link-hover");
	// total slides 
	totalSlides = jQuery(".panel").length;
	jQuery.each(jQuery(".panel"), function()
	{
		totalWidth += jQuery(this).width();
	});
	// set the width of panel cont
	jQuery(".panelContainer").css("width", totalWidth+"px");
	jQuery('#main-photo-slider .single').hover(function() {
		jQuery(this).addClass('hover');
		}, function() {
		jQuery(this).removeClass('hover');
	});	

        jQuery('#main-photo-slider .rows1').hover(function() {
                jQuery(this).addClass('hover');
                }, function() {
                jQuery(this).removeClass('hover');
        });

	jQuery('#main-photo-slider .rows2').hover(function() {
		jQuery(this).addClass('hover');
		}, function() {
		jQuery(this).removeClass('hover');
	});
	
	jQuery('#main-photo-slider .cols3').hover(function() {
		jQuery(this).addClass('hover');
		}, function() {
		jQuery(this).removeClass('hover');
	});
	
	jQuery('#main-photo-slider .grid4').hover(function() {
		jQuery(this).addClass('hover');
		}, function() {
		jQuery(this).removeClass('hover');
	});	
	
	slideTimer = window.setTimeout(startSlider, autoSlideSpeed);
});

slideThePanel = function(e)
{
	e.preventDefault();

	var leftToScroll = 0;
	
	var clicked = jQuery(this).attr("href");
	var posnHash = clicked.indexOf("#");
	clicked = clicked.substring(posnHash + 1, clicked.length);
	//clicked = clicked.substring(1,clicked.length);
	
	if(clicked != "playpause")
	{
		
		// remove cross link hover if any
		jQuery("#movers-row").find("a.cross-link-hover").removeClass("cross-link-hover");
		/*
		jQuery.each(jQuery("#movers-row").find("a"), function()
		{
			jQuery(this).removeClass("cross-link-hover");
		});
		*/
	
		jQuery(this).addClass("cross-link-hover");
		
		leftToScroll =  Math.round(totalWidth / jQuery(".panel").length) * clicked - (Math.round(totalWidth / jQuery(".panel").length));
		jQuery("#main-photo-slider").animate(
		{
			scrollLeft: leftToScroll
		}, normalSpeed);
		
		currentSlide = clicked;
	}
	else
	{
		if(pauseSlide)
		{
			slideTimer = window.setTimeout(startSlider, autoSlideSpeed);
			pauseSlide = false;
			jQuery(this).html('<img src="'+ btnPause + '" />');
		}
		else
		{
			pauseSlide = true;	
			window.clearTimeout(slideTimer);
			jQuery(this).html('<img src="'+ btnPlay + '" />');
		}
	}
}

startSlider = function()
{
	var currentLink = 0;	//	one index less due to array strts with zero.
	currentSlide++;
	
	slideMotion = normalSpeed;	
	if(currentSlide > totalSlides)
	{
		slideMotion = rewindSpeed;
		currentSlide = 1;
	}
	
	var leftToScroll = 0;
	leftToScroll =  Math.round(totalWidth / jQuery(".panel").length) * currentSlide - (Math.round(totalWidth / jQuery(".panel").length));
	
	currentLink = currentSlide -1;

	// remove the hover and add to next element
	jQuery("#movers-row").find("a.cross-link-hover").removeClass("cross-link-hover");
	jQuery("#movers-row").find("a").eq(currentLink).addClass("cross-link-hover");
	
	jQuery("#main-photo-slider").animate(
	{
		scrollLeft: leftToScroll
	}, slideMotion);
	
	if(!pauseSlide)
	{
		slideTimer = window.setTimeout(startSlider, autoSlideSpeed);
	}
}