/* init values */

// draggable element
var z_drag = null;
// original element
var z_orig = null;
// am i dragging?
var z_dragging = false;
// what am i dragging ? 0 = module, 1 = tab
var z_dragtype = 0;
// position tracking
var currentGridPosX = 0;
var currentGridPosY = 0;
var currentTabPos = 0;
// mouse last position
var lastPosX = 0;
var lastPosY = 0;
// nodes
var leftItems = new Array();
var rightItems = new Array();
var centerItems = new Array();
// tab nodes
var tabItems = new Array();
// grid
var yLimitLeft = new Array();
var yLimitCenter = new Array();
var yLimitRight = new Array();
var xLimit = new Array();
var columnswidth = 0;
var currentorder = "";
var currenttaborder = "";
// tab grid
xTabLimit = new Array();

/* utils */

// getelbyid
function z_getEl(a) {
	return document.getElementById?document.getElementById(a):null;
}
// getelbytagname
function z_getElTn(a) {
	return document.getElementsByTagName?document.getElementsByTagName(a):new Array(); 
}
// firefox fix elem
function z_srcElem(e) {
	if (window.event) e = window.event; 
	return e.srcElement?e.srcElement:e.target;
}
// coordinates
function z_getPos(el){
	for (var lx=0,ly=0;el!=null;lx+=el.offsetLeft,ly+=el.offsetTop,el=el.offsetParent);
	return {x:lx,y:ly}
}
// mouse position
function z_getMousePos(evt) {
	if(window.event) evt = window.event;
	if (evt.pageX) { 
		return {x:evt.pageX,y:evt.pageY}
	} else {
		tempX = evt.clientX + document.documentElement.scrollLeft;
		tempY = evt.clientY + document.documentElement.scrollTop;
		return {x:tempX,y:tempY}
	}
}
// this is because outerhtml doesn't work in FF
function z_getOuterHTML(el){
	 temp=el.cloneNode(true);
	 var td = z_getEl('tempDiv');
	 td.appendChild(temp);
	 outer=td.innerHTML;
	 td.innerHTML="";
	 return outer;
}


/* drag n drop stuff */

