/* photogrid script */

var cellsz=120;
var bgcolor='#ffffff';
var spclcell=0;
var thmsize=72;





/*

check for redundant processes. 
This code runs system out of memory....
Probably the monstrous sample images...

*/







/*==========================*/
/*      setup & iframes     */
/*==========================*/




function $(v){return document.getElementById(v)}

function init(){
	writeIframe(parent.frames['fr1'],win1);
	serverstatus2("",0, "");
	writeIframe(parent.frames['fr2'],"<style>body{background-image:url(xgrid_diamondgray.gif);}</style>");
	layout(10);
	setAllThums() /* hardcodes dimensions */;


	/* for testing */
	/* thms are numbered 1-9 instead of 0-8 to match user upload status results */
/*

	$('thm1').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990001_sample.jpg"; //   "http://www.isdntek.com/tagbot/misc/bambi.jpg";
	$('thm1').srcwidth=2160
	$('thm1').srcheight=1440
	$('thm1').ratio=2160/1440
	$('thm1').used=1;

	$('thm2').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990002_sample.jpg"; //   "http://www.isdntek.com/tagbot/misc/florals1.jpg";
	$('thm2').srcwidth=1984
	$('thm2').srcheight=1488
	$('thm2').ratio=1984/1488
	$('thm2').used=1;

	$('thm3').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990003_sample.jpg"; //   "http://www.isdntek.com/tagbot/misc/ducks.jpg";
	$('thm3').srcwidth=1984
	$('thm3').srcheight=1488
	$('thm3').ratio=1984/1488
	$('thm3').used=1;

	$('thm4').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990004_sample.jpg"; //	"http://www.isdntek.com/tagbot/misc/toyplanenose.jpg";
	$('thm4').srcwidth=2160
	$('thm4').srcheight=1440
	$('thm4').ratio=2160/1440
	$('thm4').used=1;

	$('thm5').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990005_sample.jpg"; //	"http://www.isdntek.com/tagbot/misc/toyplanetop.jpg";
	$('thm5').srcwidth=2160
	$('thm5').srcheight=1440
	$('thm5').ratio=2160/1440
	$('thm5').used=1;

	$('thm6').src="http://www.zippyhelp.com/imagetools/stitch_test/uploads/99999999990006_sample.jpg"; //	"http://www.isdntek.com/tagbot/misc/florals2.jpg";
	$('thm6').srcwidth=2048
	$('thm6').srcheight=1536
	$('thm6').ratio=2048/1536
	$('thm6').used=1;

*/

/*

	$('thm1').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm1').srcwidth=360
	$('thm1').srcheight=460
	$('thm1').ratio=360/460
	$('thm1').used=1;

	$('thm2').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm2').srcwidth=360
	$('thm2').srcheight=460
	$('thm2').ratio=360/460
	$('thm2').used=1;

	$('thm3').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm3').srcwidth=360
	$('thm3').srcheight=460
	$('thm3').ratio=360/460
	$('thm3').used=1;

	$('thm4').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm4').srcwidth=360
	$('thm4').srcheight=460
	$('thm4').ratio=360/460
	$('thm4').used=1;

	$('thm5').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm5').srcwidth=360
	$('thm5').srcheight=460
	$('thm5').ratio=360/460
	$('thm5').used=1;

	$('thm6').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm6').srcwidth=360
	$('thm6').srcheight=460
	$('thm6').ratio=360/460
	$('thm6').used=1;


	$('thm7').src="http://www.isdntek.com/tagbot/misc/wreathside.jpg";
	$('thm7').srcwidth=400
	$('thm7').srcheight=253
	$('thm7').ratio=400/253
	$('thm7').used=1;

	$('thm8').src="http://www.isdntek.com/tagbot/misc/zuni.jpg";
	$('thm8').srcwidth=360
	$('thm8').srcheight=460
	$('thm8').ratio=360/460
	$('thm8').used=1;

	$('thm9').src="http://www.isdntek.com/tagbot/misc/bolts1.jpg";
	$('thm9').srcwidth=400
	$('thm9').srcheight=300
	$('thm9').ratio=400/300
	$('thm9').used=1;
*/

}

function setAllThums(){
	for (var i=1; i<=9; i++){
	  $('thm'+i).src= 'x.gif';
	  $('thm'+i).style.width=thmsize+'px';
	  $('thm'+i).style.height=thmsize+'px';
	  $('thm'+i).ratio=1;
	  $('thm'+i).srcwidth =1;
	  $('thm'+i).srcheight=1;
	  $('thm'+i).used=0;
	}
	
}

function iframeDoc(el){
	doc = el.contentDocument;
	if (doc == undefined) { // Internet Explorer
	  doc = el.contentWindow.document;
	}
	return doc;
}

function readIframe(el){
	/* not used in this tool */
	doc = el.contentDocument;
	if (doc == undefined) { // Internet Explorer
	  doc = el.contentWindow.document;
	}
	txt=doc.body.innerHTML;
	return txt;
}

function writeIframe(el,content){
	/* should also test whether this page is framed from another URL */
	var head='<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">\n'
		 +'<html><head><meta http-equiv="content-type" content="text/html; charset=UTF-8">\n'
		 +'</head><body style="margin:0px; padding:0px;" >\n';
	var foot='</body></html>';
	try {
 	  el.document.open();
 	  el.document.write(head+content+foot);
  	  el.document.close();
    	}
	catch(e) { 
	  return(false);
	}
	finally {}
}

function getAjaxObj() {  
	/*	Gets the XMLHttpRequest object. 
	*	Internet Explorer 6 (ActiveXObject) 
	*	attempts to use MSXML 6.0 or falls back to MXSML 3.0. 
 	* 	Returns null if the object could not be created.  
 	* 	@return {XMLHttpRequest or equivalent ActiveXObject}  
 	*/  
  	if (window.XMLHttpRequest) { 
    		// Chrome, Firefox, IE7+, Opera, Safari 
    		return new XMLHttpRequest();
  	}  
  	// IE6 
  	try {  
    		// The latest stable version. It has the best security, performance,  
    		// reliability, and W3C conformance. Ships with Vista, and available  
    		// with other OS's via downloads and updates.  
    		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
  	} catch (e) {  
    		try {  
     		 	// The fallback. 
    		  	return new ActiveXObject('MSXML2.XMLHTTP.3.0'); 
    		} catch (e) {  
     		 	alert('This browser is not AJAX enabled.');  
     		 	return null;
    		}  
  	}  
}  
/*==========================*/
/*      image upload        */
/*==========================*/

