/*!
* Thumbnail helper for fancyBox
* version: 1.0.7 (Mon, 01 Oct 2012)
* @requires fancyBox v2.0 or later
*
* Usage:
*     $(".fancybox").fancybox({
*         helpers : {
*             thumbs: {
*                 width  : 50,
*                 height : 50
*             }
*         }
*     });
*
*/

(function ($) {

//Shortcut for fancyBox object
var F = $.fancybox;

//Add helper object
F.helpers.thumbs = {
        defaults : {
                width    : 50,       // thumbnail width
                height   : 50,       // thumbnail height
                position : 'bottom', // 'top' or 'bottom'
                source   : function ( item ) {  // function to obtain the URL of the thumbnail image
                        var href;

                        if (item.element) {
                                href = $(item.element).find('img').attr('src');
                        }

                        if (!href && item.type === 'image' && item.href) {
                                href = item.href;
                        }

                        return href;
                }
        },

        wrap  : null,
        list  : null,
        width : 0,

        init: function (opts, obj) {
                var that = this,
                        list,
                        thumbWidth  = opts.width,
                        thumbHeight = opts.height,
                        thumbSource = opts.source;

                //Build list structure
                list = '';

                for (var n = 0; n < obj.group.length; n++) {
                        list += '<li><a style="width:' + thumbWidth + 'px;height:' + thumbHeight + 'px;" href="javascript:jQuery.fancybox.jumpto(' + n + ');"></a></li>';
                }

                this.wrap = $('<div id="fancybox-thumbs"></div>').addClass(opts.position).appendTo('body');
                this.list = $('<ul>' + list + '</ul>').appendTo(this.wrap);

                //Load each thumbnail
                $.each(obj.group, function (i) {
                        var href = thumbSource( obj.group[ i ] );

                        if (!href) {
                                return;
                        }

                        $("<img />").load(function () {
                                var width  = this.width,
                                        height = this.height,
                                        widthRatio, heightRatio, parent;

                                if (!that.list || !width || !height) {
                                        return;
                                }

                                //Calculate thumbnail width/height and center it
                                widthRatio  = width / thumbWidth;
                                heightRatio = height / thumbHeight;

                                parent = that.list.children().eq(i).find('a');

                                if (widthRatio >= 1 && heightRatio >= 1) {
                                        if (widthRatio > heightRatio) {
                                                width  = Math.floor(width / heightRatio);
                                                height = thumbHeight;

                                        } else {
                                                width  = thumbWidth;
                                                height = Math.floor(height / widthRatio);
                                        }
                                }

                                $(this).css({
                                        width  : width,
                                        height : height,
                                        top    : Math.floor(thumbHeight / 2 - height / 2),
                                        left   : Math.floor(thumbWidth / 2 - width / 2)
                                });

                                parent.width(thumbWidth).height(thumbHeight);

                                $(this).hide().appendTo(parent).fadeIn(300);

                        }).attr('src', href);
                });

                //Set initial width
                this.width = this.list.children().eq(0).outerWidth(true);

                this.list.width(this.width * (obj.group.length + 1)).css('left', Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5)));
        },

        beforeLoad: function (opts, obj) {
                //Remove self if gallery do not have at least two items
                if (obj.group.length < 2) {
                        obj.helpers.thumbs = false;

                        return;
                }

                //Increase bottom margin to give space for thumbs
                obj.margin[ opts.position === 'top' ? 0 : 2 ] += ((opts.height) + 15);
        },

        afterShow: function (opts, obj) {
                //Check if exists and create or update list
                if (this.list) {
                        this.onUpdate(opts, obj);

                } else {
                        this.init(opts, obj);
                }

                //Set active element
                this.list.children().removeClass('active').eq(obj.index).addClass('active');
        },

        //Center list
        onUpdate: function (opts, obj) {
                if (this.list) {
                        this.list.stop(true).animate({
                                'left': Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5))
                        }, 150);
                }
        },

        beforeClose: function () {
                if (this.wrap) {
                        this.wrap.remove();
                }

                this.wrap  = null;
                this.list  = null;
                this.width = 0;
        }
}

}(jQuery));