var listBigImages = [];

$(document).ready(function(){
	if($.fn.bvViewer){
	 $('#detail-product-photos-thumbs img').wrap( $('<a href="#"/>') );
	                $.fn.bvViewer({images:listBigImages});
	                $('#detail-product-photos-zoom').click(function(){ $.bvViewer.open() });
	}
});


(function($) {
	var opt = {}, debug, $overlay = $('<div id="detail-product-photos-overlay"></div>'), $wraper = $('<div id="detail-product-photos-wrap"></div>'), $navThumbsBig = $('<div id="detail-product-photos-nav"></div>'), $navs = {
		left : $('<span class="detail-product-photos-nav-left nav" >&nbsp;</span>'),
		right : $('<span class="detail-product-photos-nav-right nav" >&nbsp;</span>')
	}, content = $('#detail-product-photos-big'), $content = $('<div id="detail-product-photos-big" style="overflow: hidden; overflow-x: hidden; overflow-y: hidden"></div>'), $btnClose = $('<span id="detail-product-photos-close" ></span>'), $container = $('<div id="detail-product-photos-container" ></div>'), $containerShadow = $('<div id="detail-product-photos-container-shadow" ></div>'), $containerShadowIE = $('<div id="detail-product-photos-container-shadow-ie" ></div>'), $tooltip = $('<span class="tooltip"></span>'), $tooltipR = {
		plus : $('<span class="tooltip toolPlus" ></span>'),
		minus : $('<span id="toolMinus" class="tooltip toolMinus" ></span>')
	}, isIE6 = !$.support.opacity && !window.XMLHttpRequest, isIE = false, $arrowNavs, $medidas = new Array(), wrapsImg = $('<div class="wrap" />'), aumentosW = new Array(), aumentosH = new Array(), _debug = function(
			msg) {
		if (!opt.debugable) {
			debug = function(ms) {
			};
			return false;
		}
		if (jQuery.browser.mozilla && typeof window.console !== 'undefined'
				&& typeof window.console.log !== 'undefined') {
			debug = window.console.log;
			return true
		} else {
			debug = alert;
			return true;
		}
	}, _viewport = function() {
		return [ $(window).width(), $(window).height(),
				$(document).scrollLeft(), $(document).scrollTop() ];
	}, _centerImage = function(mouse, wrap) {
		var sizeWrap = $wraper.data('size'), sizeImg = {
			w : wrap.children('img').width(),
			h : wrap.children('img').height()
		}, multiplicador = {}, offsetIni = $wraper.offset(), _style = {};
		multiplicador.h = (sizeWrap.h - sizeImg.h) / sizeWrap.h;
		multiplicador.w = (sizeWrap.w - sizeImg.w) / sizeWrap.w;
		_style = {
			'marginTop' : Math
					.floor((multiplicador.h * (mouse.pageY - offsetIni.top))),
			'marginLeft' : Math
					.floor((multiplicador.w * (mouse.pageX - offsetIni.left)))
		};
		wrap.children('img').css(_style);
	}, _calculateScale = function($img) {
		aumentosW[0] = parseInt($img.css("width"));
		aumentosH[0] = parseInt(opt.heightBig);
		for (x = 1; x <= opt.aumentos; x++) {
			aumentosW[x] = Math.round((aumentosW[x - 1] * 110) / 100);
			aumentosH[x] = Math.round((aumentosH[x - 1] * 110) / 100);
		}
	}, _centrarImagen = function($obj, $image) {
		imageWidth = $image.width();
		imageHeight = $image.height();
		var marginL = (opt.widthBig - imageWidth) / 2;
		var marginT = (opt.heightBig - imageHeight) / 2;
		$image.css({
			"margin-left" : marginL,
			"margin-top" : marginT
		});
	}, _scale = function($obj, $image, action) {
		var zoom = $image.data("zoomInd");
		if (action == "-") {
			if (zoom > 0) {
				zoom--;
				$image.data("zoomInd", zoom);
			} else {
				return false;
			}
		} else {
			if (zoom <= 4) {
				zoom++;
				$image.data("zoomInd", zoom);
			} else {
				return false;
			}
		}
		var marginL = (opt.widthBig - aumentosW[zoom]) / 2;
		var marginT = (opt.heightBig - aumentosH[zoom]) / 2;
		$image.animate({
			"width" : aumentosW[zoom],
			"height" : aumentosH[zoom],
			"margin-left" : marginL,
			"margin-top" : marginT
		}, 500);
	}, _makeZoom = function() {
		$('body').append($overlay.hide(), $btnClose.hide(), $container.hide());
		$container.append($containerShadow, $containerShadowIE.hide());
		$containerShadow.append($wraper);
		$wraper.append($content.append(wrapsImg));
		$wraper.find('.wrap').append($(opt.idMiddle + ' img').clone().css({
			'width' : opt.widthBig,
			"height" : opt.heightBig
		}));
		$wraper.find('img').wrap($('<div></div>'));
		_calculateScale($wraper.find('img:eq(0)'));
		$wraper.append($tooltipR.plus.html(opt.txtToolPlus).css("opacity",
				"0.6").hide(), $tooltipR.minus.html(opt.txtToolMinus).css(
				"opacity", "0.6").hide());
		$overlay.css("opacity", 0.8).unbind().click(function() {
			$.bvViewer.close();
		});
		if (isIE) {
			$containerShadowIE.show();
		}
		$btnClose.mouseover(function() {
			$btnClose.addClass("detail-product-photos-close-hover");
		}).mouseout(function() {
			$btnClose.removeClass("detail-product-photos-close-hover");
		}).click(function() {
			$.bvViewer.close();
		}).html(opt.txtClose);
		$(document).keyup(function(e) {
			if (e.which == 27) {
				$.bvViewer.close();
			}
		});
		$wraper.css({
			"padding" : 0,
			"width" : opt.widthBig
		});
		$wraper.find('span.tooltip').bind('click.bvViewer', function(b) {
			$btn = $(this);
			var index = $(opt.idMiddle).data('index');
			var ind = $wraper.data('xzoom');
			var $_img = $wraper.find('img:eq(' + index + ')');
			var $div = $wraper.find('.wrap div:eq(0)');
			if ($btn.hasClass('toolPlus')) {
				_scale($div, $_img, '+');
			} else if ($btn.hasClass('toolMinus')) {
				_scale($div, $_img, '-');
			}
		}).bind('mouseenter.bvViewer', function(b) {
			var index = $(opt.idMiddle).data('index');
			var $_img = $wraper.find('img:eq(' + index + ')');
			var $div = $wraper.find('.wrap div:eq(' + index + ')');
			_centrarImagen($div, $_img);
		}).bind('mouseover.bvViewer', function(b) {
			var index = $(opt.idMiddle).data('index');
			var $_img = $wraper.find('img:eq(' + index + ')');
			var $div = $wraper.find('.wrap div:eq(' + index + ')');
			_centrarImagen($div, $_img);
		});
		$wraper
				.find('.wrap div')
				.bind(
						'mousemove.bvViewer',
						function(b) {
							if (typeof $(this).data('_mouse') == 'undefined') {
								$(this).data('_mouse', b);
							} else {
								if (typeof $(this).data('_mouse').pageX == 'undefined') {
									$(this).data('_mouse', b);
									return false;
								}
								if ($(this).data('_mouse').pageX == b.pageX
										&& $(this).data('_mouse').pageY == b.pageY) {
									return false;
								}
								$(this).data('_mouse', b);
								_centerImage(b, $(this));
							}
						});
	}, _makeNavRows = function() {
		var classLeft = 'span.' + $navs.right.attr('class').replace(' nav', ''), classRight = 'span.'
				+ $navs.left.attr('class').replace(' nav', '');
		$(opt.idMiddle).after($navs.right, $navs.left);
		$arrowNavs = {
			"left" : $navs.right.clone(),
			"right" : $navs.left.clone()
		};
		$(classRight).click(function() {
			$.bvViewer.nav('<');
			return false;
		});
		$(classLeft).click(function() {
			$.bvViewer.nav('>');
			return false;
		});
		$(opt.idNav).children('a').each(function(t) {
			$(this).click(function() {
				$.bvViewer.nav('=', t);
				return false;
			});
		});
	}, _makeNavig = function() {
		$containerShadow.append($navThumbsBig.append($(opt.idNav + ' a')
				.clone()));
		/*$navThumbsBig.find('a img').attr({
			"width" : "114",
			"height" : "145"
		});*/
		$navThumbsBig.find('a').wrap("<div/>");
		$navThumbsBig.find('div:first').css("margin-top", 0);
		$navThumbsBig.find('div').css("float", "left");
		$navThumbsBig.children('div').each(function(t) {
			$(this).click(function() {
				$.bvViewer.reset();
				$.bvViewer.nav('=', t);
				return false;
			});
			$(this).hover(function() {
				if (!($(this).find("a:eq(0)").hasClass("selected"))) {
					$(this).find("img").css("opacity", 0.6);
				}
			}, function() {
				$(this).find("img").css("opacity", 1);
			});
		});
	};
	$.fn.bvViewer = function(options) {
		opt = $.extend($.fn.bvViewer.optDef, options);
		if ($.browser.msie && $.browser.version < 9) {
			isIE = true;
		}
		$(opt.id + ' a').click(function() {
			return false
		});
		$(opt.idMiddle + ', ' + opt.idBig).data('index', 0);
		$(opt.idMiddle)
				.data(
						'total',
						$(opt.idMiddle + ' ' + opt.wrapClass).children('img').length - 1);
		$content.data('loadedImages', false);
		_makeZoom();
		if ($(opt.idMiddle).data('total') > 0) {
			_makeNavig();
			_makeNavRows();
			//$navThumbsBig.find('a:eq(0)').css("border", "2px solid #fff").addClass("selected");
			$navThumbsBig.find('a:eq(0)').addClass("selected");
			/*$navThumbsBig.find('img:eq(0)').css({
				"margin-left" : "-2px",
				"margin-right" : "-2px",
				"margin-top" : "-2px",
				"margin-bottom" : "-2px"
			});*/
		}
		$(opt.idMiddle).click(function() {
			$.bvViewer.open();
		});
	};
	$.bvViewer = function() {
		$content.find('.wrap div').each(function(z) {
		});
	};
	$.bvViewer.open = function() {
		if (!$content.data('loadedImages')) {
			try {
				$containerShadow.find('.wrap div').each(function(z) {
					var img = new Image(), $_wrap = $(this), $img = $(img);
					$img.load(function() {
						$_wrap.append(img);
						$_wrap.find(' img:eq(0)').remove();
					}).error(function() {
					}).attr({
						"src" : opt.images[z],
						"width" : opt.widthBig
					}).data("zoomInd", opt.zoomIndex);
				});
				
				$content.data('loadedImages', true);
			} catch (e) {
			}
		}
		$overlay.show();
		$container.show();
		$btnClose.show();
		$tooltip.show();
		$wraper.find('span.tooltip').show();
		$("#quantity").css("visibility", "hidden");
		$("#attributes").css("visibility", "hidden");
		$.bvViewer.setPosition();
	};
	$.bvViewer.close = function() {
		$overlay.hide();
		$container.hide();
		$btnClose.hide();
		$tooltip.hide();
		$("#quantity").css("visibility", "visible");
		$("#attributes").css("visibility", "visible");
		$.bvViewer.reset();
	};
	$.bvViewer.reset = function() {
		$wraper.data('xzoom', 0);
		$wraper.find('.wrap img').css({
			'width' : opt.widthBig,
			'margin' : 0
		}).data("zoomInd", opt.zoomIndex);
		$wraper.find('.wrap div').each(function() {
			$(this).removeData('_mouse');
			$(this).find("img:first").css({
				"width" : opt.widthBig,
				"height" : opt.heightBig
			});
		});
	};
	$.bvViewer.setPosition = function() {
		var viewport = _viewport(), maxHeight = $wraper.find(
				'.wrap div:first img:first').height();
		$overlay.css('height', $("document").height());
		if (isIE6) {
			$overlay.css('width', viewport[0]);
			var hie = document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight
					: document.body.offsetHeight;
			$overlay.css("height", hie);
		}
		viewport[1] = (viewport[1] > maxHeight ? maxHeight : viewport[1]);
		$medidas = [ ($wraper.width()), (viewport[1]),
				$navThumbsBig.find('img:first').width(),
				$containerShadow.find('.wrap div img:first').height(),
				$btnClose.width(), $btnClose.height() ];
		var totalw = $medidas[0] + $medidas[2] + 15;
		var lf = (viewport[0] - totalw) / 2;
		$container.css({
			"width" : totalw,
			"height" : $medidas[3] + 10,
			"left" : lf,
			"top" : viewport[3] + 30
		});

		$wraper.css({
			"top" : "20px",
			"left" : lf
		});
		$containerShadowIE.css({
			"width" : totalw,
			"height" : $medidas[3] + 10
		});
		$btnClose.css({
			"top" : (viewport[3] + 30) - ($btnClose.height() + 2),
			"left" : (lf + $container.width()) - ($btnClose.width() + 6) - 30
		});
		$navThumbsBig.css({
			"left" : lf + 10,
			"top" : $wraper.height() - 50
		});
		$content.css('height', $medidas[3]);
		$wraper.find('.wrap div').css('height', $medidas[3]);
		$wraper.data('size', {
			w : opt.widthBig,
			h : $medidas[3]
		});
		$.bvViewer.reset();
	};
	$.bvViewer.nav = function(direction) {
		var total = $(opt.idMiddle).data('total'), index = $(opt.idMiddle)
				.data('index'), left = 0, width = parseFloat($(opt.idMiddle)
				.css('width'));
		switch (direction) {
		case '>':
			if (index == total) {
				index = 0;
			} else {
				++index
			}
			break;
		case '<':
			if (index == 0) {
				index = total;
			} else {
				--index
			}
			break;
		case '=':
			index = parseFloat(arguments[1]);
			break;
		}
		$(opt.idMiddle + ', ' + opt.idBig).data('index', index);
		left = 0 - (index * 400);
		$(opt.idMiddle + ' ' + opt.wrapClass).css('marginLeft', left);
		width = opt.widthBig;
		left = 0 - (index * width);
		$content.find('.wrap').css('marginLeft', left);
		$navThumbsBig.find('a').css("border", "0").removeClass("selected");
		$navThumbsBig.find('img').css({
			"margin" : "2px",
			"opacity" : 1
		});
		$navThumbsBig.find('a:eq(' + index + ')').addClass("selected");
		//$navThumbsBig.find('a:eq(' + index + ')').css("border","2px solid #fff").addClass("selected");
		//$navThumbsBig.find('img:eq(' + index + ')').css("margin", "-2px");
	};
	$.fn.bvViewer.optDef = {
		id : '#detail-product-photos',
		idMiddle : '#detail-product-photos-medium',
		idBig : '#detail-product-photos-big',
		idNav : '#detail-product-photos-thumbs',
		wrapClass : '.wrap',
		widthBig : 650,
		heightBig : 650,
		debugable : false,
		xzoom : 15,
		mzoom : 50,
		zoomIndex : 0,
		aumentos : 5,
		txtClose : 'X',
		txtToolPlus : '+',
		txtToolMinus : '-'
	};
})(jQuery);