// retrieve the actual dragged container
// we return the div with draggable class (the parent one) if the pcat was clicked
// return false if an icon was clicked
function z_getReal(el) {
	var temp = el;
	var dragit = false;
	while ((temp != null) && (temp.tagName != "BODY") && (temp.className != "zicon")) {
		if(temp.className!=null && (temp.className.substring(0,4)=="pcat" || temp.className=="tabhandle")) {
			if(temp.className=="tabhandle") { z_dragtype = 1; } else { z_dragtype=0; }
			dragit = true;
		} else if(temp.className!=null && temp.className.substring(0,9)=="draggable") {
			if(dragit) {
				el = temp;
				return el;
			} else {
				return null;
			}
		}
		temp = temp.parentElement?temp.parentElement:temp.parentNode;
	}
	return el;
}
// start dragging element 
function z_dragStart(el) {
	z_drag.innerHTML=el.innerHTML;
	z_drag.style.width=el.offsetWidth+"px";
	z_drag.style["display"]="block";	
	mypos = z_getPos(el);	
	z_drag.style.top = mypos.y+"px";
	z_drag.style.left = mypos.x+"px";
	z_orig=el;
	if(z_dragtype==0) {
		computeGrid();
		test = z_getGridPos(mypos.x,mypos.y,el.offsetWidth,el.offsetHeight);
		currentGridPosX=test.x;
		currentGridPosY=test.y;
	} else {
		computeTabGrid();
		test = z_getTabGridPos(mypos.x,mypos.y,el.offsetWidth,el.offsetHeight);
		currentTabPos=test;
	}
	document.onmousemove=z_dragAction;
	document.onmouseup=z_dragEnd;
	makePlaceHolder(el);
	return false;
}
// drop element
function z_dragEnd() {
	repaintElement(z_getEl(z_orig.id));
	z_dragging = false;
	z_drag.style["display"]="none";
	document.onmousemove=null;
	document.onmouseup=null;
	if(z_dragtype==0) {
		var or = getSort();
		if(or!=currentorder) {
			currentorder = or;
			z_getEl("zeditor").submit();
		}
	} else {
		var or = getTabSort();
		if(or!=currenttaborder) {
			currenttaborder = or;
			z_getEl("zeditor").submit();
		}	
	}
	return true;
}
// while dragging
function z_dragAction(e) {
	mpos = z_getMousePos(e);
	x=mpos.x;
	y=mpos.y;
	if(x==lastPosX && y==lastPosY) { return false; }	

	// drag the component
	oldx = parseInt(z_drag.style.left);
	oldy = parseInt(z_drag.style.top);
	newx = oldx+x-lastPosX;
	newy = oldy+y-lastPosY;
	z_drag.style.top = newy+"px";
	z_drag.style.left = newx+"px";
	lastPosX = x;
	lastPosY = y;
	z_scrollWindow(x,y);
	
	// determine new position of placeholder
	if(z_dragtype==0) {
		test = z_getGridPos(newx,newy,z_drag.offsetWidth,z_drag.offsetHeight);
		if(test.x!=currentGridPosX || test.y!=currentGridPosY) {
			if(test.x!=currentGridPosX) {
				resizeDraggedDiv(z_drag,test.x);
			}
			oldgridx=currentGridPosX;
			oldgridy=currentGridPosY;
			currentGridPosX=test.x;
			currentGridPosY=test.y;
			repositionPlaceHolder(test.x,test.y,oldgridx,oldgridy);
			repaintCells();
			computeGrid();
		}	
	} else {
		test = z_getTabGridPos(newx,newy,z_drag.offsetWidth,z_drag.offsetHeight);
		if(test!=currentTabPos) {			
			oldtabx=currentTabPos;
			currentTabPos=test;
			repositionTabPlaceHolder(test,oldtabx);
			repaintTabs();
			computeTabGrid();
		}		
	}
	return false;
}
// determine the xy coordinates that separate grid elements
function computeGrid() {
	var pos;
	var k=0;
	yLimitLeft = new Array();
	yLimitCenter = new Array();
	yLimitRight = new Array();
	for(var i=0;i<leftItems.length;i++) {	
		if(leftItems[i]!=z_orig.id) {
			pos = z_getPos(z_getEl(leftItems[i]));
			yLimitLeft[k]=pos.y+Math.round((z_getEl(leftItems[i]).offsetHeight)/2);
			k++;
		}
	}
	k=0;
	for(var i=0;i<centerItems.length;i++) {
		if(centerItems[i]!=z_orig.id) {
			pos = z_getPos(z_getEl(centerItems[i]));
			yLimitCenter[k]=pos.y+Math.round((z_getEl(centerItems[i]).offsetHeight)/2);
			k++;
		}
	}
	k=0;
	for(var i=0;i<rightItems.length;i++) {
		if(rightItems[i]!=z_orig.id) {
			pos = z_getPos(z_getEl(rightItems[i]));
			yLimitRight[k]=pos.y+Math.round((z_getEl(rightItems[i]).offsetHeight)/2);
			k++;
		}
	}
	pos = z_getPos(z_getEl("centercolumn"));
	xLimit[0] = pos.x;
	pos = z_getPos(z_getEl("rightcolumn"));
	xLimit[1] = pos.x;
}
// determine the x coordinates that separate tabs
function computeTabGrid() {
	var pos;
	var k=0;
	xTabLimit = new Array();
	for(var i=0;i<tabItems.length;i++) {	
		if(tabItems[i]!=z_orig.id) {
			pos = z_getPos(z_getEl(tabItems[i]));
			xTabLimit[k]=pos.x;
			k++;
		}
	}
}
// change the style of original element to placeholder
function makePlaceHolder(el) {
	for (var j=0;j<el.childNodes.length;j++) {
		if(z_dragtype==0 && el.childNodes[j].tagName=="DIV") {
			el.childNodes[j].style["visibility"]="hidden";		
		} else if(el.childNodes[j].tagName=="A" || el.childNodes[j].tagName=="IMG"){
			el.childNodes[j].style["visibility"]="hidden";				
		}
	}
	el.style["border"]="2px dashed #FF0000";
}
// recreate the original element as it was
function repaintElement(el) {
	for (var j=0;j<el.childNodes.length;j++) {
		if(z_dragtype==0 && el.childNodes[j].tagName=="DIV") {
			el.childNodes[j].style["visibility"]="visible";
		} else if(z_dragtype==1 && (el.childNodes[j].tagName=="A" || el.childNodes[j].tagName=="IMG")) {
			el.childNodes[j].style["visibility"]="visible";
		}
	}
	el.style["border"]="";
}
// repaint the whole screen
function repaintCells() {
	var l = z_getEl("leftcolumn");
	var r = z_getEl("rightcolumn");
	var c = z_getEl("centercolumn");
	var i;
	var lstr = "";
	var rstr = "";
	var cstr = "";
	for(i=0;i<leftItems.length;i++) {
		lstr += z_getOuterHTML(z_getEl(leftItems[i]));
	}
	for(i=0;i<rightItems.length;i++) {
		rstr += z_getOuterHTML(z_getEl(rightItems[i]));
	}
	for(i=0;i<centerItems.length;i++) {
		cstr += z_getOuterHTML(z_getEl(centerItems[i]));
	}
	l.innerHTML = lstr;
	r.innerHTML = rstr;
	c.innerHTML = cstr;
}
function repaintTabs() {
	var t = z_getEl("tabcontainer");
	var tstr = "";
	for(i=0;i<tabItems.length;i++) {
		tstr += z_getOuterHTML(z_getEl(tabItems[i]));
		tstr += " | ";
	}
	t.innerHTML = tstr.substring(0,tstr.length-3);
}
// move around the placeholder depending on grid position
function repositionPlaceHolder(x,y,ox,oy) {
	// we switched x
	// remove from previous array
	if(ox==0) {
		leftItems.splice(oy,1);
	} else if(ox==2) {
		rightItems.splice(oy,1);
	} else {
		centerItems.splice(oy,1);
	}
	if(x==0) {
		leftItems.splice(y,0,z_orig.id);
	} else if(x==2) {
		rightItems.splice(y,0,z_orig.id);
	} else {
		centerItems.splice(y,0,z_orig.id);
	}
}
function repositionTabPlaceHolder(x,ox) {
	// we switched x
	// remove from previous array
	tabItems.splice(ox,1);
	tabItems.splice(x,0,z_orig.id);
}
// change the size of the dragged element
function resizeDraggedDiv(el,x) {
	if(x==0||x==2) {
		el.style.width=columnswidth+"px";		
		if(lastPosX-parseInt(el.style.left)>110) {
			el.style.left = (lastPosX-110)+"px";
		}
	} else {
		el.style.width=z_getEl("centercolumn").offsetWidth+"px";
	}
}
// create the string depciting the order for save
function getSort()
  {
    order = document.getElementById("order");
    order.value = "col0";
	for(var i=0;i<leftItems.length;i++) {
		if(i>0)	{ order.value += ','; }
		order.value +=leftItems[i];
	}
    order.value += ":col1";
	for(var i=0;i<centerItems.length;i++) {
		if(i>0)	{ order.value += ','; }
		order.value +=centerItems[i];
	}
    order.value += ":col2";
	for(var i=0;i<rightItems.length;i++) {
		if(i>0)	{ order.value += ','; }
		order.value +=rightItems[i];
	}
	ed = z_getEl("zeditor");
	ed.cmd.value="blockpos";
	return order.value;
}
function getTabSort()
  {
    order = z_getEl("order");
    order.value="";
	for(var i=0;i<tabItems.length;i++) {
		if(i>0)	{ order.value += ','; }
		order.value += tabItems[i];
	}
 	ed = z_getEl("zeditor");
	ed.cmd.value="updatetaborder";
	return order.value;
}
// retrieve grid pos
function z_getGridPos(xpos,ypos,width,height){
	// find out column
	var tempX = 0;
	var tempY = 0;
	var foundy = 0;
	var mc = 0;
	ypos = ypos+Math.round(height/5);
	if(lastPosX<xLimit[0]) {
		tempX = 0;		
		for(var j=0;j<yLimitLeft.length;j++) {
			if(ypos<yLimitLeft[j]) {
				tempY=j;
				foundy=1;
				break;
			}
		}
		if(foundy==0) { tempY = yLimitLeft.length; }
	} else if(lastPosX>xLimit[1]) {
		tempX = 2;
		for(var j=0;j<yLimitRight.length;j++) {
			if(ypos<yLimitRight[j]) {
				tempY=j;
				foundy=1;
				break;
			}
		}
		if(foundy==0) { tempY = yLimitRight.length;	}
	} else {
		tempX = 1;
		for(var j=0;j<yLimitCenter.length;j++) {
			if(ypos<yLimitCenter[j]) {
				tempY=j;
				foundy=1;
				break;
			}
		}
		if(foundy==0) {	tempY = yLimitCenter.length; }
	}
	return {x:tempX,y:tempY}
}
// retrieve tab pos
function z_getTabGridPos(xpos,ypos,width,height){
	var j;
	for(j=0;j<xTabLimit.length;j++) {
		if(xpos<xTabLimit[j]) {
			return j;
		}
	}		
	return j;
}
// adapt position of dragged element to window scroll
function z_scrollWindow(x,y) {
	var ch = document.documentElement.clientHeight;
	var oh = document.body.offsetHeight;
	if(ch<oh) {
		if(lastPosY-document.documentElement.scrollTop>ch-30 && lastPosY<(z_getPos(z_getEl("maxscroll")).y)+20) {
			scrollBy(0,31-ch+lastPosY-document.documentElement.scrollTop);	
			z_drag.style.top = (parseInt(z_drag.style.top)+31-ch+lastPosY-document.documentElement.scrollTop)+"px";
		}
		if(lastPosY-document.documentElement.scrollTop<30 && document.documentElement.scrollTop>30) {
			scrollBy(0,lastPosY-document.documentElement.scrollTop-31);
			z_drag.style.top = (parseInt(z_drag.style.top)+lastPosY-document.documentElement.scrollTop-31)+"px";
		}
	}
}

