/**************************************************************************************************************************
*** a component of   www.imagemapeditor.net 
*** copyright 2009 by spidersites.co.uk
*** No part of this file may be used without express permission from spidersites.co.uk
***************************************************************************************************************************/

//global variables
var selboxes=new Array();//global record of selections
var currentid=0;
var numboxes=0;
var nextid=0;




function selection(){

	this.inresize=true;
	this.move=false;
	this.description="Enter Text Here";
	this.picture="";
	this.textlink='http://';
	
	this.id=nextid++ * 10;
	this.x1=0;
	this.x2=0;
	this.y1=0;
	this.y2=0;
	selboxes.push(this);
	currentid=this.id;
	numboxes++;

}		

function deleteCurrentSelection(){
	index=false;
	for(i=0; i<selboxes.length; i++){
		if(selboxes[i].id==currentid){
			index=i;
		}
	}
	selboxes.splice(index,1);
	numboxes--;
	if(numboxes>0)
		currentid=selboxes[0].id;
		

}

function getCurrentSelection(){
	for(i=0; i<selboxes.length; i++){
		if(selboxes[i].id==currentid)
			return selboxes[i];
	}
	return false;

}

function getselection(id){
	for(i=0; i<selboxes.length; i++){
		if(selboxes[i].id==id)
			return selboxes[i];
	}

}

function setCoords(){

	if(numboxes>0){
		var element=document.getElementById(currentid);
		var style=element.style;
		sel=getCurrentSelection();


		sel.x1=style.left;
		sel.x1=sel.x1.substr(0,sel.x1.length-2);
		
			
		sel.x2=style.width;
		sel.x2=parseInt(sel.x2.substr(0,sel.x2.length-2)) + parseInt(sel.x1);

		sel.y1=style.top;
		sel.y1=sel.y1.substr(0,sel.y1.length-2);
		sel.y2=style.height;
		sel.y2=parseInt(sel.y2.substr(0,sel.y2.length-2)) +parseInt(sel.y1);
//	alert(sel.id+"==="+sel.x1+","+sel.y1+","+sel.x2+","+sel.y2+","+style.width+","+style.height);
		
	}
}

function recreateSelection(description,picture,textlink,id,x1,y1,x2,y2){
	var sel=new selection();
	sel.description=description;
	sel.picture=picture;
	sel.textlink=textlink;
	sel.id=id;
	sel.x1=x1;
	sel.x2=x2;
	sel.y1=y1;
	sel.y2=y2;
	sel.inresize=false;
	sel.move=false;
}

function redraw(){

	for(i=0; i<selboxes.length; i++){
			drawSelection(selboxes[i]);

	}


}

function drawSelection(sel){
	var style;
	var element=document.createElement("div");

	element.setAttribute("id",sel.id);
	element.onmousemove=onMouseMoveInSelection;
	element.onmousedown=onMouseDownInSelection;
	element.ondblclick=dblClick;
	
	if(element.style){
		
		style=element.style;
		style.position='absolute';
		style.top=sel.y1+"px";
		style.left=sel.x1+"px";
		style.width=sel.x2-sel.x1;
		style.opacity=0.7;
		style.filter="alpha(opacity=70)";
		
		style.width=parseInt(sel.x2-sel.x1)+"px";
		style.height=parseInt(sel.y2-sel.y1)+"px";
		style.backgroundColor='white';
		style.borderColor='black';
		style.borderWidth='2px';
		style.borderStyle='solid';
		style.visibility="visible";
	}
	element.appendChild(document.createTextNode("Map ID="+sel.id));
	bdy=document.getElementById("imagemaps");
	bdy.appendChild(element);
//	alert(sel.id+"==="+sel.x1+","+sel.y1+","+sel.x2+","+sel.y2+","+style.width+","+style.height);

}


function newSelection(e){
	sel=new selection();
	var element=document.createElement("div");
	element.setAttribute("id",sel.id);
	element.onmousemove=onMouseMoveInSelection;
	element.onmousedown=onMouseDownInSelection;
	element.ondblclick=dblClick;
	if(element.style){
		style=element.style;
		style.position='absolute';
		style.opacity=0.7;
		style.filter="alpha(opacity=70)";
		if(e.offsetY){
			style.top=e.offsetY+"px";
			style.left=e.offsetX+"px";
		}else{
			style.top=e.layerY+"px";
			style.left=e.layerX+"px";
			
		}
		style.width='50px';
		style.height='50px';
		style.backgroundColor='white';
		style.borderColor='black';
		style.borderWidth='2px';
		style.borderStyle='dashed';
	}
	element.appendChild(document.createTextNode("Map ID="+sel.id));

	bdy=document.getElementById("imagemaps");
	bdy.appendChild(element);


}

