var areaValid	= new Array();

var areaEditMode	= false;
var areaEditStat	= false;
var areaTemp	= false;
var areaTempX	= 0;
var areaTempY	= 0;
var areaMO	= false;
var areaEDT	= false;
var areaEDTid	= "";
var imgid	= 0;
var zIndex	= 100;

function attachCurtain(image_id)
{
	var img	= document.getElementById(image_id);
	if( ! img ) {
		return false;
	}
	var ofs	= getOffset(img);
	img.onmouseover	= function() {
		areaMO	= true;
		try {
			for(var i=0; i<areaValid.length; i++) {
				document.getElementById(areaValid[i][0]).style.display	= "block";
			}
		} catch(e) {}
	}
	img.onmouseout	= function() {
		if( false != areaTemp ) {
			return false;
		}
		if( true == areaEDT ) {
			return;
		}
		areaMO	= false;
		for(var i=0; i<areaValid.length; i++) {
			document.getElementById(areaValid[i][0]).style.display	= "none";
			setBalonhideTimeout(areaValid[i][0]);
		}
	}
	img.onmousedown	= function(event) {
		if( false == areaEditMode || false == areaEditStat ) {
			return false;
		}
		if( true == areaEDT ) {
			var tmp	= "";
			if( document.getElementById(areaEDTid+"_input") ) {
				tmp	= trim( document.getElementById(areaEDTid+"_input").value );
			}
			if( tmp != "" ) {
				return false;
			}
			areaEDT	= false;
			areaRemove(areaEDTid);
		}
		event	= getEvent(event);
		if( event.preventDefault ) {
			event.preventDefault();
		}
		if( false != areaTemp ) {
			areaRemove(areaTemp);
			areaTemp	= false;
		}
		areaTemp	= "area_"+Math.round(Math.random()*10000);
		var scr	= getScreenScroll();
		areaTempX	= event.clientX + scr[0];
		areaTempY	= event.clientY + scr[1];
		areaCreate(img, areaTemp, 0, 0, areaTempX, areaTempY, "", true);
	}
	img.onmouseup	= function(event) {
		if( false == areaEditMode || false == areaEditStat ) {
			return false;
		}
		if( false == areaTemp ) {
			return false;
		}
		event	= getEvent(event);
		var dv_id	= areaTemp;
		areaTemp	= false;
		var dv	= document.getElementById(dv_id);
		var w	= parseInt(dv.style.width);
		var h = parseInt(dv.style.height);
		if(w<5 || h<5) {
			return areaRemove(dv_id);
		}
		var x	= parseInt(dv.style.left) - ofs[0];
		var y	= parseInt(dv.style.top) - ofs[1];
		var txt	= "";
		areaValid[areaValid.length]	= new Array(dv_id, w, h, x, y, txt);
		document.getElementById(dv_id+"_balonche").style.left = (x + ofs[0]) +"px";
		document.getElementById(dv_id+"_balonche").style.top = (y + ofs[1] + h + 5) +"px"
		document.getElementById(dv_id+"_balonche").style.display	= "block";
	}
	img.onmousemove	= function(event) {
		img.onmouseover();
		if( false == areaEditMode || false == areaEditStat ) {
			return false;
		}
		if( false == areaTemp ) {
			return false;
		}
		event	= getEvent(event);
		if( ! document.getElementById(areaTemp) ) {
			return false;
		}
		var area	= document.getElementById(areaTemp);
		var w	= parseInt( area.style.width );
		var h	= parseInt( area.style.height );
		var x	= parseInt( area.style.left );
		var y	= parseInt( area.style.top );
		var scr	= getScreenScroll();
		var tmpX	= event.clientX + scr[0];
		var tmpY	= event.clientY + scr[1];
		if( tmpX > areaTempX ) {
			area.style.width	= (tmpX - areaTempX) + "px";
		}
		else {
			area.style.left	= (tmpX) + "px";
			area.style.width	= (areaTempX - tmpX) + "px";
		}
		if( tmpY > areaTempY ) {
			area.style.height	= (tmpY - areaTempY) + "px";
		}
		else {
			area.style.top	= (tmpY) + "px";
			area.style.height	= (areaTempY - tmpY) + "px";
		}
	}
	img.ondrag	= function() { return false; }
	for(var i=0; i<areaValid.length; i++) {
		areaCreate(img, areaValid[i][0], areaValid[i][1], areaValid[i][2], areaValid[i][3], areaValid[i][4], areaValid[i][5], false);
	}
}