var resizeform='parent.document.getElementById(\'fr1\').style.width =(document.getElementById(\'tablesizer\').offsetWidth+10)+\'px\';'
	      +'parent.document.getElementById(\'fr1\').style.height=(document.getElementById(\'tablesizer\').offsetHeight+10)+\'px\';' ;

var win1='<style type="text/css">body {margin:0px;padding:0px;font-family:arial; background-color:white;}</style>'
	+'<form id="Upload" onsubmit="return parent.preUpload()" action="photostitch.upload.php" enctype="multipart/form-data" method="post" style="margin:0px; padding:0px;">'
	+'<table id="tablesizer" cellspacing="0" cellpadding="0" border="0" style="height:15em; float:left;" ><tr><td>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file1" name="file1" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file2" name="file2" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file3" name="file3" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file4" name="file4" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file5" name="file5" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file6" name="file6" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file7" name="file7" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file8" name="file8" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" name="MAX_FILE_SIZE" value="1000000">'
	+'<input type="file" id="file9" name="file9" value="" size="48" style="margin:0px 0px 2px 0px;"><br>'
	+'<input type="hidden" id="callback" name="callback" value="serverstatus">'
	+'</td><td>'
	+'<input type="submit" name="submit" value="Upload" style="height:5.2em; float:left; font-weight:bold; color:#048204;">'
	+'</td></tr></table></form><scr'+'ipt>'+resizeform+'</scr'+'ipt>';


function preUpload(){
	var ans=verifyImageFiles();
	if (ans=='ok'){
		ul=[0,0,0,0,0,0,0,0,0,0];
		updateStatus('init');
		/* prevent further form clicking */
		parent.frames['fr1'].document.getElementById('Upload').style.visibility='hidden';
		$('cancel').style.visibility="visible";
		$('rotate270').firstChild.style.display='block';
		$('rotate90') .firstChild.style.display='block';	
		return true;
	}
	else {alert(ans);return false}
}

function verifyImageFiles(){
	/* check empty fields*/
	var fn=""
	for (var i=1; i<=9; i++){
		fn=fn+parent.frames['fr1'].document.getElementById('file'+i).value;
	}
	if (fn.length==0){return 'Select at least one file to upload.';}

	/* check extensions */
	for (var i=1; i<=9; i++){
		var url=parent.frames['fr1'].document.getElementById('file'+i).value;
		if (url.length>0 && !url.match(/(\.jpg$)|(\.jpeg$)|(\.gif$)/i) ){
			return   'Only JPG and GIF images are allowed at this time\n'
				+'Erase or replace the unsupported image in the upload slot.';
		}
	}
	return 'ok';
}

function serverstatus(idx, upimg, status, msg){
	// imgname is the image to retrieve from the server
	// idx is image/slot number
	// status is ok or failed (1/0)
	// call from iframe is:  parent.serverstatus(idx,imgname,status,msg)

	if (status==1){
		/* success */
		if (upimg){
			ul[idx]=1;
			$('hdimg'+idx).innerHTML='<img src="'+upimg+'" '
			+'onerror="imageError('+idx+')" '
			+'onload="imageSuccess('+idx+')">';
		}
	}	
	else if (status==0){
		/* failure */
		ul[idx]=0;
	}
	else {
		/* finished with all uploads in batch */
		// show status while waiting for loaded images to appear
		// else reset the upload window
		if (ul[1]+ul[2]+ul[3]+ul[4]+ul[5]+ul[6]+ul[7]+ul[8]+ul[9]>0){
			updateStatus('init');}
		else{updateStatus('hide');}
	}
}



/*==========================*/
/*      loading status      */
/*==========================*/

var errcnt=0;
var imgTimer;
var formTimer;
var ul=[0,0,0,0,0,0,0,0,0,0];

function uploadTimer(){
	if (errcnt<60){
	  imgTimer=clearTimeout(imgTimer);
	  updateStatus('show');
	  errcnt++;
	  imgTimer=setTimeout("uploadTimer()",1000);
	}
}

function imageError(idx){
	ul[idx]=0;
	if (ul[1]+ul[2]+ul[3]+ul[4]+ul[5]+ul[6]+ul[7]+ul[8]+ul[9]==0){
		updateStatus('hide');
	}
}


function imageSuccess(idx){
	/* populate thumbnail */
	/* opera must reset width, can not use auto */
	imgTimer=clearTimeout(imgTimer);
	$('thm'+idx).src= $('hdimg'+idx).firstChild.src;
	$('thm'+idx).ratio=$('hdimg'+idx).firstChild.offsetWidth/$('hdimg'+idx).firstChild.offsetHeight;
	$('thm'+idx).srcwidth =$('hdimg'+idx).firstChild.offsetWidth;
	$('thm'+idx).srcheight=$('hdimg'+idx).firstChild.offsetHeight;
	$('thm'+idx).used=1;
	if ($('thm'+idx).ratio <1 ){
		$('thm'+idx).style.height=thmsize+'px'; $('thm'+idx).style.width=(thmsize*$('thm'+idx).ratio)+'px'; 
		 }
	else {	
		$('thm'+idx).style.width=thmsize+'px';  $('thm'+idx).style.height=(thmsize/$('thm'+idx).ratio)+'px'; }

	ul[idx]=0;
	if (ul[1]+ul[2]+ul[3]+ul[4]+ul[5]+ul[6]+ul[7]+ul[8]+ul[9]==0){
		updateStatus('hide');
	}
}

function updateStatus(show){
	if (show=='hide'){
	  errcnt=0;
	  imgTimer=clearTimeout(imgTimer);
	  $('statusbar').style.width='1px';
	  $('statusbar').style.visibility='hidden';
	  $('cancel').style.visibility="hidden";
	  $('rotate270').firstChild.style.display='none';
	  $('rotate90') .firstChild.style.display='none';	
	  formTimer=setTimeout("restoreUpform()",5000); 
	}
	else if (show=='cancel'){
	  errcnt=0;
	  imgTimer=clearTimeout(imgTimer);
	  $('statusbar').style.width='1px';
	  $('statusbar').style.visibility='hidden';
	  $('cancel').style.visibility="hidden";
	  $('rotate270').firstChild.style.display='none';
	  $('rotate90') .firstChild.style.display='none';	
	  formTimer=setTimeout("restoreUpform()",500); 
	}
 	else if (show=='init'){
	  errcnt=0;
	  imgTimer=clearTimeout(imgTimer);
	  $('statusbar').style.width='0px';
	  $('statusbar').style.visibility='visible';
	  uploadTimer();
	}
	else {
	  $('statusbar').style.width=($('statusbar').offsetWidth+6)+'px';
	  $('statusbar').style.visibility='visible';
	}
}

function restoreUpform(){
	writeIframe(parent.frames['fr1'],win1);
}

