/**
 * loupe - an image magnifier for jQuery
 * (C) 2010 jdbartlett, MIT license
 * http://github.com/jdbartlett/loupe
 */
(function ($) {
	$.fn.loupe = function (arg) {
		var options = $.extend({
			loupe: 'loupe',
			width: 200,
			height: 150
		}, arg || {});
		var tog = 0;
		return this.length ? this.each(function () {
			var $this = $(this), $big, $loupe,
				$small = $this.is('img') ? $this : $this.find('img:first'),
				move, hide = function () { $loupe.hide(); },
				time;

			if ($this.data('loupe') != null) {
				return $this.data('loupe', arg);
			}

			movestart = function (e) {
				e.preventDefault();
				if(tog == 0){
					var os = $small.offset(),
						sW = $small.outerWidth(),
						sH = $small.outerHeight(),
						oW = options.width / 1,
						oH = options.height / 2;

					if (!$this.data('loupe') ||
						e.pageX > sW + os.left + 10 || e.pageX < os.left - 10 ||
						e.pageY > sH + os.top + 10 || e.pageY < os.top - 10) {
						return hide();
					}

					time = time ? clearTimeout(time) : 0;

					$loupe.show();
					$big.css({
						left: -(e.pageX - os.left)|0,
						top: -(e.pageY - os.top)|0
					});
					tog = 1;
				}
				else{
					tog = 0;
					$loupe.hide();					
				}
				return false;
			};

			move = function (e) {
				if(tog == 1){
				e.preventDefault();
				var os = $small.offset(),
					sW = $small.outerWidth(),
					sH = $small.outerHeight(),
					oW = options.width / 2,
					oH = options.height / 2;

				if (!$this.data('loupe') ||
					e.pageX > sW + os.left + 10 || e.pageX < os.left - 10 ||
					e.pageY > sH + os.top + 10 || e.pageY < os.top - 10) {
					return hide();
				}

				time = time ? clearTimeout(time) : 0;

				$loupe.show();
				$big.css({
					left: -(e.pageX - os.left)|0,
						top: -(e.pageY - os.top)|0
				});
				return false;
				}
			};
			
			$loupe = $('<div />')
				.addClass(options.loupe)
				.css({
					width: options.width,
					height: options.height,
					position: 'absolute',
					overflow: 'hidden',
					top: $('#imgCycle').offset().top,
					left: $('#imgCycle').offset().left
				})
				.append($big = $('<img />').attr('src', $this.attr($this.is('img') ? 'src' : 'href')).css('position', 'absolute'))
				.mousemove(move)
				.mousedown(movestart)
				.hide()
				.appendTo('body');

			$this.data('loupe', true)
				.mouseenter(move)
				.mousedown(movestart)
		}) : this;
	};
}(jQuery));