// JavaScript Document
//****************************************************************************************************************
//****************************************************************************************************************
//	@author: Susanu Ciprian (ciprian_susanu@yahoo.com)															**
// 	@date: 30.10.2005 (dd.mm.YYYY)																				**
// 	Se foloseste functia zoom() la onclik-ul unui obiect cu parametrii:											**
//		(id-ul div-ului care contine poza in pagina (obligatoriu trebuie sa fie diferit la multiple instances),	**
//		latura patratului (in pixeli) in care va fi incadrata poza,												**
//		calea catre poza, 																						**
//		nr intreg cu procentul cu care va creste poza la un pas de zoom,										**
//		titlul (optional), 																						**
//		coordonata x la care va aparea poza pe ecran, 															**
//		coordonata y la care va aparea poza pe ecran), 															**
//		culoarea background-ului titlului (null pt default), 													**
//		culoarea titlului (null pt default), 																	**
//		culoarea border-ului (null pt default) 																	**
//																												**
//	Variabila maxS defineste marimea maxima pt poza.															**
//	Variabilele img_plus, img_minus, img_exit contin caile catre gifurile 										**
//		+, - si close ale ferestrei in care apare poza.															**
//																												**
//	Obs: Daca in pagina exista un obiect cu id-ul position_*, unde * este id-ul cu care se apeleaza functia 	**
//	zoom, atunci poza isi face aparitia la coordonatele obiectului respectiv									**
//****************************************************************************************************************
//****************************************************************************************************************

	//===> begin config
	if (typeof(jsPath)=='undefined')
		jsPath="../";
		
	zoomScriptPath=jsPath+'js/zoom_picture/';
		
	var maxS=800;
	var img_plus=zoomScriptPath+'img/plu.gif';
	var img_minus=zoomScriptPath+'img/min.gif';
	var img_exit=zoomScriptPath+'img/logoff.gif';
	
	//<=== end config

	var sx=0, sy=0, cX=0, cY=0, o=null;
	
	//===> Mecanism:
	//		Functia startdrag() se apeleaza la event-ul onMouseDown al barei de titlu porneste drag-ul.
	//		Adica ii da lui o valoarea obiectului curent pe care il plimbam pe ecran.
	//		De asemenea, pune in sx si sy coordonatele mouse-ului fata de coltul stanga-sus al div-ului (ne ajuta la miscare)
	//		O data initializat obiectul o, apelam la event-ul onMouseMove functia move() care recalculeaza coordonatele 
	//		pe ecran ale pozei in functie de pozitia actuala a mouse-ului, scazand sx si sy (care au fost stabilite la startul dragului.
	//		Dupa calcularea coordonatelor, functia move() muta poza la noile coordonate. 
	//		La event-ul onMouseUp se apeleaza functia enddrag() care preia in cX si cY coordonatele la care poza a fost lasata
	//		pentru ca, la un nou drag, ea sa ramana in acelasi loc. In final, functia enddrag() elibereaza obiectul o si oprezte, astfel, operatiunea de mutare a pozei.
	//		Functiile startdrag si enddrag primesc ca unic parametru id-ul obiectului de mutat (util pt multiple instances).
	function startdrag(id)
	{
	   o=document.getElementById(id);
	   sx=window.event.clientX-parseInt(o.style.left);
	   sy=window.event.clientY-parseInt(o.style.top);
	   return false;
	}
	
	function move()
	{
	   var tmpx=window.event.clientX-sx;
	   var tmpy=window.event.clientY-sy;
	   if (o) { o.style.left=tmpx; o.style.top=tmpy;}
	   return false;
	}
	
	function enddrag(id)
	{
		cX=document.getElementById(id).style.left;
		cY=document.getElementById(id).style.top;
		o=null;
		return false;
	}
	//<===
	
	//===> Mecanismul este acelasi si pt functiile astea, cu exceptia faptului ca ele sunt facute special pt browsere bazate pe Netscape.
	//		Diferenta este ca functiile mai primesc si eventul care a fost folosit.
	function startdrag_ns(e, id)
	{
		if (document.getElementById("click_"+id)==e.target.parentNode)
		{
	    	o=document.getElementById(id);
			sx=e.clientX - parseInt(o.style.left);
			sy=e.clientY - parseInt(o.style.top);
		}
		return false;
	}

	function move_ns(e)
	{
		var tmpx=e.clientX-sx;
		var tmpy=e.clientY-sy;
		if (o)
		{
			o.style.left=tmpx+"px";
			o.style.top=tmpy+"px";
		}
		return false;
	}

	function enddrag_ns()
	{
		cX=o.style.left;
		cY=o.style.top;
		o = null;
		return false;
	}
	//<===
	
	//===>Elimina din document obiectul care contine poza
	function exit(id, i)
	{
		document.body.removeChild(document.getElementById(id));
		if (i==0 && document.getElementById('position_'+id)) document.getElementById('position_'+id).innerText=0;
	}
	//<===
	
	//===> Functia care se apeleaza efectiv din pagina
	function zoom(id, scale, src, zoom_percent, title, posX, posY, colorBgTitle, colorTitle, colorBorder)
	{
		var apelTxtPlus, apelTxtMinus;
		if (colorBgTitle==null) colorBgTitle='#0099FF';		//background-ul barei de deauspra pozei
		if (colorTitle==null)  colorTitle='#FFFFFF';		//culoarea cu care apare titlul
		if (colorBorder==null)  colorBorder='#0033CC';		//culoarea border-ului
		
		if (document.getElementById('position_'+id) && parseInt(document.getElementById('position_'+id).innerText)==0)
		{
			posX=document.getElementById('position_'+id).offsetLeft;
			posY=document.getElementById('position_'+id).offsetTop;
			document.getElementById('position_'+id).innerText=1;
		}
		
		if (parseInt((scale*(zoom_percent+100))/100)<maxS)
			apelTxtPlus='zoom(\''+id+'\' ,'+parseInt((scale*(zoom_percent+100))/100)+', \''+src+'\', '+zoom_percent+', \''+title+'\', cX, cY, \''+colorBgTitle+'\', \''+colorTitle+'\', \''+colorBorder+'\')';
		else
			apelTxtPlus='zoom(\''+id+'\' ,'+scale+', \''+src+'\', '+zoom_percent+', \''+title+'\', cX, cY, \''+colorBgTitle+'\', \''+colorTitle+'\', \''+colorBorder+'\')';
		
		if (parseInt((scale*(100-zoom_percent))/100)>180)
			apelTxtMinus='zoom(\''+id+'\' ,'+parseInt((scale*(100-zoom_percent))/100)+', \''+src+'\', '+zoom_percent+', \''+title+'\', cX, cY, \''+colorBgTitle+'\', \''+colorTitle+'\', \''+colorBorder+'\')';
		else
			apelTxtMinus='zoom(\''+id+'\' ,'+scale+', \''+src+'\', '+zoom_percent+', \''+title+'\', cX, cY, \''+colorBgTitle+'\', \''+colorTitle+'\', \''+colorBorder+'\')';
		
		var oDiv=document.createElement("DIV");
		oDiv.style.position='absolute';
		oDiv.style.left=parseInt(posX)+'px';
		oDiv.style.top=parseInt(posY)+'px';
		oDiv.style.border='solid';
		oDiv.style.borderWidth='3px';
		oDiv.style.borderColor=colorBorder;
		oDiv.id=id;
		if (navigator.appName!='Netscape')
			a='<table cellpadding="0" cellspacing="0" border="0" bgcolor="'+colorBorder+'"><tr bgcolor="'+colorBgTitle+'" onmousedown="startdrag(\''+id+'\');" onmousemove="move();" onmouseup="enddrag(\''+id+'\');" onmouseout="enddrag(\''+id+'\');" style="cursor:move; overflow:visible;"><td style="padding-left:10px; color:'+colorTitle+'; font-weight:bold; font:Tahoma;">&bull;&nbsp;'+title+'</td><td valign="middle" align="right"><img width="16px" onclick="exit(\''+id+'\', 1); '+apelTxtMinus+';" src="'+img_minus+'" style="cursor:pointer;"><img width="16px" onclick="exit(\''+id+'\', 1); '+apelTxtPlus+';" src="'+img_plus+'" style="padding-left:2px; cursor:pointer;"><img width="16px" src="'+img_exit+'" onclick="exit(\''+id+'\', 0);" style="padding-left:2px; cursor:pointer;"></td></tr><tr><td colspan="2"><img border="0" id="poza_interior" src="'+jsPath+'utile.php?obj=image&action=scale&imgSrc='+src+'&scale='+scale+'"></td><tr></table>';
		if (navigator.appName=='Netscape')
			a='<table cellpadding="0" cellspacing="0" border="0" bgcolor="'+colorBorder+'"><tr bgcolor="'+colorBgTitle+'" id="click_'+id+'" onmousedown="startdrag_ns(event, \''+id+'\');" onmousemove="move_ns(event);" onmouseup="enddrag_ns(\''+id+'\');" onmouseout="enddrag_ns(\''+id+'\');" style="cursor:move; overflow:visible;"><td style="padding-left:10px; color:'+colorTitle+'; font-weight:bold; font:Tahoma;">&bull;&nbsp;'+title+'</td><td valign="middle" align="right"><img width="16px" onclick="exit(\''+id+'\', 1); '+apelTxtMinus+';" src="'+img_minus+'" style="cursor:pointer;"><img width="16px" onclick="exit(\''+id+'\', 1); '+apelTxtPlus+';" src="'+img_plus+'" style="padding-left:2px; cursor:pointer;"><img width="16px" src="'+img_exit+'" onclick="exit(\''+id+'\', 0);" style="padding-left:2px; cursor:pointer;"></td></tr><tr><td colspan="2"><img border="0" id="poza_interior" src="'+jsPath+'utile.php?obj=image&action=scale&imgSrc='+src+'&scale='+scale+'"></td><tr></table>';
		
		oDiv.innerHTML=a;
		if (!document.getElementById(id)) document.body.appendChild(oDiv);
	}
	//<===