function dimmer(el,amt){
	el.style.opacity=amt/100;
	el.style.filter='alpha(opacity='+amt+')';
}

/*==========================*/
/*      rotation            */
/*==========================*/

function rotate(el,deg){
	/*check whether valid*/
	if (el.src.match(/(\/|\\)x\.gif$/) ) {return}

	/* call the server*/
	var cmd='photostitch.rotate.php?'
	+'&fn='+escape(el.src)
	+'&deg='+deg
	+'&idx='+el.id.replace('thm','')
	+'&call=serverstatus';

	ul=[0,0,0,0,0,0,0,0,0,0];
	/* stop form replacement while rotating */
	formTimer=clearTimeout(formTimer)
	updateStatus('init');
	$('cancel').style.visibility="visible";
	$('rotate270').firstChild.style.display='block';
	$('rotate90') .firstChild.style.display='block';	


	/* server clears form */
	$('fr1').src=cmd;
}


/*==========================*/
/*      resize image        */
/*==========================*/

var spincycle;

function updn(ev){
	eval(ev);
}
function spinsize(ev){
	spincycle=clearInterval(spincycle);
	updn(ev);
	spincycle=setInterval('updn('+ev+')',250);
}

function resizepic(el,rate){
	/* called by user click */
	/* rate must be global if we use this as a zoom feature */
	/* this rate is relative to last size, but perhaps we 
		should look at a percentage of the original instead
		and keep that zoom factor throughout the edit process.
	   	the browser drops fractional pixels, so round down.
	*/

	var x=el.offsetLeft;
	var y=el.offsetTop;
	var w=el.offsetWidth;
	var h=el.offsetHeight;

	var pw=el.parentNode.offsetWidth;
	var ph=el.parentNode.offsetHeight;
	if ((w<30 || h<30) && rate<1){return}

	if (rate==1){
		el.style.width='auto';
		el.style.height='auto';
	}
	else {
		el.style.width='auto';
		el.style.height = Math.floor(rate*h)+'px';
	}

	// center the zoom

	el.style.left=( x+ (pw/2-x) - rate*(pw/2-x)  )   +'px' ;
	el.style.top =( y+ (ph/2-y) - rate*(ph/2-y)  )   +'px' ;

}

function centerPhoto(el){
	resetPhoto(el);
	el.style.height=el.parentNode.offsetHeight+'px';
	el.style.left=(Math.floor(el.parentNode.offsetWidth -el.offsetWidth)/2)+'px' ;
	el.style.top =(Math.floor(el.parentNode.offsetHeight-el.offsetHeight)/2)+'px' ;
}


function resetPhoto(el){
	// need to give image a chance to resize by using external function
	el.style.height='auto';
	el.style.width='auto';
}


function getstyle(el,prop){ 
	/* send capitalized properties to work in both cases */
	/* fetch styles from stylesheet if no inline styles */
	if (document.defaultView){
		/* prop ex: 'border-right-width' just like css */
		stylevalue=document.defaultView.getComputedStyle(el,"").getPropertyValue(prop)
	} 
	else {
		/* Netscape 6/7, Opera 7, IE 5/5.5/6  require js prop ex: borderRightWidth */
		stylevalue=eval('el.currentStyle.'+prop.replace(/-/g,""));
	}
	return stylevalue;
}



function updateWorkspace(){
	var gap=parseInt($('gapsize').value);

	// bottom pullers
	$('pullh0').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight +$('div_1x0').parentNode.offsetHeight +$('div_2x0').parentNode.offsetHeight +gap) +'px';
	$('pullh1').parentNode.style.top  =$('pullh0').parentNode.style.top
	$('pullh2').parentNode.style.top  =$('pullh0').parentNode.style.top
	$('pullh0').parentNode.style.left =($('div_0x0').parentNode.offsetWidth) +'px';
	$('pullh1').parentNode.style.left =($('div_0x0').parentNode.offsetWidth +$('div_0x1').parentNode.offsetWidth) +'px';
	$('pullh2').parentNode.style.left =($('div_0x0').parentNode.offsetWidth +$('div_0x1').parentNode.offsetWidth  +$('div_0x2').parentNode.offsetWidth) +'px';
	//right pullers
	$('pullv0').parentNode.style.left =($('div_0x0').parentNode.offsetWidth +$('div_0x1').parentNode.offsetWidth  +$('div_0x2').parentNode.offsetWidth+gap) +'px';
	$('pullv1').parentNode.style.left =$('pullv0').parentNode.style.left
	$('pullv2').parentNode.style.left =$('pullv0').parentNode.style.left
	$('pullv0').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight) +'px';
	$('pullv1').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight +$('div_1x0').parentNode.offsetHeight) +'px';
	$('pullv2').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight +$('div_1x0').parentNode.offsetHeight +$('div_2x0').parentNode.offsetHeight) +'px';
	// top pullers
	$('pullh10').parentNode.style.top =-20 +'px';
	$('pullh11').parentNode.style.top =$('pullh10').parentNode.style.top
	$('pullh12').parentNode.style.top =$('pullh10').parentNode.style.top
	$('pullh10').parentNode.style.left=($('div_0x0').parentNode.offsetWidth) +'px';
	$('pullh11').parentNode.style.left=($('div_0x0').parentNode.offsetWidth +$('div_0x1').parentNode.offsetWidth) +'px';
	$('pullh12').parentNode.style.left=($('div_0x0').parentNode.offsetWidth +$('div_0x1').parentNode.offsetWidth  +$('div_0x2').parentNode.offsetWidth) +'px';
	//left pullers
	$('pullv10').parentNode.style.left =0 +'px';
	$('pullv11').parentNode.style.left =$('pullv10').parentNode.style.left
	$('pullv12').parentNode.style.left =$('pullv10').parentNode.style.left
	$('pullv10').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight) +'px';
	$('pullv11').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight +$('div_1x0').parentNode.offsetHeight) +'px';
	$('pullv12').parentNode.style.top  =($('div_0x0').parentNode.offsetHeight +$('div_1x0').parentNode.offsetHeight +$('div_2x0').parentNode.offsetHeight) +'px';

	var screenWd=$('fr2').offsetWidth;
	var pictureGridwidth =$('div_0x0').parentNode.offsetWidth  + $('div_0x1').parentNode.offsetWidth  + $('div_0x2').parentNode.offsetWidth + gap
	var pictureGridheight=$('div_0x0').parentNode.offsetHeight + $('div_1x0').parentNode.offsetHeight + $('div_2x0').parentNode.offsetHeight+ gap


	$('imggrid').style.width  =  pictureGridwidth +'px';
	$('imggrid').style.height =  pictureGridheight+'px';

	// for testing:
	//tst=[$('div_0x0').parentNode.offsetLeft,$('div_0x1').parentNode.offsetLeft,$('div_0x2').parentNode.offsetLeft]
	//imgtst=[$('div_0x0').offsetLeft,$('div_0x1').offsetLeft,$('div_0x2').offsetLeft]

	/* resize the black workspace and display the picture-grid dimensions */
	    $('imggrid').parentNode.style.width = Math.max (screenWd-150,(pictureGridwidth+$('imggrid').offsetLeft+150))+'px';
	    $('dimdisplay0').innerHTML  =  pictureGridwidth+'x'+pictureGridheight;  //// +" - W: "+ $('imggrid').offsetWidth+" - CellL: "+tst+" - CropL: "+imgtst;
	    $('dimdisplay1').innerHTML  =  pictureGridwidth+'x'+pictureGridheight;

	/* display sizes on pullers */
	    $('pullh0').innerHTML=$('div_0x0').offsetWidth;
	    $('pullh1').innerHTML=$('div_0x1').offsetWidth;
	    $('pullh2').innerHTML=$('div_0x2').offsetWidth;
	    $('pullv0').innerHTML=$('div_0x0').offsetHeight;
	    $('pullv1').innerHTML=$('div_1x0').offsetHeight;
	    $('pullv2').innerHTML=$('div_2x0').offsetHeight;

}




