/************************************/
/* zoom.js - Zoom avec sélection    */
/* Matthieu Vion - 2007             */
/* http://www.developpement-web.net */
/************************************/

var x_init,y_init,width,height,s=0,sx,sy,rectanglea,rsa,ra;
var rectangle,r,positions,z,rs,image,xscroll,yscroll,positionstitre,titre,size,sizetitre;


function init(i, z, r, s) {
	this.r=r;this.s=s;this.z=z;
	image=document.getElementById(i);
	image.onmousedown=down;
	positions=findPos(image);
	size=findSize(image);
	titre=document.getElementById("departzoom");
	positionstitre=findPos(titre);
	sizetitre=findSize(titre);
	width=sizetitre[0];
	height=size[1]+positions[1]-positionstitre[1]-1;
	if (width > height){sx=s; sy=s*height/width;}
	else {sy=s; sx=s*width/height;}
	ra=width/sx;
	create();

}

function deplace(event) {
	if(!event) event = window.event;
	scroll();
	x_init=event.clientX+xscroll+positions[0];
	y_init=event.clientY+yscroll+positions[1];
	document.onmousemove=change;document.onclick=quit;
}

function change(event) {
	if(!event) event = window.event;
	scroll();
	x_new=event.clientX+xscroll;
	y_new=event.clientY+yscroll;      
	rs.marginLeft=(x_new-(1/2*sx))+'px';
	rs.marginTop=(y_new-(1/2*sy))+'px';
	rsa.backgroundPosition=((-x_new+positions[0])*r+(ra/2*sx))+'px '+((-y_new+positions[1])*r+(ra/2*sy))+'px';	

}

function up(event) {
	if(!event) event = window.event;
	document.onmouseup = "";document.onmousedown = "";document.onmousemove = deplace;
   rsa.opacity = "1"; rsa.filter = "alpha(Opacity=100)"; rsa.border="1px solid #B9B9B9";
   rsa.background = "#e8e8e8 url("+z+") no-repeat";
}

function down(event) {
	if(!event) event=window.event;
	scroll();
	document.onmousemove=move;
	document.onmouseup=up;
	x_init=event.clientX + xscroll-2; 
	y_init=event.clientY + yscroll-2;
	rs.visibility="visible";
	rsa.visibility="visible";
	move(event);
}

function move(event) {
	if(!event) event = window.event;
	scroll();
	x_new = event.clientX+ xscroll; 
	y_new = event.clientY+ yscroll;
	if (x_new >= x_init) { if(x_new - x_init < s) { rs.marginLeft = x_init+'px';}}
	else { if(x_init - x_new < s) {rs.marginLeft = x_new+'px';}}
	if (y_new >= y_init) { if(y_new - y_init < s) {rs.marginTop = y_init+'px';}}
	else {if(y_init - y_new < s) {rs.marginTop = y_new+'px';}}
}

function findPos(obj) {
	var curleft,curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft;
		curtop = obj.offsetTop;
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}
	}
	return [curleft,curtop];
}
function findSize(obj) {
	var width,height = 0;
	width=obj.clientWidth;
	height=obj.clientHeight;
	return [width,height];
}

function create() {
	document.write('<div id="rectangle"></div>');
	rectangle = document.getElementById("rectangle");
	rs = rectangle.style;
	document.write('<div id="rectangle2"></div>');
	rectanglea = document.getElementById("rectangle2");
	rsa = rectanglea.style;
	rectangle.onmousedown=down;
	dessine();
}

function dessine() {
	rs.position="absolute"; rs.left="0"; rs.top="0";
	rs.background="#E4E4E4"; rs.border="1px solid #000";
	rs.opacity="0.20"; rs.filter="alpha(Opacity=40)";
	rs.marginLeft = (positions[0]+size[0]/2-s/2)+'px'; 
	rs.marginTop = (positions[1]+size[1]/2-s/2) +'px';
	rs.width = sx+'px';
	rs.height = sy+'px';
	rs.visibility="visible"; rs.cursor="crosshair";
	
	rsa.position="absolute"; 
	rsa.left="0";
	rsa.marginLeft=positionstitre[0]+'px'; 
	rsa.top="0";
	rsa.marginTop=positionstitre[1]+'px';
	rsa.width = width+'px';
	rsa.height = height+'px';
	rsa.background="#ccd7ff"; rsa.border="1px dashed #000";	
	rsa.opacity="0.40"; rsa.filter="alpha(Opacity=40)";
	rsa.visibility="hidden";
}

function quit() {
   rs.visibility="hidden";
	document.onmousemove = ""; document.onclick = "";
	image.onmousedown = down;
	dessine();
}

function scroll() {
if (document.documentElement && document.documentElement.scrollTop)
     {
	   xscroll = document.documentElement.scrollLeft;
	   yscroll = document.documentElement.scrollTop;
     }
    else if (self.pageYOffset)
     {
	   xscroll = self.pageXOffset;
	   yscroll = self.pageYOffset;
     }
   else if (document.body)
     {
	   xscroll = document.body.scrollLeft;
	   yscroll = document.body.scrollTop;
     }
}