/*
Steve Jalim - jquery image slideshow code

NB: for RM3 integration, updateDownloadLink will need amending to suit RM3 image paths

*/

jQuery(document).ready(function() {
    jQuery('#slideshow').hide();

    // if (!jQuery.browser.safari){
    //      jQuery('#mycarousel img').preload( { onFinish : initSlideshow });
    // }
    // else{
        slide_images = jQuery('#mycarousel img').map(function () { return this.src; }).get();
        
        Preloader.add(slide_images);
        Preloader.onFinish(initSlideshow);
        Preloader.load();
    // }
});


function initSlideshow(){
    
    jQuery('#slideshow-loading').hide();
    jQuery('#slideshow').show();
    
    totalImages = jQuery("#mycarousel > li").size();
    numDummy = 3; // needed to pad out to te
    
    cacheHiresURLs();
    removeThumnailLinks();
    addDummyImages(numDummy); // these pad out the end of the slideshow
    totalImages = totalImages + numDummy;
    
    
    jQuery('#mycarousel').jcarousel({
        auto: 3, //time in secs between each slide
        //size: totalImages,
        scroll: 1,
        wrap: 'last',
        initCallback: mycarousel_initCallback,
        itemFirstInCallback: showThisImage_itemFirstInCallback
    });

    addImageSwapToThumnails();
};


function mycarousel_initCallback(carousel)
{
    // Custom by VC Jan09: Disable auto scroll
    carousel.startAuto(0);
    
    // Disable autoscrolling if the user clicks the prev or next button.
    /* carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });


    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });

    // Cancel autoscrolling if the user clicks the clip
    carousel.clip.click(function() {
        carousel.startAuto(0);
    }); */
};


function showThisImage_itemFirstInCallback(carousel, item, index, carousel_state) {
        
    // get the url and dimensions of the pic - TODO - more efficient code
    var thisimg = jQuery(item).find('img');
    var pic_url = jQuery(thisimg).attr('src');
    var pic_dimensions = jQuery(thisimg).attr('imagedimensions').split('x');
    var pic_width = pic_dimensions[0];
    var pic_height = pic_dimensions[1];
    var pic_alt = jQuery(thisimg).attr('alt');
    
    doImageSwap(pic_url, pic_width, pic_height, null, index-1, pic_alt);
}

function doImageSwap(pic_url, w, h, img_class, index, pic_alt){
    
    //don't allow clicking on a blank image    
    if (img_class == 'blank'){
        return;
    }
    
    //generate new div with img in it        
    big_pic = "<img src='" + pic_url + "' width='"+ w +"' height='"+ h +"' alt='"+ pic_alt +"' />"
    newdiv = jQuery("<div>").append(big_pic).attr('id', 'slideimage');
    
    //fix IE6 problem by setting slide height and width
    jQuery('#slide').css('height', h);
    jQuery('#slide').css('width', w);

    // add it to the the pic holder element
    jQuery("#slideimage").replaceWith(newdiv);
      
    updateDownloadLink(pic_url, index);
};


function addImageSwapToThumnails(){
    jQuery("#mycarousel > li > img").each(function(i){
        this.index = i;
    }).click(function(event){
        showClickedImage(this);
    });
};


function showClickedImage(e){
    var pic_dimensions = jQuery(e).attr('imagedimensions').split('x');
    
    doImageSwap(e.src, pic_dimensions[0], pic_dimensions[1], jQuery(e).attr('class'), e.index, jQuery(e).attr('alt'));    
};



function updateDownloadLink(source_url, index){
    //manipulate the url of the image to create the url of the hires image
  
    //var download_url = source_url.replace(/pics/g, 'pics/hires'); 
    // splitpath = source_url.split("/")
    // filename = splitpath[splitpath.length-1]
  
    //set url in link box
    var download_url = window.hires_links[index];
    
    jQuery("#download-link a").attr('href', download_url);
}
    
///images/hi_res/imagename.jpg

function addDummyImages(dummies){
    //adds three dummy images of class 'blank' to pad out the end 
    //of the slideshow, ensuring that the last image is shown
    //yes, it's hacky. but a quick solution without rewriting jcarousel
    
    var blankimage = '<li><img src="/display_images/slideshow/blank_white.png" alt="" width="58" height="58" class="blank" /></li>';
                
    for (var i=0; i<dummies; i++){
        jQuery('#mycarousel').append(blankimage);        
    }
}


function cacheHiresURLs(){
    
    window.hires_links = []
    //window.hires_links.push(null); // fill first array element so that we cna 
    jQuery("#mycarousel > li").find('a').each(function(i, item){
        window.hires_links.push(new String(jQuery(item).attr('href')));
    });  
}

function removeThumnailLinks(){
    //remove the default HTML's thumbnail links from the vanilla HTML, as they stop the slideshow's own image replacement       
    //event from working, even with preventDefault() enabled

    li_elements = jQuery("#mycarousel > li");

    jQuery.each(li_elements, function(i, item){
        var img_tag = jQuery(item).find('img');
        jQuery(item).find('a').remove();
        jQuery(item).append(img_tag);
    });
}