function setGaps(){
	var gap=parseInt($('gapsize').value)
	for (var r=0; r<3; r++){
		for (var c=0; c<3; c++){
			var x=$('div_'+r+'x'+c).offsetWidth
			var y=$('div_'+r+'x'+c).offsetHeight
			if (x>0) { var colgap=gap }else{ var colgap=0}
			if (y>0) { var rowgap=gap }else{ var rowgap=0}
			$('div_'+r+'x'+c).parentNode.style.width =(x +colgap) +'px'
			$('div_'+r+'x'+c).parentNode.style.height=(y +rowgap) +'px'
			$('div_'+r+'x'+c).style.marginLeft=colgap+'px'
			$('div_'+r+'x'+c).style.marginTop=rowgap+'px'
		}
		$('row'+r).style.height=(y+rowgap)+'px'
	}
	updateWorkspace()
	if (spclcell>0){setSpecialCell()}
}

function setRow(r,size){ /* height of row */
	var gap=parseInt($('gapsize').value)
	if (size>0) { var rowgap=gap }else{ var rowgap=0}
	for (var c=0; c<3; c++){
		$('div_'+r+'x'+c).parentNode.style.height=(size+rowgap)+'px'
		$('div_'+r+'x'+c).style.height=size+'px'
		$('div_'+r+'x'+c).style.marginTop=rowgap+'px'
	}
	$('row'+r).style.height=(size+rowgap)+'px'
	setSpecialCell();
}

function setCol(c,size){ /* width of column */
	var gap=parseInt($('gapsize').value)
	if (size>0) { var colgap=gap }else{ var colgap=0}
	for (var r=0; r<3; r++){
		$('div_'+r+'x'+c).parentNode.style.width=(size+colgap)+'px'
		$('div_'+r+'x'+c).style.width=size+'px'
		$('div_'+r+'x'+c).style.marginLeft=colgap+'px'
		//$('row'+r).style.width=($('div_'+r+'x'+0).parentNode.offsetWidth + $('div_'+r+'x'+1).parentNode.offsetWidth + $('div_'+r+'x'+2).parentNode.offsetWidth)+'px'
	}
	setSpecialCell();
}


function layout(format){
	spclcell=0;
	switch (format){
	case 0:{/* 1x1 */
		setRow(0,3*cellsz);   setRow(1,0);          setRow(2,0)
		setCol(0,3*cellsz);   setCol(1,0); 	    setCol(2,0)
		break;}
	case 1:{/* 2x1 */
		setRow(0,3*cellsz);   setRow(1,0);          setRow(2,0)
		setCol(0,1.5*cellsz); setCol(1,1.5*cellsz); setCol(2,0)
		break;}
	case 2:{/* 1x2 */
		setCol(0,3*cellsz);   setCol(1,0);	    setCol(2,0)
		setRow(0,1.5*cellsz); setRow(1,1.5*cellsz); setRow(2,0)
		break;}

	case 3:{/* 2x2sp v */
		spclcell=1;
		setRow(0,1.5*cellsz); setRow(1,1.5*cellsz); setRow(2,0)
		setCol(0,2*cellsz);   setCol(1,1*cellsz);   setCol(2,0)
		spclcell=1;
		setSpecialCell()
		break;}
	case 4:{/* 2x2sp h */
		spclcell=2;
		setRow(0,2*cellsz);   setRow(1,1*cellsz);   setRow(2,0)
		setCol(0,1.5*cellsz); setCol(1,1.5*cellsz); setCol(2,0)
		spclcell=2;
		setSpecialCell()
		break;}
	case 5:{/* 3x1 */
		setRow(0,3*cellsz); setRow(1,0);        setRow(2,0)
		setCol(0,1*cellsz); setCol(1,1*cellsz); setCol(2,1*cellsz)
		;break;}
	case 6:{/* 1x3 */
		setCol(0,3*cellsz); setCol(1,0);         setCol(2,0)
		setRow(0,1*cellsz); setRow(1,1*cellsz);  setRow(2,1*cellsz)
		;break;}
	case 7:{/* 3x2 */
		setRow(0,1.5*cellsz); setRow(1,1.5*cellsz); setRow(2,0)
		setCol(0,1*cellsz);   setCol(1,1*cellsz);   setCol(2,1*cellsz)
		;break;}
	case 8:{/* 2x3 */
		setRow(0,1*cellsz);   setRow(1,1*cellsz);   setRow(2,1*cellsz)
		setCol(0,1.5*cellsz); setCol(1,1.5*cellsz); setCol(2,0)
		;break;}
	case 9:{/* 2x2 */
		setRow(0,1.5*cellsz); setRow(1,1.5*cellsz); setRow(2,0)
		setCol(0,1.5*cellsz); setCol(1,1.5*cellsz); setCol(2,0)
		break;}
	case 10:{/* 3x3 */
		setRow(0,1*cellsz); setRow(1,1*cellsz); setRow(2,1*cellsz)
		setCol(0,1*cellsz); setCol(1,1*cellsz); setCol(2,1*cellsz)
		;break;}
	}
	updateWorkspace();
	clearCells()
}

function clearCells(){
	//clear images
	for (var r=0; r<3; r++){
	for (var c=0; c<3; c++){
	$('img_'+r+'x'+c).src='x.gif';
	centerPhoto($('img_'+r+'x'+c));
	}}
	$('img_99').src='x.gif';
	if (spclcell>0) {centerPhoto($('img_99'))}
}