function areaCreate(img, id, w, h, x, y, txt, is_new)
{
	var ofs	= getOffset(img);
	var dv	= document.createElement("DIV");
	dv.id	= id;
	dv.className	= "djamche";
	dv.style.width	= w + "px";
	dv.style.height	= h + "px";
	dv.style.left	= x + "px";
	dv.style.top	= y + "px";
	if( false == is_new ) {
		dv.style.left	= (parseInt(dv.style.left) + ofs[0]) +"px";
		dv.style.top	= (parseInt(dv.style.top) + ofs[1]) +"px";
	}
	dv.style.display	= is_new ? "block" : "none";
	dv.style.cursor	= "crosshair";
	dv.onmouseup	= img.onmouseup;
	dv.onmousemove	= function(event) {
		img.onmousemove(event);
		clearBalonhideTimeout(id);
	}
	dv.onmouseover	= function() {
		if( false == areaTemp ) {
			this.className	= "djamche mouseover";
		}
		clearBalonhideTimeout(id);
		areaMO	= true;
		for(var i=0; i<areaValid.length; i++) {
			document.getElementById(areaValid[i][0]).style.display	= "block";
		}
		if( false == areaTemp ) {
			document.getElementById(id+"_balonche").style.display	= "block";
		}
		if( false == areaEDT ) {
			zIndex	++;
			this.style.zIndex	= zIndex;
			document.getElementById(id+"_balonche").style.zIndex	= zIndex;
		}
	}
	dv.onmouseout	= function() {
		this.className	= "djamche";
		setBalonhideTimeout(id);
	}
	dv.appendChild(document.createElement("DIV"));
	img.parentNode.appendChild(dv);
	var tt	= document.createElement("DIV");
	tt.id	= id + "_balonche";
	tt.className	= "djambalon";
	tt.style.display	= "none";
	tt.style.left	= (x + ofs[0]) +"px";
	tt.style.top	= (y + ofs[1] + h + 5) +"px";
	tt.onmouseover	= function() {
		clearBalonhideTimeout(id);
		img.onmouseover();
	}
	tt.onmouseout	= function() {
		if( setBalonhideTimeout ) {
			setBalonhideTimeout(id);
		}
	}
	var ttch0	= document.createElement("DIV");
	ttch0.id	= id + "_balonche_txtdiv";
	ttch0.innerHTML	= htmlspecialchars( txt );
	var ttch1	= document.createElement("DIV");
	ttch1.id	= id + "_balonche_edtdiv";
	ttch1.style.display	= "none";
	var inp	= document.createElement("INPUT");
	inp.type	= "text";
	inp.id	= id+"_input";
	inp.maxlength	= "128";
	inp.value	= txt;
	inp.onkeypress	= function(event) {
		event	= getEvent(event);
		if( event.keyCode == 13 ) {
			areaSaveText(id);
		}
	}
	var btn	= document.createElement("INPUT");
	btn.type	= "button";
	btn.className	= "btn";
	btn.value	= "save";
	btn.onclick	= function() {
		areaSaveText(id);
	}
	ttch1.appendChild(inp);
	ttch1.appendChild(btn);
	if( is_new ) {
		ttch0.style.display	= "none";
		ttch1.style.display	= "block";
		areaEDT	= true;
		areaEDTid	= id;
	}
	var ttch2	= document.createElement("A");
	ttch2.id	= id + "_balonche_icon_edit";
	ttch2.style.display	= "none";
	ttch2.href	= "javascript:/* Edit */;";
	ttch2.className	= "iconedit";
	ttch2.onclick	= function() {
		document.getElementById(id+"_balonche_icon_edit").style.display	= "none";
		document.getElementById(id+"_balonche_icon_del").style.display	= "none";
		document.getElementById(id+"_balonche_txtdiv").style.display	= "none";
		document.getElementById(id+"_balonche_edtdiv").style.display	= "block";
		areaEDT	= true;
		areaEDTid	= id;
	}
	var ttch3	= document.createElement("A");
	ttch3.id	= id + "_balonche_icon_del";
	ttch3.style.display	= "none";
	ttch3.href	= "javascript:/* Delete */;";
	ttch3.className	= "icondel";
	ttch3.onclick	= function() {
		var tmp	= trim( document.getElementById(id+"_input").value );
		if( tmp!="" && false==confirm("Are you sure?") ) {
			return;
		}
		areaTemp	= false;
		areaEDT	= false;
		areaRemove(id);
	}
	tt.appendChild(ttch0);
	tt.appendChild(ttch1);
	tt.appendChild(ttch2);
	tt.appendChild(ttch3);
	img.parentNode.appendChild(tt);
	if( is_new ) {
		document.getElementById(id+"_balonche_icon_del").style.display	= "block";
		try{ document.getElementById(id+"_input").focus(); } catch(e) {}
		try{ document.getElementById(id+"_input").select(); } catch(e) {}
	}
}

