/*!

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