function setSpecialCell(){
	switch (spclcell){
	case 0: {
		$('div_99').parentNode.style.display='none';
		break;
		}
	case 1: { //vertical spcl on left
		$('div_99').parentNode.style.display='block';
		$('div_99').parentNode.style.width =($('div_0x0').parentNode.offsetWidth) +'px'
		$('div_99').style.width 	   =($('div_0x0').offsetWidth) +'px'
		$('div_99').parentNode.style.height=($('div_0x0').parentNode.offsetHeight + $('div_1x0').parentNode.offsetHeight ) +'px'
		$('div_99').style.height 	   =($('div_99' ).parentNode.offsetHeight - $('div_0x0').offsetTop) +'px'

		$('div_99').style.marginLeft=$('div_0x0').style.marginLeft;
		$('div_99').style.marginTop =$('div_0x0').style.marginTop;
		break;
		}
	case 2: { //horizontal spcl on top
		$('div_99').parentNode.style.display='block';
		$('div_99').parentNode.style.height=($('div_0x0').parentNode.offsetHeight) +'px'
		$('div_99').style.height 	   =($('div_0x0').offsetHeight) +'px'
		$('div_99').parentNode.style.width =($('div_0x0').parentNode.offsetWidth + $('div_0x1').parentNode.offsetWidth ) +'px'
		$('div_99').style.width 	   =($('div_99' ).parentNode.offsetWidth - $('div_0x0').offsetLeft) +'px'

		$('div_99').style.marginLeft=$('div_0x0').style.marginLeft;
		$('div_99').style.marginTop =$('div_0x0').style.marginTop;
		break;
		}
	}


}

function setCellSize(num){
	var gsizes=[120,150,180,220];
	for (var i=0; i<4; i++){
		$('gsize'+i).style.borderColor='#bbbbbb';
	}
	$('gsize'+num).style.borderColor='#ffffff';
	cellsz=gsizes[num];
}

function autoArrange(){
	var h=0; var v=0; var s=0;
	var hwd=1000; var vwd=1;
	for (var i=1; i<=9; i++){
	    if ( $('thm'+i).used==1 ){
		     if ($('thm'+i).ratio>=1){h++; hwd=Math.min(hwd,$('thm'+i).ratio) } 
		else if ($('thm'+i).ratio<=1){v++; vwd=Math.min(vwd,$('thm'+i).ratio)} 
		else {s++}
	    }
	}
	var count=h+v+s;
	var aspect='h'
	var cwd=cellsz;

	// show preference for horizontal because it fits screen better
	switch(Math.max(h,v,s)){
	case h: {aspect='h'; cwd=cellsz*hwd; break;}
	case s: {aspect='s'; cwd=cellsz;  break;}
	case v: {aspect='v'; cwd=cellsz*vwd; break;}
	}	
	var j=0;
	var avail=[]

	if      (count>6){ 
		layout(10);
		avail=['0x0','0x1','0x2','1x0','1x1','1x2','2x0','2x1','2x2'];
		for (var i=0; i<3; i++){setCol(i,Math.floor(cwd))}
	}
	else if (count>4){ //use 2x3 or 3x2
		if (aspect=='v'){
		  	layout(7);
		  	avail=['0x0','0x1','0x2','1x0','1x1','1x2'];
			for (var i=0; i<3; i++){setCol(i,Math.floor(cwd*1.5))}
		}
		else { 
		  	layout(8); 
		  	avail=['0x0','0x1','1x0','1x1','2x0','2x1',];
			for (var i=0; i<2; i++){setCol(i,Math.floor(cwd))}
		}
	}
	else if (count>3){ 
		layout(9); 
		avail=['0x0','0x1','1x0','1x1'];
		for (var i=0; i<2; i++){setCol(i,Math.floor(cwd*1.5))}
	}
	else if (count>2){ //use 1x3 or 3x1 or 1+2
		if (aspect=='v'){
			layout(5);
			avail=['0x0','0x1','0x2'];
			for (var i=0; i<3; i++){setCol(i,Math.floor(cwd*3))}
		}
		else {
			layout(6);
			avail=['0x0','1x0','2x0'];
			setCol(0,Math.floor(cwd));
		}
	}
	else if (count>1){ //use 1x2 or 2x1 
		if (aspect=='v'){
			layout(1);
			avail=['0x0','0x1'];
			for (var i=0; i<2; i++){setCol(i,Math.floor(cwd*3))}
		}
		else { 
			layout(2);
			avail=['0x0','1x0'];
			setCol(0,Math.floor(cwd*1.5));
		}
	}
	else if (count==1){ 
		layout(0);
		avail=['0x0'];
		setCol(0,Math.floor(cwd*3));
	}
	else{layout(10)}

	for (var i=0; i<9; i++){
		if ( $('thm'+(i+1)).used==1){
			el=document.getElementById('img_'+avail[j]);
			el.src=$('thm'+(i+1)).src;
			el.srcwidth=$('thm'+(i+1)).srcwidth;
			el.srcheight=$('thm'+(i+1)).srcheight;
			centerPhoto(el);
		      	j++;
		}
	}
	updateWorkspace()
		//$('thm'+i).used=1;
		//$('thm'+i).srcwidth
		//$('thm'+i).srcheight
		//$('thm'+i).ratio

}


function changeColor(c){
	bgcolor=c;
	$('imggrid').style.backgroundColor=c;
	$('div_99').parentNode.style.backgroundColor=c;
}

function showButtons(state,marks){
	if (state==true){showhide='visible'}else {showhide='hidden'}
	    for (var r=0; r<3; r++){
	    for (var c=0; c<3; c++){
		$('bdiv_'+r+'x'+c).style.visibility=showhide 
		if (marks>0){
			dashes=$('div_'+r+'x'+c).getElementsByTagName('IMG')
			for (var i=1; i<dashes.length; i++){dashes[i].style.visibility=showhide }
		}
	    }}
	$('bdiv_99').style.visibility=showhide;
	if (marks>0){
		dashes=$('div_99').getElementsByTagName('IMG')
		for (var i=1; i<dashes.length; i++){dashes[i].style.visibility=showhide }
	}

}


function tooltiptext(x,y,txt){
	var point='<div class=toolpt></div>'
	$('tooltip').innerHTML=txt+point;

	$('tooltip').style.left=(x -20 +editorGetScrollXY()[0])+'px';
	$('tooltip').style.top= (y -15 +editorGetScrollXY()[1] - $('tooltip').offsetHeight)+'px';
   	$('tooltip').style.visibility='visible';
}



