/**
 * jQuery Image Scroller
 * Copyright (c) 2011 Allan Ma (http://codecanyon.net/user/webtako)
 * Version: 1.3 (02/27/2011)
 */
;(function($) {
    $.fn.wtScroller = function(params) {		
        var TOP = "top";
        var BOTTOM = "bottom";
        var OUTSIDE = "outside";
        var INSIDE = "inside";
        var SLIDE_OPACITY = 1;		
        var BUTTON_OPACITY = 0.7;
        var SCROLL_SPEED = 1000;
        var DEFAULT_DURATION = 600;
        var ANIMATE_SPEED = 300;
        var DEFAULT_DELAY = 4000;
        var UPDATE_BUTTONS ="update_buttons";
        var UPDATE_THUMB = 	"update_thumb";
        var UPDATE_INDEX = 	"update_index";
        var UPDATE_TEXT =	"update_text";
        var START_TIMER = 	"start_timer";
        var LB_OPEN = "lightbox_open";
        var LB_CLOSE = "lightbox_close";
        
        //Class Scroller
        function Scroller($obj, opts) {
            var numDisplay = 		getPosNumber(opts.num_display,3);
            var slideWidth = 		getPosNumber(opts.slide_width,300);
            var slideHeight = 		getPosNumber(opts.slide_height,200);
            var slideMargin = 		getNonNegNumber(opts.slide_margin,1);
            var margin = 			getNonNegNumber(opts.margin,10);
            var buttonWidth =		getPosNumber(opts.button_width,35);
            var ctrlHeight =		getPosNumber(opts.ctrl_height,20);
            var autoScroll = 		opts.auto_scroll;
            var delay = 			getPosNumber(opts.delay,DEFAULT_DELAY);
            var duration = 			getPosNumber(opts.scroll_speed,SCROLL_SPEED);
            var easing = 			opts.easing;
            var autoScale =			opts.auto_scale;
            var displayButtons = 	opts.display_buttons;
            var ctrlType =			opts.ctrl_type.toLowerCase();
            var displayCaption = 	opts.display_caption;
            var mouseoverCaption = 	opts.mouseover_caption;
            var captionPos = 		opts.caption_position.toLowerCase();
            var captionAlign = 		opts.caption_align.toLowerCase();
            var moveBy1 = 			opts.move_one;
            var contNav = 			opts.cont_nav;
            var shuffle =			opts.shuffle;
            
            var $scroller;
            var $slidePanel;
            var $slideList;
            var $slides;
            var $prevBtn;			
            var $nextBtn;
            var $cbar;
            var $indexes;			
            var $scrollbar;
            var $thumb;
            var $items;
            
            var numItems;
            var unitSize;
            var prevSlots;
            var nextSlots;
            var maxSlots;	
            var range;
            var pos;	
            var timerId;
            var extOffset;
            var extHeight;
            var prevPct;
            
            this.init = function() {
                $scroller =   $(".wt-scroller", $obj);
                $slidePanel = $scroller.find(".slides");
                $slideList =  $slidePanel.find(">ul:first");
                $slides =	  $slideList.find(">li");
                $cbar = 	  $scroller.find(".lower-panel");
                $prevBtn =    $scroller.find(".prev-btn");			
                $nextBtn =    $scroller.find(".next-btn");
                extOffset = 0;
                extHeight = 0;
                pos = 0;
                prevPct = -1;
                timerId = null;
                numItems = $slides.size();
                if (numItems <= numDisplay) {
                    displayButtons = false;
                    ctrlType = "none";
                    numDisplay = numItems;
                }
                if (ctrlType == "index") {
                    moveBy1 = false;
                }
                
                //init components
                initItems();
                initSlidePanel();
                initCtrls();
                
                $scroller.css({width:$slidePanel.width(), height:$slidePanel.height() + $cbar.outerHeight(), "padding-top": margin});
                
                if (shuffle) {
                    shuffleItems();
                }
                updateCPanel();
                $(document).bind(LB_CLOSE, onFocus).bind(LB_OPEN, onBlur);
                $scroller.trigger(LB_CLOSE);
            }
            
            //init slides
            var initItems = function() {
                initCaptions();
                $items = new Array(numItems);
                $slides.each(
                    function(n) {						
                        var $img = $(this).find("img:first");
                        var $link = $(this).find(">a:first");
                        if (!$link.attr("href")) {
                            $(this).click(preventDefault);
                            $link.css("cursor", "default");
                        }
                        else {
                            $link.data("text",$(this).find(">p:first").html());
                        }
                        if (autoScale) {
                            $img[0].complete || $img[0].readyState == "complete" ? processImg($img) : $img.load(processLoadedImg);
                        }
                        if (displayCaption && captionPos == INSIDE) {
                            initCaption($(this));						
                        }
                        $items[n] = $(this);						
                    });		
            }
            
            //init captions
            var initCaptions = function() {
                var $captions = $slides.find(">p:first");
                if (displayCaption) {
                    var padding = $captions.outerWidth() - $captions.width();
                    $captions.css({width:slideWidth - padding, visibility:"visible"}).click(preventDefault);
                    if (captionPos == OUTSIDE) {
                        var heights = $captions.map(function() { return $(this).height(); }).get();
                        var maxHeight = Math.max.apply(Math, heights);					
                        $captions.css({top:captionAlign == TOP ? 0 : slideHeight, height:maxHeight});
                        
                        extHeight = $captions.outerHeight();					
                        if (captionAlign == TOP) {
                            extOffset = extHeight;
                        }
                        $captions.addClass("outside");
                    }
                    else {
                        $captions.addClass("inside");
                    }					
                }
                else {
                    $captions.hide();
                }
            }
            
            //init caption
            var initCaption = function($item) {
                var $caption = $item.find(">p:first");				
                if ($caption.length < 1 || $caption.html() == "") {
                    $caption.remove();
                    return;
                }
                if (mouseoverCaption) {
                    $caption.css("top", captionAlign == TOP ? -$caption.outerHeight() : slideHeight);
                    $item.hover(showCaption, hideCaption);
                }
                else {
                    $caption.css("top", captionAlign == TOP ? 0 : slideHeight - $caption.outerHeight());
                }
            }
            
            //init slide panel
            var initSlidePanel = function() {
                $slides.css({width:slideWidth, height:slideHeight + extHeight, "margin-right":slideMargin}).hover(itemMouseover, itemMouseout);
                $slidePanel.css({width:(numDisplay * $slides.width()) + ((numDisplay - 1) * slideMargin), height:$slides.height()});
                unitSize = $slides.outerWidth(true);
                var num;
                if (ctrlType == "index") {
                    num = numDisplay * Math.ceil(numItems/numDisplay);
                }
                else {
                    num = numItems;
                }
                $slideList.width(num * unitSize);
                maxSlots = num - numDisplay;
                prevSlots = 0;
                nextSlots = maxSlots;
                    
                range = (($slideList.width() - slideMargin) - $slidePanel.width());
            }
            
            var initCtrls = function() {
                initButtons();
                $cbar.css({width:$slidePanel.width(), "padding-left":0, "padding-right":0});
                switch(ctrlType) {
                    case "scrollbar":
                        initScrollbar();
                        var ctrlMargin = Math.max((ctrlHeight - $scrollbar.height())/2, 0);
                        $cbar.css({"padding-top":ctrlMargin, "padding-bottom":ctrlMargin});
                        break;
                    case "index":
                        initIndexes();
                        var ctrlMargin = Math.max((ctrlHeight - $indexes.height())/2, 0);
                        $cbar.css({"padding-top":ctrlMargin, "padding-bottom":ctrlMargin});
                        break;
                    default:
                        $cbar.remove();
                        $scroller.css("padding-bottom", margin);
                }				
            }
            
            //init buttons
            var initButtons = function() {							
                if (displayButtons) {
                    $prevBtn.css({width:buttonWidth, height:9}).mousedown(preventDefault).click(moveBack);
                    $nextBtn.css({width:buttonWidth, height:9}).mousedown(preventDefault).click(moveFwd);
                    if (!contNav) {
                        $scroller.bind(UPDATE_BUTTONS, updateButtons);
                    }
                }
                else {
                    $prevBtn.remove();
                    $nextBtn.remove();
                    $scroller.css({"padding-left":margin, "padding-right":margin});
                }
            }
            
            //update buttons
            var updateButtons = function() {
                var begIndex = Math.abs(pos/unitSize);
                var endIndex = begIndex + numDisplay;
                $prevBtn.css(begIndex > 0 ? {opacity:1, cursor:"pointer"} : {opacity:BUTTON_OPACITY, cursor:"default"});
                $nextBtn.css(endIndex < numItems ? {opacity:1, cursor:"pointer"} : {opacity:BUTTON_OPACITY, cursor:"default"});
            }
            
            //init scrollbar
            var initScrollbar = function() {				
                $cbar.append("<div class='scroll-bar'><div class='thumb'></div></div>");
                $scrollbar = $cbar.find("div.scroll-bar");
                $thumb = 	 $cbar.find("div.thumb");				
                $scrollbar.width($cbar.width()).click(trackClick).mousedown(preventDefault);				
                $thumb.width(Math.ceil((numDisplay/numItems) * $scrollbar.width())).click(preventDefault);

                var scrollRange = $scrollbar.width() - $thumb.width();
                var moveRatio = range/scrollRange;
                try {
                    $thumb.draggable({containment: "parent"})
                          .bind("drag", function() { $slideList.css({left: Math.round(-$thumb.position().left * moveRatio)}); })
                          .bind("dragstop", function() { autoStop($thumb.position().left/scrollRange); });
                }
                catch (ex) { //not draggable. 
                }
                
                $scroller.bind(UPDATE_THUMB, 
                               	function() {
                                    var move = Math.round(Math.abs(pos) * (1/moveRatio));				
                                    $thumb.stop(true, true).animate({left:move}, duration, easing);
                                });
            }
            
            //init indexes
            var initIndexes = function() {
                var n = Math.ceil(numItems/numDisplay);
                var str = "";
                for (var i = 0; i < n; i++) {
                    str += "<span class='index'></span>";
                }
                $cbar.prepend(str);
                $indexes = $cbar.find(".index").mousedown(preventDefault).bind("click", goToIndex);
                $scroller.bind(UPDATE_INDEX, updateIndexes);				
            }
                
            //update indexes
            var updateIndexes = function() {
                var i = Math.ceil(prevSlots/numDisplay);
                $indexes.filter(".index-hl").removeClass("index-hl");
                $($indexes.get(i)).addClass("index-hl");
            }
            
            //update slide list
            var updateSlideList = function() {
                pos = -prevSlots * unitSize;
                $slideList.stop(true, true).animate({left:pos}, duration, easing, 
                                                            function() { 
                                                                $scroller.trigger(START_TIMER); 
                                                            });
                updateCPanel();
            }
            
            //update controls
            var updateCPanel = function() {
                $scroller.trigger(UPDATE_BUTTONS).trigger(UPDATE_THUMB).trigger(UPDATE_INDEX);					
            }
            
            //track click
            var trackClick = function(e) {
                autoStop((e.pageX - $scrollbar.offset().left)/$scrollbar.width());
            }
            
            //auto stop
            var autoStop = function(pct) {
                if (pct != prevPct) {
                    prevPct = pct;
                    var move;
                    var newPos = pct * range;
                    if (newPos > Math.abs(pos)) {
                        move = Math.ceil(newPos/unitSize);			
                    }
                    else if (newPos < Math.abs(pos)) {
                        move = Math.floor(newPos/unitSize);
                    }
                    else {
                        return;
                    }
                    var slots = move + (pos/unitSize);			
                    prevSlots += slots;
                    nextSlots -= slots;
                    updateSlideList();
                }
            }
            
            //go to index			
            var goToIndex = function() {
                stopTimer();
                prevSlots = $(this).index() * numDisplay;
                nextSlots = maxSlots - prevSlots;
                updateSlideList();
                return false;
            }
            
            //move slides back
            var moveBack = function() {
                stopTimer();
                if (nextSlots < maxSlots) {
                    var slots = moveBy1 ? 1 : Math.min(maxSlots - nextSlots, numDisplay);
                    nextSlots += slots;
                    prevSlots -= slots;
                }
                else if (contNav) {
                    nextSlots = 0;
                    prevSlots = maxSlots;
                }
                else {
                    return;
                }
                updateSlideList();
            }
            
            //move slides forward
            var moveFwd = function() {
                stopTimer();
                if (prevSlots < maxSlots) {
                    var slots = moveBy1 ? 1 : Math.min(maxSlots - prevSlots, numDisplay);
                    prevSlots += slots;
                    nextSlots -= slots;
                }
                else if (contNav) {
                    prevSlots = 0;
                    nextSlots = maxSlots;		
                }
                else {
                    return;
                }
                updateSlideList();
            }
            
            //rotate slides forward
            var rotateFwd = function() {
                stopTimer();
                if (prevSlots < maxSlots) {
                    var slots = moveBy1 ? 1 : Math.min(maxSlots - prevSlots, numDisplay);
                    prevSlots += slots;
                    nextSlots -= slots;					
                }
                else {
                    prevSlots = 0;
                    nextSlots = maxSlots;		
                }
                updateSlideList();
            }
            
            //process loaded image size & position
            var processLoadedImg = function() {
                processImg($(this));
            }
            
            //process image
            var processImg = function($img) {
                if ($img.outerWidth() > 0 && $img.outerHeight() > 0) {
                    var sizeRatio;
                    if ($img.outerWidth() > slideWidth) {
                        sizeRatio = $img.outerHeight()/$img.outerWidth();
                        $img.css({width:slideWidth, height:sizeRatio * slideWidth});
                    }
                    if ($img.outerHeight() > slideHeight) {
                        sizeRatio = $img.outerWidth()/$img.outerHeight();
                        $img.css({width:sizeRatio * slideHeight, height:slideHeight});
                    }
                    $img.css({left:Math.round((slideWidth - $img.outerWidth())/2), top:extOffset + Math.round((slideHeight - $img.outerHeight())/2)});
                }
            }
            
            //scroller blur
            var onBlur = function() {
                $scroller.unbind(START_TIMER).unbind("mouseenter").unbind("mouseleave");
                stopTimer();
                $(document).unbind("keyup", onScrollKeyPress);
            }
            
            //scroller focus
            var onFocus = function() {
                if (autoScroll) {
                    $scroller.bind(START_TIMER, startTimer).hover(scrollerOver, scrollerOut).trigger(START_TIMER);
                }
                $(document).bind("keyup", onScrollKeyPress);
            }
            
            //item mouseover
            var itemMouseover = function() {
                $(this).find("img:first").stop().animate({opacity:SLIDE_OPACITY}, ANIMATE_SPEED);				
            }
            
            //item mouseout
            var itemMouseout = function() {
                $(this).find("img:first").stop().animate({opacity:1}, ANIMATE_SPEED, 
                    function() {
                        if (jQuery.browser.msie) {
                            this.style.removeAttribute('filter');						
                        }
                    });
            }
            
            //show caption
            var showCaption = function() {
                var $caption = $(this).find(">p:first");
                $caption.stop().animate({top:captionAlign == BOTTOM ? slideHeight - $caption.outerHeight() : 0}, ANIMATE_SPEED);
            }
            
            //hide caption
            var hideCaption = function() {
                var $caption = $(this).find(">p:first"); 
                $caption.stop().animate({top:captionAlign == BOTTOM ? slideHeight : -$caption.outerHeight()}, ANIMATE_SPEED);
            }
            
            //scroller over
            var scrollerOver = function() {
                $scroller.unbind(START_TIMER);
                stopTimer();
            }
            
            //scroller out
            var scrollerOut = function() {
                $scroller.bind(START_TIMER, startTimer).trigger(START_TIMER);
            }
            
            //key press
            var onScrollKeyPress = function(e) {
                switch(e.keyCode) {
                    case 37:
                        moveBack();
                        break;
                    case 39:
                        moveFwd();
                        break;
                }
            }
            
            //prevent default behavior
            var preventDefault = function() {
                return false;
            }
            
            //shuffle items
            var shuffleItems = function() {		
                for (var i = 0; i < $items.length; i++) {
                    var ri = Math.floor(Math.random() * $items.length);
                    var temp = $items[i];	
                    $items[i] = $items[ri];
                    $items[ri] = temp;				
                }
                
                for (var i = 0; i < $items.length; i++) {
                    $items[i] = $items[i].clone(true);
                }
                
                for (var i = 0; i < $items.length; i++) {
                    $($slides.get(i)).replaceWith($items[i]);
                }
            }
            
            //start timer
            var startTimer = function() {
                if (timerId == null) {
                    timerId = setTimeout(rotateFwd, delay);
                }
            }
            
            //stop timer
            var stopTimer = function() {
                clearTimeout(timerId);
                timerId = null;
            }
        }
        
        //get positive number
        var getPosNumber = function(val, defaultVal) {
            if (!isNaN(val) && val > 0) {
                return val;
            }
            return defaultVal;
        }
        
        //get nonnegative number
        var getNonNegNumber = function(val, defaultVal) {
            if (!isNaN(val) && val >= 0) {
                return val;
            }
            return defaultVal;
        }
        
        var defaults = { 
            num_display:3,
            slide_width:300,
            slide_height:200,
            slide_margin:1,
            button_width:35,
            ctrl_height:20,
            margin:10,	
            auto_scroll:true,
            delay:DEFAULT_DELAY,
            scroll_speed:SCROLL_SPEED,
            easing:"",
            auto_scale:true,
            move_one:false,
            ctrl_type:"scrollbar",
            display_buttons:true,
            display_caption:true,
            mouseover_caption:false,
            caption_align:BOTTOM,
            caption_position:INSIDE,
            cont_nav:true,
            shuffle:false
        };
        
        var opts = $.extend(true, {}, defaults, params);		
        return this.each(
            function() {
                var scroller = new Scroller($(this), opts);
                scroller.init();
            }
        );
    }
})(jQuery);