/* onmouse events overriding */

// onmousedown 
function z_onmousedown(e) {
	el = z_getReal(z_srcElem(e));
	if(el != null && el.className.substring(0,9)=="draggable") {
		// we're dragging
		pos=z_getMousePos(e);
		lastPosX=pos.x;
		lastPosY=pos.y;
		z_dragging = true;
		z_dragStart(el);
		return false;
	}
}
document.onmousedown = z_onmousedown;

/* onload */

window.onload = function() {
	// init stuff
	z_drag = z_getEl("draggingdiv");
	if(z_getEl("leftcolumn")!=null) {
		leftColumNodes = z_getEl("leftcolumn").childNodes;
		rightColumNodes = z_getEl("rightcolumn").childNodes;
		centerColumNodes = z_getEl("centercolumn").childNodes;
		columnswidth = z_getEl("leftcolumn").offsetWidth;
		var k=0;
		for(var i=0;i<leftColumNodes.length;i++) { if(leftColumNodes[i].tagName=="DIV") { leftItems[k]=leftColumNodes[i].id; k++; } }
		k=0;
		for(var i=0;i<rightColumNodes.length;i++) { if(rightColumNodes[i].tagName=="DIV") { rightItems[k]=rightColumNodes[i].id; k++; } }
		k=0;
		for(var i=0;i<centerColumNodes.length;i++) { if(centerColumNodes[i].tagName=="DIV") { centerItems[k]=centerColumNodes[i].id; k++; } }
	}
	tabNodes = z_getEl("tabcontainer").childNodes;
	k=0;
	for(var i=0;i<tabNodes.length;i++) { if(tabNodes[i].id!=null && tabNodes[i].id.substring(0,3)=="tab") { tabItems[k]=tabNodes[i].id; k++; } }
	currentaborder=getTabSort();
	currentorder=getSort();
};