function hideSlide(){
   $(this).css('z-index', '0');
}

function showThumbstrip(){
 
    $("#imageshow").hide();
    $("#shade").fadeOut('fast');
    $("#shade").hide();
    
    $("#leftSlide").css('z-index','50');
    $("#rightSlide").css('z-index','50');
}

$(document).ready(function() {

    var rotor = $('#boxRot');
    
    var thumbwidth = 126;
    var thumbheight = 126;
    
	var galleryPath = "slike/gallery/";
	
	if(document.title == "Reprint Clients")
		galleryPath = "../slike/gallery/";
    
    var thumbSrc = ['becksM.jpg','bucaneroM.jpg','bucaneromaxM.jpg','coolM.jpg',
                    'cristalM.jpg','cubaneroM.jpg','favoritM.jpg','freshM.jpg','heinekenM.jpg',
                    'jadranM.jpg','jupilerM.jpg','kaltenbergM.jpg','kanditM.jpg','karlovackoM.jpg',
                    'krasM.jpg','laskoM.jpg','mayabeM.jpg','oranginaM.jpg','osjeckcrnoM.jpg',
                    'osjeckM.jpg','ozujskoM.jpg','panM.jpg','primaM.jpg','rallyM.jpg',
                    'staroceskoM.jpg','staropramenM.jpg','stelaM.jpg','tomislavM.jpg','zvecevoM.jpg']
    var thumbs = new Array();
    

    for (var i = 0; i < thumbSrc.length; i++) {

        thumbs[i] = new Image(thumbwidth, thumbheight);
        thumbs[i].src = galleryPath + thumbSrc[i];
        $('.thumbstrip').append(thumbs[i]);
    }
    
    var thumbstripwidth = (thumbwidth + 6) * thumbSrc.length;
    
    $('.thumbstrip').css('width', thumbstripwidth)
    
    var imagesJQ = $('.thumbstrip').contents('img');
    
    imagesJQ.mouseup(function(){
       $('#shade').show();
       $('#shade').fadeTo('fast', 0.5);
       
       var thumbsource = new String(this.src);
       var imagesource = thumbsource.replace("M","V");
       
       var bigImage = new Image();
       bigImage.src = imagesource;
       
       $("#imageshow").empty();
       $("#imageshow").append(bigImage);
       $("#imageshow").show();       
       $("#imageshow").fadeTo('fast', 1.0);
    });
    
    $("#imageshow").click(showThumbstrip);
    
    $("#shade").click(showThumbstrip);
    
 
    $('#leftSlide').mouseover(function() {
        var tstrip = $('.thumbstrip');

        var pps = 500;
        var pos = tstrip.get()[0].offsetLeft;

        var animTime = (-pos / pps) * 1000;

        if (tstrip.position().left < 0) {
            tstrip.animate({ left: 0 }, animTime)
        }
    });

    $('#rightSlide').mouseover(function() {
        var tstrip = $('.thumbstrip');
        var rotor = $('#boxRot');
        
        var pps = 500;
        var pos = tstrip.get()[0].offsetLeft;

        var stripRight = tstrip.position().left + tstrip.width();

        if (stripRight > rotor.width()) {
            var mostLeft = rotor.width() - tstrip.width();
            var animTime = ((pos - mostLeft) / pps) * 1000;

            tstrip.animate({ left: mostLeft }, animTime)
        }
    });

    $('#leftSlide').mouseleave(function() {
        $('.thumbstrip').stop();
    });
    $('#rightSlide').mouseleave(function() {
        $('.thumbstrip').stop();
    });
    
    $('#leftSlide').mousedown(hideSlide);
    $('#rightSlide').mousedown(hideSlide);

});