function areaSwitchEditStat(image_id, btn)
{
	btn.blur();
	var img	= document.getElementById(image_id);
	if( ! img ) {
		return false;
	}
	if( areaEditMode == false ) {
		return false;
	}
	if( areaEDT!=false || areaTemp!=false ) {
		return false;
	}
	if( areaEditStat == false ) {
		try {
			for(var i=0; i<areaValid.length; i++) {
				document.getElementById(areaValid[i][0]+"_balonche_icon_edit").style.display	= "block";
				document.getElementById(areaValid[i][0]+"_balonche_icon_del").style.display	= "block";
			}
		} catch(e) {}
		img.style.cursor	= "crosshair";
		img.style.border	= "3px double #aaaa33";
		areaEditStat	= true;
	}
	else {
		try {
			for(var i=0; i<areaValid.length; i++) {
				document.getElementById(areaValid[i][0]+"_balonche_icon_edit").style.display	= "none";
				document.getElementById(areaValid[i][0]+"_balonche_icon_del").style.display	= "none";
			}
		} catch(e) {}
		img.style.cursor	= "default";
		img.style.border	= "3px solid white";
		areaEditStat	= false;
	}
	img.onmouseover();
}

function setBalonhideTimeout(id)
{
	clearBalonhideTimeout(id);
	if( true == areaEDT ) {
		return;
	}
	var tmp	= setTimeout( function(){try{document.getElementById(id+"_balonche").style.display="none";}catch(e){}}, 250 );
	eval("djambln_hdtm_"+id+" = tmp;");
}

function clearBalonhideTimeout(id)
{
	var tmp;
	try { eval("tmp = djambln_hdtm_"+id+";") } catch(e) {};
	if( tmp != undefined ) {
		try { clearTimeout(tmp) } catch(e) {};
	}
}

function areaRemove(area_id)
{
	if( false == areaEditMode ) {
		return false;
	}
	if( ! document.getElementById(area_id) ) {
		return false;
	}
	var a	= document.getElementById(area_id);
	var t = document.getElementById(area_id+"_balonche");
	a.parentNode.removeChild(a);
	t.parentNode.removeChild(t);
	if( area_id == areaTemp ) {
		areaTemp	= false;
	}
	var tmp	= new Array();
	for(var i=0; i<areaValid.length; i++) {
		if( areaValid[i][0] != area_id ) {
			tmp[tmp.length]	= areaValid[i];
		}
	}
	areaValid	= tmp;
	return saveAreasState();
}