function setEditBorder(id){
	ele=document.getElementById(id);
	ele.style.borderStyle='dashed';
}

function setFinishedBorder(id){
	ele=document.getElementById(id);
	ele.style.borderStyle='solid';

}
function  dblClick(e){
	if(!e){ e= window.event;}
		if (e.stopPropagation) e.stopPropagation(); // DOM Level 2
	else e.cancelBubble = true;

		sel.inresize=false;
		sel.move=false;

		showMenu(e);
	
}

function onMouseDownInImage(e){
	if(!e){ e= window.event;}
		if (e.stopPropagation) e.stopPropagation(); // DOM Level 2
		else e.cancelBubble = true;

	cancelMenu();
	//process current selection
	if(numboxes==0){
		newSelection(e);
	}else{
		
		sel=getCurrentSelection();
		if(sel.move){
			sel.move=false;
			sel.inresize=false;
		
		}else
		if(sel.inresize){
			sel.inresize=false;
		
		}else{
			// selection
				newSelection(e);

		}
	}

}




function onMouseDownInSelection(e){
	if(!e) e=window.event;
		if (e.stopPropagation) e.stopPropagation(); // DOM Level 2
		else e.cancelBubble = true;

	if(e.srcElement)
			element=e.srcElement; //ie
		else
			element=e.target; //mozilla

		if(currentid&&element.id!=currentid){
			setFinishedBorder(currentid);
			currentid=element.id;

		}else{
			currentid=element.id;
		}
		sel=getCurrentSelection();

	if(e.button==2){
		
		sel.inresize=false;
		sel.move=false;
//		showMenu(e); //right click replaced with double click - so supports safari/opera

	}else{
			if(!sel.move)
				sel.inresize=!sel.inresize;
			
			sel.move=false;
			if(sel.inresize){
				setEditBorder(currentid);
			}else{
				setFinishedBorder(sel.id);
			}
			cancelMenu();

	}
	

}

function resize(sel,e){

		var element=document.getElementById(sel.id);
		if(element){

			style=element.style;
			lft=style.left;

			lft=lft.substr(0,lft.length-2); // strip to number
			if(e.offsetX){
				curx=e.offsetX;
			}else{
				curx=e.layerX;
				
			}
			
			width= parseInt(curx-lft-10);
			if(width>50){
				style.width=width+"px";
			}
			ytop=style.top;
			ytop=ytop.substr(0,ytop.length-2); // strip to number
			if(e.offsetY){
				cury=e.offsetY;
			}else{
				cury=e.layerY;
				
			}
			height= parseInt(cury-ytop-20);
			
			if(height>50){
				style.height=height+"px";
			}

			setCoords();
		}
			
}



function move(sel,e){

		var element=document.getElementById(sel.id);
		if(element){

			style=element.style;
			if(e.offsetX){
				style.left=parseInt(e.offsetX+10)+"px";
				style.top=parseInt(e.offsetY+10)+"px";
			}else{
				style.left=parseInt(e.layerX+10)+"px";
				style.top=parseInt(e.layerY+10)+"px";
				
			}
			setCoords();

		}
			
}



function onMouseMoveInImage(e){
	if(!e) e=window.event;
		if (e.stopPropagation) e.stopPropagation(); // DOM Level 2
		else e.cancelBubble = true;
		if(numboxes>0){
			sel=getCurrentSelection();
				if(sel.inresize){
					resize(sel,e);				
				 }else{
				 	if(sel.move)
						move(sel,e);
				 }
				 
				 
		 }
}

function onMouseMoveInSelection(e){
		if(!e) e=window.event;
		if (e.stopPropagation) e.stopPropagation(); // DOM Level 2
		else e.cancelBubble = true;

		if(e.srcElement)
			element=e.srcElement; //ie
		else
			element=e.target; //mozilla
		
		if(element){
			id=element.id;
			sel=getselection(id);
			if(sel.inresize){
				resize(sel,e);
			}else{
				if(sel.move){
					move(sel,e);
				}
				
			}
		
		}
		


}

function saveDetails(){
	var element;
	sel=getCurrentSelection();
	element=document.getElementById("descriptionfield");
	sel.description=element.value;
	element=document.getElementById("imagelinkfield");
	sel.picture=element.value;
	element=document.getElementById("pagelinkfield");
	sel.textlink=element.value;

	hideDetailForm();
	cancelMenu();
	return false;
}


