// Image preloader
(function($) {
  var cache = [];
  // Arguments are image paths relative to the current page.
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  } 
})(jQuery);

//Slider speed
var slideSpeed = 700;
var slideTimeoutSpeed = 9000;
var sliding = false;
var slideManualOverride = false;
$(document).ready(function(){
	
	 if($("#slider").length > 0 && $("#slider.static").length==0){
		  setTimeout("autoSlide()",slideTimeoutSpeed);
		  $(window).keydown(function(e){
				if (e.keyCode == 39 && sliding == false){sliding=true;slideManualOverride = true;slidePanelLeft(numberOfImages);}	
				if (e.keyCode == 37 && sliding == false){sliding=true;slideManualOverride = true;slidePanelRight(numberOfImages);}	
			});
	  }
	
	
    // Work out number of images from number of details provided
    var images = $(".hiddenDetails .imageName");
    var numberOfImages = $(images).length;
    
    // Preload all images
    for(i=0;i<=numberOfImages-1;i++){
        var imageName = $(images[i]).text();
        jQuery.preLoadImages(imageName,"/"+imageName);        
    }
    
    // Load the first images   
    if ($("#slider #main").length > 0){
    $("#slider #main").prev().html("<img src='"+$(images[numberOfImages-1]).text()+"' rel='"+(numberOfImages).toString()+"' />");
    $("#slider #main").next().html("<img src='"+$(images[1]).text()+"' rel='"+(parseFloat($("#slider #main img").attr("rel").toString()) + 1).toString()+"' />");
    }
    // Slide Panel Left Event
    $("#slideRight").click(function(){slideManualOverride = true;slidePanelLeft(numberOfImages);});
    
    // Slide Panel Right Event
    $("#slideLeft").click(function(){slideManualOverride = true;slidePanelRight(numberOfImages);});
    
   
});



function autoSlide()
{
	if($("#slider").length > 0 && $("#slider.static").length==0){
			if (slideManualOverride == false)
			{
				slidePanelLeft($('.hiddenDetails .imageName').length);
			}
			setTimeout("autoSlide()",slideTimeoutSpeed);
		
	}
}

function slidePanelLeft(numImgs){
    // Prevent further clicks
    $("#slideLeft").unbind("click");
    $("#slideRight").unbind("click");
    
    // Figure out next panel
    var nextPanel = $("#slider #main img").attr("rel");
    nextPanel = parseFloat(nextPanel) + 1;
    if(nextPanel > numImgs){nextPanel = 1};
    
    // Update text
    var newDetailsString = $(".hiddenDetails #details"+nextPanel+" .show").html();
    $("#sliderDetails .details").html(newDetailsString);
    Cufon.refresh();

    // Make span width dynamic so can animate img
    var currentImg = $("#slider #main");    
    $(currentImg).prev().css("width","auto");    
    $(currentImg).next().css("visibility","visible");        
    $(currentImg).prev().children().animate({width:"0"},slideSpeed,function(){    
        // Figure out next image
        var nextImage = $("#slider #main img").attr("rel");
        nextImage = parseFloat(nextImage) + 2;
        if(nextImage > numImgs){
        	if((parseFloat($("#slider #main img").attr("rel").toString()) + 1) == numImgs){nextImage = 1}
        	else{nextImage = 2};
        };
        
        // Move the ID along one                        
        $("#slider #main").css("visibility","hidden");        
        $("#slider #main").next().attr("id","main");
        $(this).parent().next().removeAttr("id");        
        $(this).parent().remove();
        
        // Add in next image        
        $("#slider #main").parent().append("<span><img src='"+$("#details"+nextImage+" .imageName").text()+"' rel='"+(nextImage).toString()+"' /></span>");
        
        $("#slideRight").click(function(){slideManualOverride = true;slidePanelLeft(numImgs)});
        $("#slideLeft").click(function(){slideManualOverride = true;slidePanelRight(numImgs)});
        sliding = false;
    });    
}

function slidePanelRight(numImgs){
    // Prevent further clicks
    $("#slideRight").unbind("click");
    $("#slideLeft").unbind("click");

    // Remove right hand span
    var currentImg = $("#slider #main");
    $(currentImg).next().remove();
    
    // Insert new span and slide right
    $("#slider #main").parent().prepend("<span style='width:0px;'></span>");    
    $("#slider #main").prev().css("visibility","visible");
    
    // Figure out next panel
    var nextPanel = $("#slider #main img").attr("rel");
    nextPanel = parseFloat(nextPanel) - 1;
    if(nextPanel == 0){nextPanel = numImgs};
    
    // Update text
    var newDetailsString = $(".hiddenDetails #details"+nextPanel+" .show").html();        
    $("#sliderDetails .details").html(newDetailsString);
    Cufon.refresh();    
    
    $("#slider #main").prev().prev().animate({width:"1700px"},slideSpeed,function(){
        // Figure out next image
        var nextImage = $("#slider #main img").attr("rel");
        nextImage = parseFloat(nextImage) - 2;
        if(nextImage < 0){nextImage = (numImgs - 1)}
        else if(nextImage == 0){nextImage = numImgs};
        
        // Move ID around
        $("#slider #main").removeAttr("id");        
        $(this).next().attr("id","main");
        $("#slider #main").next().css("visibility","hidden");
        
        // Add in next image
        $(this).html("<img src='"+$("#details"+nextImage+" .imageName").text()+"' rel='"+(nextImage).toString()+"' />");        
        
        $("#slideLeft").click(function(){slidePanelRight(numImgs)});
        $("#slideRight").click(function(){slidePanelLeft(numImgs)});
        sliding = false;
    });
}