jQuery.magnify = {
	binded: false,
	items: []
	
};
jQuery.fn.magnify = function(args){
    return this.each(function() {
			var left, top, width, height, url, imageWidth = 800, imageHeight = 533, widthRatio, heightRatio;
			var parts = this.href.split('?');
			var queryParts = parts[1].split('&');
			url = parts[0];
			width = queryParts[0].split('width=')[1];
			height = queryParts[1].split('height=')[1];	
			widthRatio = (imageWidth / width);
			heightRatio = (imageHeight / height);
			
			// add a node to the body and size and position it
			var overlay = $("<div></div>")
				.addClass("glass")
				.css({
					overflow:"hidden"
				});
			$(this)
				.prepend(overlay);
			$(this).click(function() {
				return false;
			});
			var glassOffset = (overlay.height() / 2);
				
			// add the scaled image to the floating container, and set it's size.
			var img = $("<img src='"+ url +"' width='" + width + "' height='" + height + "'/>")
				.appendTo(overlay);
			
			var $this = $(this);
			var offset = $this.offset();
			
			var item = {
				overlay: overlay,
				img: img,
				container: $this 
			};
			
			
			jQuery.magnify.items.push(item);
			 var index = 0;
			if (!jQuery.magnify.binded) {
		  	$('body').mousemove(function(e){
					var arr = jQuery.magnify.items;
					
					var current = arr[index];
					if(current.container.is(':hidden')) {
						index++
						if(index > (arr.length-1)) index = 0;
						current = arr[index];
					}
					
		  		var left = e.pageX;
		  		var top = e.pageY;
		  		
		  		current.overlay.css({
		  			top: (e.pageY - (glassOffset + offset.top)),
		  			left: (e.pageX - (glassOffset + offset.left))
		  		});
		  		
		  		left = left - offset.left;
		  		top = top - offset.top;
		  		
		  		left = parseInt((left - (glassOffset/2)) / widthRatio);
		  		top = parseInt((top - (glassOffset/2)) / heightRatio);
		  		
		  		current.img.css({
		  			top: -top,
		  			left: -left
		  		})
		  		return false;
		  	});
			jQuery.magnify.binded = true;
	  }
    }); // jQuery
};