/*==========================*/
/*    Stitch Parameters     */
/*==========================*/
var ajaxObj;
var warningMsgs=true;

function testPanelsContinue(){
return true; // disable testing for now
	if (warningMsgs==false){return true};
	var msg="";
//fix	var ht=( $('bdiv1').parentNode.offsetHeight - $('bdiv1').offsetHeight);
	for (var i=1; i<=9; i++){
		if ($('img'+i).offsetHeight < ht-20 && !($('img'+i).src.match(/\/x\.gif$/))){
		msg=msg+"* Image "+i+" is not as tall as it could be. To fill the space, \nopen the panel wider and use the plus-button to enlarge image. \n\n"
		}
	}

	if ($('div3').offsetWidth>40 && $('img3').src.match(/\/x\.gif$/)  ){
		msg=msg+"* The unused third panel will affect your image size. \nYou may wish to close it using the arrow under the panel.\n\n"

	}
	if (msg!=""){
		msg=msg+"Continue anyway and hide these messages? \n(Cancel to go back and make changes.)"
		var ans=confirm(msg);
		if (ans){warningMsgs=false; return true}else {return false}
	}
	return true; /*to continue*/
}

function prepareServerParams(btn){
	/* prevent multiple clicking */
	btn.disabled=true;
	if (testPanelsContinue()==false){btn.disabled=false; return}
	// scale for gaps
	var scale=$('maxsize').value / Math.max($('imggrid').offsetWidth,$('imggrid').offsetHeight )
	var gap=Math.round(scale*parseInt($('gapsize').value))


	/* generate new size parameters*/

	// a problem with using gaps is that resizing to fit the final layout size 
	//   may cause some gaps to disappear
	// if the screen specs match the final size sent to server, (like 400 or 500) 
	//   then the layout and gaps will work.
	// perhaps make one last pass and adjust the params 
	//   to match the chosen scale prior to make.
	// Maybe use thin, med, and thick lines instead of pixels.
 	// Maybe 1px per grid 100?
	// Or maybe these values should be rescaled to the final dimensions priot to sending.
	// Then the gap discrepancies could be adjusted here.

	var ostop=gap;
	var osleft=gap;
	var oshzmax=gap;
	var osvtmax=gap;
	var cellsaver=[];
	var szcol=[];
	var szrow=[];

	    // could pretest rounded width and height and adjust rounding errors to fit final size
	    compW=Math.round(scale*$('imggrid').offsetWidth)
	    compH=Math.round(scale*$('imggrid').offsetHeight)

	    szcol[0]=Math.max(0,(Math.round(scale*$('div_0x0').parentNode.offsetWidth)));
	    szcol[1]=Math.max(0,(Math.round(scale*$('div_0x1').parentNode.offsetWidth)));
	    szcol[2]=Math.max(0,(Math.round(scale*$('div_0x2').parentNode.offsetWidth)));
	    szrow[0]=Math.max(0,(Math.round(scale*$('div_0x0').parentNode.offsetHeight)));
	    szrow[1]=Math.max(0,(Math.round(scale*$('div_1x0').parentNode.offsetHeight)));
	    szrow[2]=Math.max(0,(Math.round(scale*$('div_2x0').parentNode.offsetHeight)));

	    mcol=0;	for (var m=1; m<3; m++){if (szcol[m]>szcol[m-1]){mcol=m}};
	    szcol[mcol]  = szcol[mcol] + compW - (szcol[0]+szcol[1]+szcol[2]+gap);
	    mrow=0;	for (var m=1; m<3; m++){if (szrow[m]>szrow[m-1]){mrow=m}};
	    szrow[mrow]  = szrow[mrow] + compH - (szrow[0]+szrow[1]+szrow[2]+gap);



    	for (var r=0; r<3; r++){
	  osleft=gap;
	  cellsaver[r]=[];
	  for (var c=0; c<3; c++){
	    cellsaver[r][c]=[];
	    if (  $('div_'+r+'x'+c).offsetWidth >0  &&  $('div_'+r+'x'+c).offsetHeight >0 ){
		
		var b=$('img_'+r+'x'+c).src.split('/');
		cellsaver[r][c].img=b[b.length-1];

		/* slice origin */
		cellsaver[r][c].imX = osleft;
		cellsaver[r][c].imY = ostop;

		/* slice size */
		cellsaver[r][c].crW = (szcol[c]-gap); /* cell width  */
		cellsaver[r][c].crH = (szrow[r]-gap); /* cell height */

		/* underlying image zoomed size */
		cellsaver[r][c].imW = Math.ceil(scale*$('img_'+r+'x'+c).offsetWidth   );
		cellsaver[r][c].imH = Math.ceil(scale*$('img_'+r+'x'+c).offsetHeight  );

		/* crop origin on image */
		cellsaver[r][c].crX = Math.round(scale*(0-$('img_'+r+'x'+c).offsetLeft)); /* crop origin */
		cellsaver[r][c].crY = Math.round(scale*(0-$('img_'+r+'x'+c).offsetTop )); /* crop origin */

		osleft+= szcol[c];
		oshzmax = Math.max(oshzmax,osleft);
	    	im++;
	    }
	    else{
		cellsaver[r][c].img='';
		cellsaver[r][c].imX=0;
		cellsaver[r][c].imY=0;
		cellsaver[r][c].crW=0;
		cellsaver[r][c].crH=0;
		cellsaver[r][c].imW=0;
		cellsaver[r][c].imH=0;
		cellsaver[r][c].crX=0;
		cellsaver[r][c].crY=0;
	    }

    	  }
	  ostop+=szrow[r];
	  osvtmax=Math.max(osvtmax,ostop);
	}
	cellsaver[99]=[];
	if (spclcell>0){;
		// add spcl case for cell_99 overlay
		// this image may round up or down compared to the sum of the smaller images.
		// need to write code to adjust for this.
		// spcl image can overlay 0x0,0x1 or 1x0,1x1 and must match with 1x0,1x1 or 0x1,1x1.
		switch (spclcell){
		case 1: { /* spcl on left */
			cellsaver[99].crH = cellsaver[0][0].crH + gap + cellsaver[1][0].crH ;
			cellsaver[99].crW = cellsaver[0][0].crW  ;
			break;}
		case 2: { /* spcl on top */
			cellsaver[99].crW = cellsaver[0][0].crW + gap + cellsaver[0][1].crW ;
			cellsaver[99].crH = cellsaver[0][0].crH ; 
			break;}
		}

		var b=$('img_99').src.split('/');
		cellsaver[99].img=b[b.length-1];

		cellsaver[99].imX = cellsaver[0][0].imX;
		cellsaver[99].imY = cellsaver[0][0].imY;

		cellsaver[99].imW = Math.ceil(scale*$('img_99').offsetWidth  );
		cellsaver[99].imH = Math.ceil(scale*$('img_99').offsetHeight );

		cellsaver[99].crX = Math.round(scale*(0-$('img_99').offsetLeft));
		cellsaver[99].crY = Math.round(scale*(0-$('img_99').offsetTop ));

		;
	}
	else{
		cellsaver[99].img='';
		cellsaver[99].imX=0;
		cellsaver[99].imY=0;
		cellsaver[99].crW=0;
		cellsaver[99].crH=0;
		cellsaver[99].imW=0;
		cellsaver[99].imH=0;
		cellsaver[99].crX=0;
		cellsaver[99].crY=0;
	}





	/* make the server string */

	setTimeout('$("'+btn.id+'").disabled=false',2000);

	var uploadURL='photostitch.stitch.php?'
		+'&callback=serverstatus2' 
		+'&destW='+ oshzmax
		+'&destH='+ osvtmax
		+'&sz='+ $('maxsize').value
		+'&scale=1'
		+'&bg='+ bgcolor.replace("#","");

	var im=1;
    	for (var r=0; r<3; r++){
	  for (var c=0; c<3; c++){
	    if (  cellsaver[r][c].crW >0  &&  cellsaver[r][c].crH  >0 ){
		uploadURL=uploadURL
		+'&img'+im+'='+ escape(cellsaver[r][c].img)
		+'&imX'+im+'='+ cellsaver[r][c].imX
		+'&imY'+im+'='+ cellsaver[r][c].imY
		+'&crW'+im+'='+ cellsaver[r][c].crW 
		+'&crH'+im+'='+ cellsaver[r][c].crH 
		+'&imW'+im+'='+ cellsaver[r][c].imW 
		+'&imH'+im+'='+ cellsaver[r][c].imH
		+'&crX'+im+'='+ cellsaver[r][c].crX
		+'&crY'+im+'='+ cellsaver[r][c].crY
		;
	    	im++;
	    }
    	  }
	}

	if (spclcell>0){;
		// add spcl case for cell_99 overlay
		uploadURL=uploadURL
		+'&img'+im+'='+ escape(cellsaver[99].img)
		+'&imX'+im+'='+ cellsaver[99].imX
		+'&imY'+im+'='+ cellsaver[99].imY
		+'&crW'+im+'='+ cellsaver[99].crW
		+'&crH'+im+'='+ cellsaver[99].crH
		+'&imW'+im+'='+ cellsaver[99].imW
		+'&imH'+im+'='+ cellsaver[99].imH
		+'&crX'+im+'='+ cellsaver[99].crX
		+'&crY'+im+'='+ cellsaver[99].crY
		;
	}

//alert(uploadURL.replace(/img/g,"\nimg"))
//return

	/* send params to the PHP module */
	//$('fr2').src=uploadURL;    
	ajaxObj=getAjaxObj();
	// need to include callback info and edit server code
	// server should echo, and "stateChanged" is equivalent to "serverstatus2"
	if (ajaxObj!=null){
		ajaxObj.onreadystatechange=stitchStatus;
		ajaxObj.open("GET",uploadURL,true);
		ajaxObj.send(null);
	}
}

