var ss = document.createElement("link");
ss.type = "text/css";
ss.rel = "stylesheet";
ss.href = "/css/js.css";
document.getElementsByTagName("head")[0].appendChild(ss);


$(document).ready(function(){
	if($(".imagezoom").length >0){
		$(".imagezoom").imageZoom();
		$(".ui-slider").slider({
			stepping:2,
			min:2,
			max:10,
			change:function(e, ui){zoomLevel(ui.value)},
			startValue:6
		});
		$(".ui-slider").mousedown(function(){
			var calcVal = $(".ui-slider").slider("value");
			zoomLevel(calcVal);
		});
	}
});


var initialHeight, initialWidth;

function zoomLevel(val){
	if (val==6){
		zoomReset();
	}	
	else if (val>6){
		var multiplier =val-6;		
		imageWidth = parseInt(initialWidth) * multiplier;
		imageHeight = parseInt(initialHeight) * multiplier;
		imageZoom();
	} else {
		var divisor=2;
		if(val == 2){divisor=4}
		imageWidth = parseInt(initialWidth) / divisor;
		imageHeight = parseInt(initialHeight) / divisor;
		imageZoom();
	}			
}

function imageZoom(){
	$(".imagezoom").children('img').css('width', imageWidth);
	$(".imagezoom").children('img').css('height', imageHeight);
	$(".imagezoom").children('img').css('top', -(imageHeight - parseInt(initialHeight))/2 +"px");
	$(".imagezoom").children('img').css('left', -(imageWidth - parseInt(initialWidth))/2 +"px");
}



function zoomReset(){
	$(".imagezoom").children('img').css('height', initialHeight);
	$(".imagezoom").children('img').css('width', initialWidth);
	$(".imagezoom").children('img').css('top', "0px");
	$(".imagezoom").children('img').css('left',"0px");
	
}


(function($){  
$.fn.imageZoom= function(options) { 
var defaults = {
	zoomLevel: 2,
	maxZoom:1
}; 

initialHeight = $(this).children('img').css('height');
initialWidth = $(this).children('img').css('width');
 
     
var options = $.extend(defaults, options);

	return this.each(function() { 
		
		var imageLeft = $(this).offset().left;                
		var imageTop = $(this).offset().top;
		var imageWidth = $(this).children('img').get(0).offsetWidth;
		var imageHeight = $(this).children('img').get(0).offsetHeight;
		var initialSrc = $(this).children('img').attr("src");
		var mx, my;
		var isDrag =0;
		var zoomType = "up";
 		
		$(this).children('img').draggable({stop: function(){isDrag=1}});

		$(this).mousemove(function(e){
			mx = Number(e.pageX - imageLeft);
			my = Number(e.pageY - imageTop);
   		}); 



		
		$(".toggle").click(function(){
			if(zoomType == "up"){
				zoomType="down";	
			}else{
				zoomType="up";
			}
		return false;
		});

		
		
	});  

};
  
})(jQuery);