
(function($){
	$.fn.extend({
		jOthumb: function(options) {
			var defaults = {
				speed:150,
				outSpeed:600, 
				x:0, 
				y:0 
			}
			var options =  $.extend(defaults, options);
			
			return this.each(function() {
				var o = options;
				var obj = $(this);
				var containerWidth = obj.width();				
				var containerHeight = obj.height();
				var contents = $('[rel="contents"]', obj);
				var width = contents.width();
				var height = contents.height();
				if(containerWidth > width){ 
					obj.css("width", width); 
					containerWidth = width;
				}
				if(containerHeight > height){ 
					obj.css("height", height);
					containerHeight = height;
				}
				options.x = Math.abs(options.x) ? -options.x : options.x;
				options.y = Math.abs(options.y) ? -options.y : options.y;				 
				var initTop = (options.y) ? options.y : -((height-containerHeight)/2);
				var initLeft = (options.x) ? options.x : -((width-containerWidth)/2);	
				obj.css({ "position": "relative", "overflow": "hidden" });
				removeStyles();
				contents.css({ "position": "absolute", "top": initTop, "left": initLeft});	
				obj.wrap(function() {
 					return '<div style="height: ' + containerHeight + 'px" />';
				});
				setTimeout(function(){obj.css({ "visibility": "visible" });}, 500);							
				$(this).mouseover(function(e){
					doAnimation(initLeft, initTop);
				});
				$(this).mouseleave(function(e){
					contents.stop().animate({top: initTop, left: initLeft}, o.outSpeed);
					obj.stop().animate({top: 0, left: 0, width: containerWidth, height: containerHeight}, o.outSpeed, function(){
						removeStyles();
					});
				});
				function doAnimation(initLeft, initTop){
					setStyles();
					contents.stop().animate({top: 0, left: 0}, o.speed);
					obj.stop().animate({top: -(height-containerHeight)/2, left: 0, width: width, height: height}, o.speed);
					
				}
				function setStyles(){
					window.zIndex++;
					obj.css({
						"border": "4px solid white", 
						"-moz-box-shadow": "2px 2px 10px rgba(0,0,0,0.8)", 
						"-webkit-box-shadow": "2px 2px 10px rgba(0,0,0,0.8)", 
						"box-shadow": "2px 2px 10px rgba(0,0,0,0.6)", 
						"filter": "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=130, Color='#3b3b3b')", 
						"-ms-filter": "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=130, Color='#3b3b3b')", 
						"zoom": "1" ,
						"z-index": window.zIndex 
						});					
				}
				function removeStyles(){
					window.zIndex = 1;
					obj.css({
						"border": "4px solid transparent",
						"-moz-box-shadow": "2px 2px 10px rgba(0,0,0,0)", 
						"-webkit-box-shadow": "2px 2px 10px rgba(0,0,0,0)", 
						"box-shadow": "2px 2px 10px rgba(0,0,0,0)", 
						"filter": "", 
						"-ms-filter": "",
						"z-index":window. zIndex 
					});
				}				
			});
		}
	});

})(jQuery);
