/*!
 * 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 el   = obj.group[ i ],
href = thumbSource( el );

if (!href) {
return;
}

$("<img />").on("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)
.attr('title', el.title);
});

//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));