var actaulSizeW = sizeOriginalW;
var actaulSizeH = sizeOriginalH;
var IE = document.all?true:false
var ctx = null; 
var actualTop = 0;
var actualLeft = 0;
/*var margen = 250;*/
var margen = 250;
var firstRun = true;
var debug = false;
var drag = null;
var dragX = 0, dragY = 0;
var imgId = "img";
var slider = false;
var zoomActual = false;
var multSlider=200;
var isLoaded = false;
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
document.onmousedown = onMouseDown;
document.onmousemove = onMouseMove;
document.onmouseup  = onMouseUp;



function calcStartInfo() {

	startZoomL = windowH/sizeOriginalH;
	startZoomR = windowW/sizeOriginalW;
        
	if ( startZoomL <  startZoomR ) {
		startZoom = startZoomL;
		startTop = 0;
                startLeft = (windowW -(sizeOriginalW * startZoom))/2;
                /*startLeft = 0;*/
	} else {
		startZoom = startZoomR;
		/*startTop = (windowH - (sizeOriginalH * startZoom))/2;*/
                /*startTop = 0;*/
                startTop = (windowH -(sizeOriginalH * startZoom))/2;
		startLeft = 0;
	}

/*alert((windowH - (sizeOriginalH * startZoom))/2);*/


        zoomImg(startZoom);

	document.getElementById(imgId).style.left = String(startLeft) + "px";
 	document.getElementById(imgId).style.top  = String(startTop) + "px";
	
	slider.setMinimum((startZoom*multSlider));
	slider.setMaximum(multSlider*5);
	slider.setValue(startZoom*multSlider);

}



function imageLoaded() {
	document.getElementById(imgId).className = 'imagenZoom';
	document.getElementById('zoomBox').style.background='none';

	return;
}

function zoomImgWithSlider(mult10) {
	newZoom = slider.getValue() + mult10; 
	if ( newZoom > slider.getMaximum() ) { newZoom = slider.getMaximum(); }
	if ( newZoom < slider.getMinimum() ) { newZoom = slider.getMinimum(); }

	zoomImg(newZoom/multSlider);
	slider.setValue(newZoom);
	
}

function zoomImg(mult) {

	zoomActual = document.getElementById(imgId).height / sizeOriginalH;

//alert(zoomActual.substring(0,zoomActual.length+3));

	actaulSizeW = newSizeW = sizeOriginalW * mult;
	actaulSizeH = newSizeH = sizeOriginalH * mult;
	
	actualTop = pxToNumber(document.getElementById(imgId).style.top);
	actualLeft = pxToNumber(document.getElementById(imgId).style.left);

	document.getElementById(imgId).height = parseInt(newSizeH);
	document.getElementById(imgId).width = parseInt(newSizeW);

	if ( firstRun == false ) {

                newTop = (((actualTop-(windowH/2))/zoomActual)*mult)+(windowH/2);
                newLeft = (((actualLeft-(windowW/2))/zoomActual)*mult)+(windowW/2);

                if(is_chrome)
                {
                    newTop = 0;
                    newLeft = 0;

                    //zoomInicial = zoomInicial.substring(0,zoomInicial.length+3);

                    //alert(zoomInicial.substring(0,zoomInicial.length+3));

                    /*if(zoomActual == 0.4057788944723618)
                    {
                        newTop = actualTop;
                    }*/

//alert(formatCurrency(zoomActual));

                    if(formatCurrency(zoomActual) == 0.41)
                    {
                        newTop = actualTop;
                    }

                }
	
		if ( (actaulSizeW + newLeft - margen) < 0 ) { newLeft = (actaulSizeW-margen)*-1; }
		if ( (actaulSizeH + newTop - margen) < 0 ) { newTop = (actaulSizeH-margen)*-1; }
		if ( (windowW - newLeft - margen) < 0 ) { newLeft = windowW-margen; }
		if ( (windowH - newTop - margen) < 0 ) { newTop = windowH-margen; }
                
		if ( debug ) {
			document.getElementById('top').value=String(newTop);
			document.getElementById('left').value=String(newLeft);
			document.getElementById('zoom').value= mult;
		}

                document.getElementById(imgId).style.left = String(newLeft) + "px";
		document.getElementById(imgId).style.top  = String(newTop) + "px";
	} else {
		firstRun = false;
	}
}




function onMouseDown(e) {

	var object = getMouseObject(e);

	if (object.className == "imagenZoom") {
		drag  = object;

		dragX = pxToNumber(drag.style.left) - getMouseX(e);
		dragY = pxToNumber(drag.style.top)  - getMouseY(e);
	
		return(false);
	}
}


function onMouseMove(e) {

        if (drag) {
            
		newTop = dragY + getMouseY(e);
		newLeft = dragX + getMouseX(e);

		if ( (actaulSizeW + newLeft - margen) < 0 ) { newLeft = (actaulSizeW-margen)*-1; }
		if ( (actaulSizeH + newTop - margen) < 0 ) { newTop = (actaulSizeH-margen)*-1; }
		if ( (windowW - newLeft - margen) < 0 ) { newLeft = windowW-margen; }
		if ( (windowH - newTop - margen) < 0 ) { newTop = windowH-margen; }		
		
		if ( debug ) {	
			document.getElementById('top').value  = String(parseInt(newTop)) + ':' + actaulSizeH + ':' + (windowH - newTop - margen);
			document.getElementById('left').value = String(parseInt(newLeft)) + ':' + actaulSizeW + ':' + (windowW - newLeft - margen) ;
		}

                //drag.style.position="absolute";

		drag.style.left = String(newLeft) + "px";
		drag.style.top  = String(newTop) + "px";

		return(false);
  	}
}


function onMouseUp(e) {	
	drag = null;
}
function getMouseObject(e) {
	return(e? e.target: window.event.srcElement);
}
function getMouseX(e) {
	return(e? e.clientX: window.event.clientX);
}
function getMouseY(e) {
	return(e? e.clientY: window.event.clientY);
}
function pxToNumber(s) {
	return( Number( s.substring(0, s.length - 2) ) );
}

function formatCurrency(num) {
	num = num.toString().replace(/\$|\,/g,'');
	if(isNaN(num)) num = "0";
	sign = (num == (num = Math.abs(num)));
	num = Math.floor(num*100+0.50000000001);
	cents = num%100;
	num = Math.floor(num/100).toString();
	if(cents<10) cents = "0" + cents;
	for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
	num = num.substring(0,num.length-(4*i+3))+
	num.substring(num.length-(4*i+3));

	return (((sign)?'':'-') + num + '.' + cents);
}