/*
use to create a multi level dropdown menu on any html element define before

dropdown_general(othis,item_id,parent_id,[options]);
othis : the item object
item_id : injected id value to the item that will be used to parent the menu
parent_id : id of the parent which should be in the item_id
options : option available separated by comma

options can be one of these :
- position : direction of the child menu placement, can be one of these (north, east, south, west)
- offsetX : will add the value to the left position of the child menu
- offsetY : will add the value to the top position of the child menu

note :
- the children container should be named as [item_id]_child, to be link with the item
- set the children element with a display none
ex :
<div onmouseover="dropdown_general(this,'parent','','position=south,offsetY=15,offsetY=-10')">Parent</div>
<div id="parent_child" style="display:none">
	<div onmouseover="dropdown_general(this,'item1','parent')">Item 1</div>
</div>
<div id="item1_child" style="display:none">
	<div onmouseover="dropdown_general(this,'','item1')">Last Item</div>
</div>
*/
var dropdown_last_index=null;
function dropdown_general(othis,item_id,parent_id,option){
	var p=parseProp(option);
	if(p['position']==null || p['position']=="") p['position']='east';
	if(p['offsetX']==null || p['offsetX']=="") p['offsetX']=0;
	p['offsetX']=parseInt(p['offsetX']);
	if(p['offsetY']==null || p['offsetY']=="") p['offsetY']=0;
	p['offsetY']=parseInt(p['offsetY']);

	var oitem=othis;
	if(item_id) othis.id=item_id;
	try{
		var ochild=document.getElementById(item_id+'_child');
		if(dropdown_last_index==null) dropdown_last_index=parseInt(getLastIndex())+1;
		ochild.style.zIndex=dropdown_last_index;
	}catch(e){}
	try{
		var oparent=(parent_id)?document.getElementById(parent_id):null;
	}catch(e){}
	var oloop;
	oitem.oparent=oparent;
	oitem.ochild=ochild;
	oloop=oitem;
	while(oloop){
		clearTimeout(oloop.timer);
		clearInterval(oloop.timer2);
		if(oloop.ochild){
			oloop.ochild.style.opacity='1';
			oloop.ochild.style.filter="alpha(opacity=100)";
		}
		oloop=oloop.oparent;
	}

	oitem.onmouseout=function(){
		if(oparent) oparent.onmouseout();
		if(ochild!=null && ochild!=''){
			oitem.timer=setTimeout(function(){if(ochild!=null) ochild.style.display='none';},500);
			oitem.timer2=setInterval(function(){
				oitem.alpha=(ochild.style.opacity)?ochild.style.opacity:1;
				oitem.alpha=oitem.alpha-(0.03);
				if(oitem.alpha<0) oitem.alpha=0;
				if(oitem.alpha>0){
					ochild.style.opacity=oitem.alpha;
					ochild.style.filter="alpha(opacity="+(oitem.alpha*100)+")";
				}else{
					clearInterval(oitem.timer2);
				}
			},1);
		}
	}

	if(ochild!=null && ochild!=''){
		var l,t,h,w;
		var pos=findPos(oitem);
		ochild.style.position='absolute';
		ochild.style.visibility='hidden';
		ochild.style.display='';
		h=ochild.offsetHeight;
		w=ochild.offsetWidth;
		switch(p['position']){
			case 'north':
				l=pos[0];
				t=pos[1]-h;
			break;
			case 'east':
				l=pos[0]+oitem.offsetWidth;
				t=pos[1];
			break;
			case 'south':
				l=pos[0];
				t=pos[1]+oitem.offsetHeight;
			break;
			case 'west':
				l=pos[0]-w;
				t=pos[1];
			break;
			default:
				l=pos[0]+oitem.offsetWidth;
				t=pos[1];
			break;
		}
		ochild.style.position='absolute';
		ochild.style.left=l+p['offsetX']+'px';
		ochild.style.top=t+p['offsetY']+'px';
		ochild.style.opacity='1';
		ochild.style.visibility='visible';
	}
}

function findPos(obj){
	var curleft = curtop = 0;
	if(obj.offsetParent){
		do{
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}while (obj = obj.offsetParent);
	}
	return [curleft,curtop];
}
function parseProp(str){
	var arrProp,ret=new Array();
	if(str==null || str=="") return ret;
	var ret=new Array();
	var arrStr=str.split(",");
	for(var i=0;i<arrStr.length;i++){
		arrProp=arrStr[i].split("=");
		ret[arrProp[0]]=arrProp[1];
	}
	return ret;
}
function getLastIndex(){
	var m=1;
	var all=(document.all)?document.all:document.getElementsByTagName('*');
	for(var i in all){
		try{
			if(parseInt(all[i].style.zIndex)>m) m=parseInt(all[i].style.zIndex);
		}catch(e){}
	}
	return m;
}