popupx=function(){
	if(window.innerHeight){
		x=(window.innerWidth/2)-150;
	}else{
		x=(document.body.clientWidth/2)-150;
		
	}
	return x;	
}




popupy=function(){
	if(window.innerHeight){
		//Firefox
		y=(window.pageYOffset+window.innerHeight/2)-150;
	}else{
		//ie 6
			y=document.body.clientHeight-document.documentElement.clientHeight/2- 150;			
			y=document.documentElement.scrollTop+document.documentElement.clientHeight/2- 150;						
		
	}
	return y;
}




function showDetailForm(e){
//	alert("popup");
	if(!e) e=window.event;
	var element=document.getElementById("detailform");
	style=element.style;
	var x=popupx();
	var y=popupy();
	style.left=x+"px";
	style.top=y+"px";
	style.visibility='visible';
	sel=getCurrentSelection();
	element=document.getElementById("descriptionfield");
	if(element)
		element.value=sel.description;
	element=document.getElementById("imagelinkfield");
	if(element)
		element.value=sel.picture;
	element=document.getElementById("pagelinkfield");
	if(element)
		element.value=sel.textlink;
	
	
	element=document.getElementById("x1field");
	if(element)
		element.value=sel.x1;
	element=document.getElementById("y1field");
	if(element)
		element.value=sel.y1;
	element=document.getElementById("x2field");
	if(element)
		element.value=sel.x2;
	element=document.getElementById("y2field");
	if(element)
		element.value=sel.y2;
	
	
	return false;

}

function hideDetailForm(e){
	if(!e) e=window.event;
	element=document.getElementById("detailform");
	element.style.visibility='hidden';
	return false;

}

function showMenu(e){
	element=document.getElementById("menu");
	if(e.srcElement)
		callelement=e.srcElement; //ie
	else
		callelement=e.target; //mozilla

	style=element.style;

	x=callelement.style.left;

	y=callelement.style.top;

	x=x.substr(0,x.length-2);
	y=y.substr(0,y.length-2);
	if(x<0) x=0;
	if(y<0) y=0;
	style.left=x+"px";
	style.top=y+"px";
	style.visibility='visible';

return false;
	
}


function moveMenuItem(){
	sel=getCurrentSelection();
	sel.move=true;
	sel.indrag=false;
	cancelMenu();
	
	return false;

}


function deleteMenuItem(){
	maps=document.getElementById("imagemaps");
	ele=document.getElementById(currentid);	
	if(maps&&ele){
		maps.removeChild(ele);
		deleteCurrentSelection();

	}

	cancelMenu();
	return false;

}

function cancelMenu(){
	element=document.getElementById("menu");
	element.style.visibility='hidden';
	hideDetailForm();
	return false;

}

function createLink(){
}


function returnData(){

			var returnelement = document.getElementById('returnformid');
			var selimageid=document.getElementById('selimageid');
	
	for(i=0;i<numboxes;i++){
			sel=selboxes[i];
			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',"lastid");
			ele.setAttribute('value',nextid);
			returnelement.appendChild(ele);

			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_desc");
			ele.setAttribute('value',sel.description);
			returnelement.appendChild(ele);

			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_picture");
			ele.setAttribute('value',sel.picture);
			returnelement.appendChild(ele);
			
			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_link");
			ele.setAttribute('value',sel.textlink);
			returnelement.appendChild(ele);
			
			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_x1");
			ele.setAttribute('value',sel.x1);
			returnelement.appendChild(ele);

			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_y1");
			ele.setAttribute('value',sel.y1);
			returnelement.appendChild(ele);
			
			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_x2");
			ele.setAttribute('value',sel.x2);
			returnelement.appendChild(ele);

			var ele=document.createElement('input');
			ele.setAttribute('type',"hidden");
			ele.setAttribute('name',sel.id+"_y2");
			ele.setAttribute('value',sel.y2);
			returnelement.appendChild(ele);


	}
	return true;
	
}


function saveData(){
	var savestring="";		
	for(i=0;i<numboxes;i++){
			sel=selboxes[i];
			savestring+="recreateSelection(\""+sel.description+"\",\""+sel.picture+"\",\""+sel.textlink+"\",\""+sel.x1+"\",\""+sel.y1+"\",\""+sel.x2+"\",\""+sel.y2+"\")\n;";			
	}
	savestring+="redraw();\n";	

	return true;

}