function areaSaveText(area_id)
{
	if( false == areaEditMode || false == areaEDT ) {
		return false;
	}
	if( ! document.getElementById(area_id) ) {
		return false;
	}
	var txt	= document.getElementById(area_id+"_input").value;
	txt	= trim(txt);
	if( txt == "" ) {
		areaEDT	= false;
		return areaRemove(area_id);
	}
	document.getElementById(area_id+"_balonche_edtdiv").style.display	= "none";
	document.getElementById(area_id+"_balonche_txtdiv").style.display	= "block";
	document.getElementById(area_id+"_balonche_txtdiv").innerHTML	= htmlspecialchars(txt);
	document.getElementById(area_id+"_balonche_icon_edit").style.display	= "block";
	document.getElementById(area_id+"_balonche_icon_del").style.display	= "block";
	areaEDT	= false;
	for(var i=0; i<areaValid.length; i++) {
		if( areaValid[i][0] == area_id ) {
			areaValid[i][5]	= txt;
			break;
		}
	}
	return saveAreasState();
}

function saveAreasState()
{
	if( areaEditMode == false ) {
		return false;
	}
	if( 0 == imgid ) {
		return false;
	}
	var url	= "/photos/imgareas_save.do?r="+Math.round(Math.random()*2452342);
	var post	= "imgid="+imgid+"&numareas="+areaValid.length;
	for(var i=0; i<areaValid.length; i++) {
		post	+= "&aX["+i+"]="+areaValid[i][1]+"&aY["+i+"]="+areaValid[i][2]+"&aW["+i+"]="+areaValid[i][3]+"&aH["+i+"]="+areaValid[i][4]+"&aT["+i+"]="+encodeURIComponent(my_url_escape(areaValid[i][5]));
	}
	var req = false;
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
		if (req.overrideMimeType) { req.overrideMimeType("text/plain; charset=UTF-8"); }
	} else if (window.ActiveXObject) {
		try { req = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { req = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} }
	}
	if (! req) { 
		return false;
	}
	req.onreadystatechange = function() {
		if(req.readyState == 4) {}
		return false;
	}
	req.open("POST", url, true);
	req.setRequestHeader("Content-type",	"application/x-www-form-urlencoded");
	req.send(post);
}

function getOffset(obj)
{
	var X=0, Y=0;
	if( obj.offsetParent ) {
		X	= obj.offsetLeft;
		Y	= obj.offsetTop;
		while(obj = obj.offsetParent) {
			X	+= obj.offsetLeft;
			Y	+= obj.offsetTop;
		}
	}
	return new Array(X, Y);
}

function getEvent(e)
{
	if( !e && window.event ) {
		e	= window.event
	}
	return e;
}

function getScreenPreviewSize()
{
	var w=0, h=0;
	if( typeof( window.innerWidth ) == 'number' ) {
		w	= window.innerWidth;
		h	= window.innerHeight;
	}
	else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		w	= document.documentElement.clientWidth;
		h	= document.documentElement.clientHeight;
	}
	else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		w	= document.body.clientWidth;
		h	= document.body.clientHeight;
	}
	return new Array(w, h);
}

function getScreenScroll()
{
	var x=0, y=0;
	if( typeof( window.pageYOffset ) == 'number' ) {
		x	= window.pageXOffset;
		y	= window.pageYOffset;
	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		x	= document.body.scrollLeft;
		y	= document.body.scrollTop;
	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		y	= document.documentElement.scrollTop;
		x	= document.documentElement.scrollLeft;
	}
	return new Array(x, y);
}

function htmlspecialchars(txt)
{
	while( txt.match("<") )	txt = txt.replace("<", "&lt;");
	while( txt.match(">") )	txt = txt.replace(">", "&gt;");
	return txt;
}

function trim(str)
{
	str	= str.replace(/^\s*/, "");
	str	= str.replace(/\s*$/, "");
	return str;
}

function my_url_escape(txt)
{
	while( txt.match("&") )	txt = txt.replace("&", "**AMP**");
	while( txt.match("#") )	txt = txt.replace("#", "**SHRP**");
	while( txt.match("%") )	txt = txt.replace("%", "**PERC**");
	while( -1!=txt.indexOf("+") )	txt = txt.replace("+", "**PLUS**");
	return (txt);
}