/*!
 * slideViewerPro 1.0
 * Examples and documentation at: 
 * http://www.gcmingati.net/wordpress/wp-content/lab/jquery/svwt/
 * 2009 Gian Carlo Mingati
 * Version: 1.0.4 (12-AUGUST-2009)
 * Dual licensed under the MIT and GPL licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 * Requires:
 * jQuery v1.3.2 or later
 * Option:
 * jQuery Timers plugin | plugins.jquery.com/project/timers (for autoslide mode)
 * 
 */
jQuery.extend( jQuery.easing, // from the jquery.easing plugin
{
    easeInOutExpo: function (x, t, b, c, d) {
        if (t==0) return b;
        if (t==d) return b+c;
        if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
        return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
    }
});
jQuery(function(){
   jQuery("div.svwp").prepend("<img src='http://www.test1.bbdev.com.ar/na-sa.com.ar/webroot/img/svwloader2.gif' class='ldrgif' alt='loading...'/ >"); //change with YOUR loader image path   
});
var j = 0;
jQuery.fn.slideViewerPro = function(settings) {
      settings = jQuery.extend({
            galBorderWidth: 6,
            thumbsTopMargin: 3, 
            thumbsRightMargin: 3,
            thumbsBorderWidth: 3,
            buttonsWidth: 20,
            galBorderColor: "#ff0000",
            thumbsBorderColor: "#000",
            thumbsActiveBorderColor: "#ff0000",
            buttonsTextColor: "#ff0000",
            thumbsBorderOpacity: 1.0, // could be 0, 0.1 up to 1.0
            thumbsActiveBorderOpacity: 1.0, // could be 0, 0.1 up to 1.0
            easeTime: 750,
            asTimer: 4000,
            thumbs: 5,
            thumbsPercentReduction: 12,
            thumbsVis: true,
            easeFunc: "easeInOutExpo",
            leftButtonInner: "-", //could be an image "<img src='images/larw.gif' />" or an escaped char as "&larr";
            rightButtonInner: "+", //could be an image or an escaped char as "&rarr";
            autoslide: false,
            typo: false,
            typoFullOpacity: 0.9,
            shuffle: false,
            thumbnailsSource: null
        }, settings);
        
    return this.each(function(){
        function shuffle(a) {
            var i = a.size();
            while (--i) {
                var j = Math.floor(Math.random() * (i));
                var tmp = a.slice(i, i+1);
                a.slice(j, j+1).insertAfter(tmp);
            }
        }
        var container = jQuery(this);
        (!settings.shuffle) ? null : shuffle(container.find("li"));
        container.find("img.ldrgif").remove();
        container.removeClass("svwp").addClass("slideViewer");    
        container.attr("id", "svwp"+j);
        //container.css('height', 'auto');
        var pictWidth = container.find("img").attr("width");
        var pictHeight = container.find("img").attr("height");
        var pictEls = container.find("li").size();
        (pictEls >= settings.thumbs) ? null : settings.thumbs = pictEls;
        var slideViewerWidth = pictWidth*pictEls;
        var thumbsWidth = Math.round(pictWidth*settings.thumbsPercentReduction/100);
        var thumbsHeight =  Math.round(pictHeight*settings.thumbsPercentReduction/100);
        var pos = 0;
        var r_enabled = true;
        var l_enabled = true;
        var browser = navigator.appName;
        var brow = navigator.userAgent;
        var fireFox = "Firefox/";
        var chrome = "Chrome";
    container.find("ul").css("width" , slideViewerWidth)
    .wrap(jQuery("<div style='width:452px; overflow: hidden; position: relative; top: 0; left: 0'; id='sliderContainer'>"));
        container.css("width", pictWidth);
        //container.css("height", pictHeight);
        container.each(function(i) {
            
            jQuery(this).after("<div class='thumbSlider' id='thumbSlider" + j + "'><ul><\/ul><\/div>");
            jQuery(this).next().after("<a href='#' class='left' id='left" + j + "'><span id='less'>"+settings.leftButtonInner+"</span><\/a><a href='#' class='right' id='right" + j + "'><span id='more'>"+settings.rightButtonInner+"<\/span><\/a>");
            
            //alert(jQuery(this).find("img").attr("src"));
            jQuery(this).find("li").each(function(n) { 
                thumbSource = jQuery(this).find("img").attr("src");
                imgHeight = jQuery(this).find("img").attr("height");
                if(imgHeight > 257) {
                    typeImage = "big";
                } else {
                    typeImage = "average";
                }
                thumbName = thumbSource.split("/");
                thumbSrc = "";
                for(i = 1; i < thumbName.length-2; i++) {
                    thumbSrc = thumbSrc + thumbName[i];
                    thumbSrc = thumbSrc + '/';
                }
                jQuery("div#thumbSlider" + j + " ul").append("<li><a title='" + jQuery(this).find("img").attr("alt") + "' href='#'><img width='"+ thumbsWidth +"' height='"+ thumbsHeight +"' src='/" + thumbSrc + "thumbnails/images/" + thumbName[thumbName.length-1] + "' name='" + typeImage + "' /><p class='tmbrdr'>&nbsp;<\/p><\/a><\/li>");
            });
            if(settings.typo) {
                if(browser == "Netscape") {
                    marginThumbs = 0;
                } else {
                    marginThumbs = pictWidth;
                }
                jQuery(this).find("img").each(function(z) {
                    jQuery(this).after("<span class='typo' style='position: absolute; width:452px; margin: 0 0 0 -"+marginThumbs+"px'>"+jQuery(this).attr("alt")+"<\/span>");
                });
            }
            jQuery("div#thumbSlider" + j + " a").each(function(z) {            
                jQuery(this).bind("click", function(){
                    if(browser == "Netscape") {
                        animateHigh = 1500;
                        animateAvergae = 1500;
                    } else {
                        animateHigh = 800;
                        animateAvergae = 0;
                    }
                    if($(this).children('img').attr('name') == 'big') {
                        $("#svwp0").animate({height: "543px"}, animateHigh);
                        li = $(this).parent().find("li");
                        li.css("height", "540px");
                        $(".typo").css("top", "500px");
                        if(browser == 'Microsoft Internet Explorer') {
                            $(".typo").css("margin", "0 0 0 0px");
                            $(".myslider").css("top", "12px");
                            $(".typo").css("margin", "0 0 0 -392");
                        }
                        $("#sliderContainer").css("height", "543px");
                       
                    } else {
                        $("#svwp0").animate({height: "300px"}, animateAvergae);
                        $(".typo").css("top", "265px");
                        if(browser == 'Microsoft Internet Explorer') {
                            //alert($(this).children('img').attr("name"));
                            $(".typo").css("margin", "0 0 0 -452");
                        } 
                    }
                    jQuery(this).find("p.tmbrdr").css({borderColor: settings.thumbsActiveBorderColor, opacity: settings.thumbsActiveBorderOpacity});
                    jQuery(this).parent().parent().find("p.tmbrdr").not(jQuery(this).find("p.tmbrdr")).css({borderColor: settings.thumbsBorderColor, opacity: settings.thumbsBorderOpacity});
                    var cnt = -(pictWidth*z);
                    (cnt != container.find("ul").css("left").replace(/px/, "")) ? container.find("span.typo").animate({"opacity": 0}, 250) : null ;
                    container.find("ul").animate({ left: cnt}, settings.easeTime, settings.easeFunc, function(){container.find("span.typo").animate({"opacity": settings.typoFullOpacity}, 250)});                    
                    return false;
                });
            });
            // shortcuts to +/- buttons
            var jQuerybtl = jQuery("a#left" + j);    
            var jQuerybtr = jQuery("a#right" + j);    
            
            // right/left             
            jQuerybtr.bind("click", function(){
                    if (r_enabled) (pictEls-pos > settings.thumbs*2 || pictEls%settings.thumbs == 0)? pos += settings.thumbs : pos += pictEls % settings.thumbs;
                    r_enabled = false;
                    jQuery(this).prev().prev().find("ul:not(:animated)").animate({ left: -(thumbsWidth+settings.thumbsRightMargin)*pos}, 500, settings.easeFunc, function(){authorityMixing();});                    
                    return false;
            });
            jQuerybtl.bind("click", function(){    
                    if (l_enabled && pos!=0) (pictEls-pos > settings.thumbs || pictEls%settings.thumbs == 0)? pos -= settings.thumbs : pos -= pictEls % settings.thumbs;
                    l_enabled = false;
                    jQuery(this).prev().find("ul:not(:animated)").animate({ left: -(thumbsWidth+settings.thumbsRightMargin)*pos}, 500, settings.easeFunc, function(){authorityMixing();});            
                    return false;
            });                        
            
            function authorityMixing()
            {                
                
                //right btt
                (pos == pictEls-settings.thumbs) ? jQuerybtr.addClass("r_dis") : jQuerybtr.removeClass("r_dis");
                (pos == pictEls-settings.thumbs) ? r_enabled = false : r_enabled = true;
                //left btt
                (pos == 0) ? jQuerybtl.addClass("l_dis") : jQuerybtl.removeClass("l_dis");
                (pos == 0) ? l_enabled = false : l_enabled = true;
            }
            
            //CSS    defs @ runtime
            var tBorder = settings.thumbsBorderWidth;
            var contBorder = settings.galBorderWidth
            
            jQuery(".slideViewer a img").css({border: "0"});
            if(settings.typo)
            {
                jQuery(this).find("span.typo").each(function(z) {
                    jQuery(this).css({opacity: settings.typoFullOpacity});
                });
            }
            jQuery("div#svwp"+ j).css({border: settings.galBorderWidth +"px solid "+settings.galBorderColor});
            
            jQuery("div#thumbSlider" + j).css({position: "relative", left: contBorder, top: settings.thumbsTopMargin+"px", width: settings.thumbs*thumbsWidth+((settings.thumbsRightMargin*settings.thumbs)-settings.thumbsRightMargin), height: thumbsHeight, textAlign: "center", overflow: "hidden", margin: "0 auto"});
            jQuery("div#thumbSlider" + j + " ul").css({width: (thumbsWidth*pictEls)+settings.thumbsRightMargin*pictEls, position: "relative", left: "0", top: "0"});
            jQuery("div#thumbSlider" + j + " ul li").css({marginRight: settings.thumbsRightMargin});
                    
            jQuery("div#thumbSlider" + j).find("p.tmbrdr").css({width: (thumbsWidth-tBorder*2)+"px", height: (thumbsHeight-tBorder*2) +"px", top: -(thumbsHeight) +"px", border: settings.thumbsBorderWidth +"px solid "+settings.thumbsBorderColor, opacity: settings.thumbsBorderOpacity});            
            jQuery("div#thumbSlider" + j + " a:first p.tmbrdr").css({borderColor: settings.thumbsActiveBorderColor, opacity: settings.thumbsActiveBorderOpacity});
            
            var rbttLeftMargin = (pictWidth/2) + (jQuery("div#thumbSlider" + j).width()/2) + settings.thumbsRightMargin + contBorder;
            var lbttLeftMargin = (pictWidth/2) - (jQuery("div#thumbSlider" + j).width()/2) - (settings.buttonsWidth + settings.thumbsRightMargin) + contBorder;            
            var innerImgH = jQuery("a#right" + j + " span img").attr("height");
            

            authorityMixing();
            
            
            
            /*if(settings.autoslide) {
                    
                    var i = 1;
                    
                    jQuery("div#thumbSlider" + j).everyTime(settings.asTimer, "asld", function() {            
                      jQuery(this).find("a").eq(i).trigger("click");
                      if(i == 0)
                      {
                        pos = 0;
                        l_enabled = false;
                        jQuery("div#thumbSlider" + j).find("ul:not(:animated)").animate({ left: -(thumbsWidth+settings.thumbsRightMargin)*pos}, 500, settings.easeFunc, function(){authorityMixing();});
                      }
                      else l_enabled = true;
                      
                        (i%settings.thumbs == 0)? jQuery(this).next().next().trigger("click") : null;
                        (i < pictEls-1)?    i++ : i=0;                      
                    });        
                    
                    //stops autoslidemode    
                    jQuery("a#right" + j).bind("mouseup", function(){
                        jQuery(this).prev().prev().stopTime("asld");
                });
                    jQuery("a#left" + j).bind("mouseup", function(){
                        jQuery(this).prev().stopTime("asld");    
                    });
                    jQuery("div#thumbSlider" + j + " a").bind("mouseup", function(){
                        jQuery(this).parent().parent().parent().stopTime("asld");
                    });
            }*/
            var uiDisplay = (settings.thumbsVis)? "block":"none";
            jQuery("div#thumbSlider" + j + ", a#left" + j + ", a#right" + j).wrapAll("<div id='ui"+j+"' class='myslider'><\/div>");            
            jQuery("div#svwp"+ j + ", div#ui" + j).wrapAll("<div style='width:"+ pictWidth +"px'><\/div>");
            });
            
            if(browser == "Netscape") {
                 matchExpF = brow.search(fireFox);
                 if(matchExpF != -1) {
                     $("#more").css("margin", "0 0 0 5px");
                     $('.thumbSlider').css("position","relative");
                     $('.thumbSlider').css("display","block");
                     $('.thumbSlider').css("left","15px");
                     $(".right").css("left", "445px");
                 }
                 matchExpC = brow.search(chrome);
                 if(matchExpC != -1) {
                     $('.thumbSlider').css("display","block");
                     $('.thumbSlider').css("right","350px");
                     $(".right").css("left", "452px");
                     $(".mySlider").css("left", "-12px");
                 }
                     $(".left").css("height", "150px");
                     $(".left").css("top", "0px");
                     $(".right").css("height", "150px");
                     $(".right").css("top", "0px");
            } else {
                $(".left").css("margin", "-61px 0 0 -237px");
                $(".right").css("margin", "-61px 0px 0px 204px");
            }
            
            (jQuery("div#thumbSlider" + j).width()+(settings.buttonsWidth*2) >= pictWidth)? alert("ALERT: THE THUMBNAILS SLIDER IS TOO WIDE! \nthumbsPercentReduction and/or buttonsWidth needs to be scaled down!") : null;
        j++;
  });    
};