function stitchStatus(){
	/* server will return a url string */
	if (ajaxObj.readyState==4){ serverstatus2(ajaxObj.responseText,-1,'')}
}



function serverstatus2(imgname,status, msg){
	// check for reload completion so as not to throw error
	if (!$('resultsBtnHolder')){return}

	// imgname is the image to retrieve from the server
	// call from iframe is:  parent.serverstatus2(imgname,status,msg)
	switch(status){
	case (-1):{
		/* hide download button and load image */
		$('resultsBtnHolder').innerHTML=''
  		+'Image not available.'
		+'<button  style="margin-left:10px;" '
  		+'title="Download this image to your computer." disabled=true>Save this one &darr;</button>';

		var content='<style>body{background-image:url(xgrid_diamondgray.gif);}</style>'
		+'<div style="width:100%; height:auto; font-family:arial; overflow:auto;">'
		+'<img src="'+imgname+'" onload="parent.serverstatus2(\''+imgname+'\',1, \'\')" '
		+'onerror="parent.serverstatus2(\'\',0,\'\')" alt="temporary composite image" title="Temporary. Save image to your computer"></div>';

		writeIframe(parent.frames['fr2'],content);
		break;
		}	
	case (0):{
		/* image failed, hide download button */
		$('resultsBtnHolder').innerHTML=''
  		+'Image not available.'
		+'<button  style="margin-left:10px;" '
  		+'title="Download this image to your computer." disabled=true>Save this one &darr;</button>';
		break;
		}
	case (1):{
		/* image ok, show download button */
		$('resultsBtnHolder').innerHTML=''
  		+' &nbsp;&nbsp;Download this edited image to your computer.'
		+'<button  style="margin-left:10px;" '
  		+'onclick="$(\'fr2\').src=\'photostitch.download.php?pg=\'+escape(\''+imgname+'\')" '
  		+'title="Download this image to your computer.">Save this one &darr;</button>'

		$('fr2').style.height=Math.max(200,iframeDoc($('fr2')).getElementsByTagName('DIV')[0].offsetHeight+ 25)+'px';
		break;
		}	
	}
}



/*==========================*/
/*    Mouse functions       */
/*==========================*/

var editorIE=document.all;
editorPage=editorIE ? "BODY" : "HTML";
var editorDragEnabled=false;
var editorDropItem=null;
var editorActiveItem;
var editorOffsetX;
var editorOffsetY;
var constrained;
var mouseX; var mouseY;
var hotitem;




function ifhot(el){
	if (!editorDropItem){return}
	if (el.className=='rotate'){
		if ( el.firstChild.style.display=='none'){
		rotate(editorDropItem,el.id.replace('rotate',''))
		}
	}
	else{
		el.src=editorDropItem.src;
		el.srcwidth=editorDropItem.srcwidth;
		el.srcheight=editorDropItem.srcheight;
		centerPhoto(el);
	}
	editorDropItem=null;
}


function editorStopMove(){ 
	editorDragEnabled=false; 
	editorDropItem=null;

	showButtons(true,1);
	$('tooltip').style.visibility='hidden';
	//alert([editorActiveItem.style.left, editorActiveItem.offsetLeft])

	
}


function editorStartMove(e){
  	editorActiveItem=editorIE ? event.srcElement : e.target; 
	if (editorActiveItem.className=="workspace" || editorActiveItem.className=="pull" ){showButtons(false,1);}
	if (editorActiveItem.parentNode.className=="imgscale"){editorActiveItem=editorActiveItem.parentNode}
	if (editorActiveItem.className!="pullv" && editorActiveItem.className!="pullh" && editorActiveItem.className!="gridimage" && editorActiveItem.className!="thm" ){return}
	showButtons(false,0)
  	editorOffsetX=editorIE ? event.clientX : e.clientX;
  	editorOffsetY=editorIE ? event.clientY : e.clientY;


	/* show image WxH on mouse down */

    	switch(editorActiveItem.className){

      	case "thm"	:{ 
		editorDropItem=editorActiveItem;
		tooltiptext(editorOffsetX,editorOffsetY,
			'<img class="tooltip" src="'+editorActiveItem.src+'" >');
		break;}

      	case "gridimage" :{
		tooltiptext(editorOffsetX,editorOffsetY,
			('<small>&nbsp;img:'+editorActiveItem.offsetWidth+' x '+ editorActiveItem.offsetHeight + '<br>crop:'
			+ editorActiveItem.parentNode.offsetWidth+' x '+ (editorActiveItem.parentNode.offsetHeight) + '<br>&nbsp; loc:'
			+ editorActiveItem.offsetLeft+', '+ editorActiveItem.offsetTop +'</small>' ));
		break;}
	}


   	editorDragEnabled=true;
	//editorDropItem=null;
   	document.onmousemove=editorMove;
}


function editorMove(e){ 
    	if (!editorDragEnabled && !editorDropItem) return;
    	/* set only the Height to prevent defining the width in photos */

    	mouseX=editorIE ? event.clientX : e.clientX;
    	mouseY=editorIE ? event.clientY : e.clientY;
	
	if (editorActiveItem.className!="thm"){

    	  var edWd =parseInt(editorActiveItem.offsetWidth);
    	  var edHt =parseInt(editorActiveItem.offsetHeight);
    	  var edTp =parseInt(editorActiveItem.offsetTop);
    	  var edLt =parseInt(editorActiveItem.offsetLeft);

    	  /*look at x and y and choose larger change - this is for resizing but not for cropping*/
 	  /* or we might use it for constrained cropping */
 	  /* not used in this tool*/

	  osRat=edWd/edHt;
    	  var chgX=mouseX-editorOffsetX;
    	  var chgY=mouseY-editorOffsetY;
	  var hyp=Math.round(Math.sqrt((chgX*chgX)+(chgY*chgY)));
	  if (chgX>=0&&chgY>=0){}
	  else if (chgX<0&&chgY<0){hyp=0-hyp}
	  else if (chgX>=0&&chgY<0){if (Math.abs(chgY)>=Math.abs(chgX)){hyp=0-hyp} }
	  else if (chgX<0&&chgY>=0){if (Math.abs(chgX)>=Math.abs(chgY)){hyp=0-hyp} }
	}


	if (editorActiveItem.id.match(/pullv\d/)){
		var n=parseInt(editorActiveItem.id.replace("pullv",""));
		if (n>9){n=n-10}
		edHt =Math.max(parseInt($('div_'+n+'x0').offsetHeight),parseInt($('div_'+n+'x1').offsetHeight),parseInt($('div_'+n+'x2').offsetHeight));
		//edHt =parseInt(getstyle($('div_'+n+'x0'),'height'));
		edHt=Math.floor(Math.max(edHt +(mouseY-editorOffsetY),0));

		switch (n){
		case 0 :{  
			setRow(0,edHt)
			break;}
		case 1 :{  
			setRow(1,edHt)
			break;}
		case 2 :{  
			setRow(2,edHt)
			break;}
		}
    		}
	else if (editorActiveItem.id.match(/pullh\d/)){
		var n=parseInt(editorActiveItem.id.replace("pullh",""));
		if (n>9){n=n-10}
		edWd =Math.max(parseInt($('div_0x'+n).offsetWidth), parseInt($('div_1x'+n).offsetWidth), parseInt($('div_2x'+n).offsetWidth)  );
		//edWd =parseInt(getstyle($('div_0x'+n),'width'));
		edWd=Math.floor(Math.max(edWd +(mouseX-editorOffsetX),0));

		switch (n){
		case 0:{  
			setCol(0,edWd)
			break;}
		case 1:{  
			setCol(1,edWd) 
			break;}
		case 2:{  
			setCol(2,edWd)
			break;}
		}
    		}
	else if (editorActiveItem.id.match(/img_\d/)){
		edLt =edLt +(mouseX-editorOffsetX);
		edTp =edTp +(mouseY-editorOffsetY);
		editorActiveItem.style.left=edLt+'px';
		editorActiveItem.style.top =edTp+'px';
		}
  
	updateWorkspace();


	/* update tooltip  */

    	switch(editorActiveItem.className){
      	case "thm"	:{ 
		tooltiptext(editorOffsetX,editorOffsetY,
			'<img class="tooltip" src="'+editorActiveItem.src+'" >');
		break;}
      	case "gridimage" :{
		tooltiptext(editorOffsetX,editorOffsetY,
			('<small>&nbsp;img:'+editorActiveItem.offsetWidth+' x '+ editorActiveItem.offsetHeight + '<br>crop:'
			+ editorActiveItem.parentNode.offsetWidth+' x '+ (editorActiveItem.parentNode.offsetHeight) + '<br>&nbsp; loc:'
			+ editorActiveItem.offsetLeft+', '+ editorActiveItem.offsetTop +'</small>' ));
		break;}
    	}


	editorOffsetX=mouseX;
	editorOffsetY=mouseY;
}



document.onmouseup=editorStopMove;




/*==========================*/
/*	screen functions    */
/*==========================*/

function editorGetScreenSize() {
	var myWidth = 0, myHeight = 0;
	if( typeof( window.innerWidth ) == 'number' ) {
		/*Non-IE*/
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else if( document.documentElement &&
		( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		/*IE 6+ in 'standards compliant mode'*/
 		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		/*IE 4 compatible*/
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
	}
	return [ myWidth, myHeight ];
}


function editorGetScrollXY() {
	var scrollXamt = 0, scrollYamt = 0;
	if( typeof( window.pageYOffset ) == 'number' ) {
		/*Netscape compliant*/
		scrollYamt = window.pageYOffset;
		scrollXamt = window.pageXOffset;
	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		/*DOM compliant*/
		scrollYamt = document.body.scrollTop;
		scrollXamt = document.body.scrollLeft;
	} else if( document.documentElement &&
		( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		/*IE6 standards compliant mode*/
		scrollYamt = document.documentElement.scrollTop;
		scrollXamt = document.documentElement.scrollLeft;
	}
	return [ scrollXamt, scrollYamt ];
}



/* end */