/******************************************************
* HS_Menu
* DHTML Drop Down Menu
* Author: Jiwon Han
* Email: iamjiwon@hotmail.com
* virsion : v0.94
* Copyright (C) 2004-2005 Jiwon Han
*******************************************************/

/*****************************************************
on v0.91 (1/21/2005)
-added show arrow Icon when menu has child menu 

on v0.92 (1/24/2005)
-added change font color when mouse over menu

on v0.93 (11/3/2005)
- added all menu is allowed to click even menu has sub menu

on v0.94 (11/8/2005)
- added sub menu popup level control
******************************************************/

//Global Variables
var userAgents = navigator.userAgent.toLowerCase();
var browser = new Object();

//detect OS
if (checkIt("mac"))
	browser.os="mac";
else if (checkIt("windows"))
	browser.os="windows";
else if (checkIt("linux"))
	browser.os="linux";
else
	browser.os="unknown";

//detect browser
if(checkIt("konqueror"))
	browser.name="Konqueror";
else if(checkIt("safari"))
	browser.name="safari";
else if(checkIt("opera"))
	browser.name="opera";
else if(checkIt("msie"))
	browser.name="IE";
else if(checkIt("firefox"))
	browser.name="firefox";
else if(checkIt("netscape")){
	browser.name="netscape";
	browser.version=userAgents.charAt(8);
}
else
	browser.name="unknown";

function checkIt(str)
{
	return userAgents.indexOf(str)+1;
}


//Set up show hide string. it will different defend by browser
if (browser.name == "netscape" && browser.virsion == "4"){
	STR_SHOW = "show";
	STR_HIDE = "hide";
}
else{
	STR_SHOW = "visible";
	STR_HIDE = "hidden";
}


//==============================
//Debug Object
//==============================
function Debug(active)
{
	this.active = (active) ? active : false;
	if (this.active)
		this.activate();
}

Debug.prototype.activate = function()
{
	if (document.getElementById('debug')){
		this.msgBox.style.visibility = STR_SHOW;
		this.msgBox.style.position = "relative";
	}
	else{
		document.write ("<div id=debug style=visibility:"+STR_SHOW+";position:relative;width:500px;height:50px;background-color:eeeeee;>DEBUG MODE ON</div><br>");
		this.msgBox = document.getElementById('debug');
	}
	this.active = true;
}
Debug.prototype.deactivate = function()
{
	if (this.active){
		this.msgBox.style.visibility = STR_HIDE;
		this.msgBox.style.position = "absolute";
		this.active = false;
	}
	
}
Debug.prototype.write = function(str,opt)
{
	if (this.active){
		if (opt) 
			this.msgBox.innerHTML += str;
		else
			this.msgBox.innerHTML = str;
	}
}

//create debug and activate it
var myDebug = new Debug();
//myDebug.activate();
//===========================

function HS_Menu()
{
	//Set container menu properties(main menu)
	this.direction = "horizontal" ;
	this.enableParentClick = false;
	this.maxPopupLevel = 100;
	this.width = "" ;
	this.height = "" 
	this.align = "center" ;
	this.cellpadding = 2 ;
	this.cellspacing = 0 ;
	this.borderSize = 1;
	this.borderColor = "000000" ;
	this.mouseOutColor = "eeeeee" ;
	this.mouseOverColor = "cccccc" ;
	this.backgroundImage = "";
	this.styleName = "";
	this.hideDelay = 1;
	this.fontFamily = "arial";
	this.fontColor = "000000";
	this.fontSize = "12";
	this.fontWeight = "normal";
	this.changeBackgroundColor = true;
	this.maxMenu = 0;
	this.showArrowIcon = false;
	this.h_arrowIcon = "";
	this.v_arrowIcon = "v_arrowIcon.gif";
	this.fontColorOver = "";
	this.leftIcon = "";
	this.borderStyle = "";
	this.showMenuLine = false;

	//Set sub menu properties
	this.child_width = "160";
	this.child_height = "";
	this.child_align = "left";
	this.child_cellpadding = 2;
	this.child_cellspacing = 0;
	this.child_borderSize = 1;
	this.child_borderColor = "000000";
	this.child_mouseOutColor = "eeeeee";
	this.child_mouseOverColor = "cccccc";
	this.child_styleName = "";
	this.child_backgroundImage = "";
	this.child_fontFamily = "arial";
	this.child_fontColor = "000000";
	this.child_fontSize = "12";
	this.child_fontWeight = "normal";
	this.child_borderStyle = "";
	this.child_fontColorOver = "";
	
	//Crray of store main menu objects
	this.arr_menu = new Array();
	//This array will store sub menu popup level value of individually by main menu item number
	this.countPopupLevel = new Array();

	//constants
	STR_IMAGENAME = "btn_img_";

	//Set Global Variables
	arr_menuNames = new Array();
	arr_menuTimers = new Array();
	topPosCorrection = 0;
	leftPosCorrection = 0;
	arr_containerMenu = new Array();
	arr_childMenu = new Array();
}

HS_Menu.prototype.addMenu = function(objMenu)
{
	this.menuSize = this.arr_menu.length;
	this.arr_menu[this.menuSize] = objMenu;
}

HS_Menu.prototype.build = function()
{
	str = "<table";
	str += " cellpadding="+this.cellpadding;
	str += " cellspacing="+this.cellspacing;
	if (this.width) str += " width="+this.width;
	if (this.height) str += " height="+this.height;

	//Make Thin Border Line
	str += " style='border:"+this.borderSize+"px solid #"+this.borderColor+";'";
	if (this.backgroundImage) str += " background='"+this.backgroundImage+"'";
	str += ">";
	str += "<tr>";
	imgSrcIndex = 0;
	this.menuCount = this.arr_menu.length-1;
	for (i=0; i<=this.menuCount; i++){
		var menuItem = this.arr_menu[i].arr_menu;
		str += "<td";
		//Make Thin Border Line
		if (i<this.menuCount && this.borderStyle == ""){
			if (this.direction == "horizontal")
				str += " style='border-right:"+this.borderSize+"px solid #"+this.borderColor+";'";
			else
				str += " style='border-bottom:"+this.borderSize+"px solid #"+this.borderColor+";'";
		}
		str += " style='cursor:pointer;'";
		currMenu = this.arr_menu[i];
		if (currMenu.arr_menu.length > 0){
			str_nameTag = "menuItem_"+i;
			str += " onMouseOver=";
			if (this.changeBackgroundColor)
				str += "changeBG(this,'"+this.mouseOverColor+"');";
			str += "showMenu('"+str_nameTag+"',this);setStatus('"+escape(currMenu.title)+"');";
			if (currMenu.imageOn != "")
				str += "changeImgOver("+imgSrcIndex+");";
			if (this.fontColorOver != "")
				str += "changeFontStyle('containerMenu"+i+"','"+this.fontColorOver+"');";
			str += " onMouseOut=";
			if (this.changeBackgroundColor)
				str += "changeBG(this,'"+this.mouseOutColor+"');";
			str += "hideMenu('"+str_nameTag+"');setStatus();";
			if (currMenu.imageOn != "")
				str += "changeImgOut("+imgSrcIndex+");";
			if (this.fontColorOver != "")
				str += "changeFontStyle('containerMenu"+i+"','"+this.fontColor+"');";
			if (this.enableParentClick)
				str += " onClick=doLink('"+currMenu.url+"',"+currMenu.popup+");";				
		}
		else{
			str += " onMouseOver=";
			if (this.changeBackgroundColor)
				str += "changeBG(this,'"+this.mouseOverColor+"');";
			str += "hideMenuAll();setStatus('"+escape(currMenu.title)+"');";
			if (currMenu.imageOn != "")
				str += "changeImgOver("+imgSrcIndex+");";
			if (this.fontColorOver != "")
				str += "changeFontStyle('containerMenu"+i+"','"+this.fontColorOver+"');";
			str += " onMouseOut=";
			if (this.changeBackgroundColor)
				str += "changeBG(this,'"+this.mouseOutColor+"');";
			str += "setStatus();";
			if (currMenu.imageOn != "")
				str += "changeImgOut("+imgSrcIndex+");";
			if (this.fontColorOver != "")
				str += "changeFontStyle('containerMenu"+i+"','"+this.fontColor+"');";
			//str += " onClick=doLink('"+encodeURI(currMenu.url)+"',"+currMenu.popup+");";
			str += " onClick=doLink('"+currMenu.url+"',"+currMenu.popup+");";
		}		
		str += " bgColor='"+this.mouseOutColor+"'";
		str += ">";
		arr_containerMenu[arr_containerMenu.length] = "containerMenu"+i;
		str += "<table cellpadding=0 cellspacing=0 width=100% style='cursor:pointer;'><tr>";
		if (this.leftIcon) 
			str += "<td><img src=" + this.leftIcon + "></td>";
		str += "<td";
		str += " align='"+this.align+"'";
		if (this.styleName) str += " class='"+this.styleName+"'";
		str += " id=containerMenu"+i;
		str += ">";
		if (currMenu.type == "text"){
			str += currMenu.title;
		}
		else{
			str += "<img src='"+currMenu.image+"' border=0";
			if (currMenu.imageOn != "")
				str +=" name='"+STR_IMAGENAME+imgSrcIndex+"'";
			str += ">";
		}
		str += "</td>"
		if (currMenu.arr_menu.length > 0 && this.showArrowIcon && this.h_arrowIcon != ""){
				str += "<td width=10 align=center><img src="
				if (this.direction == "horizontal")
					str += this.h_arrowIcon;
				else
					str += this.v_arrowIcon;
				str += "></td>";
		}
		else if(this.showArrowIcon && this.direction == "vertical")
			str += "<td width=10></td>";

		str += "</tr></table>";
		str += "</td>";
		if (this.showMenuLine && i < this.menuCount)
			str += "<td align=center bgcolor="+this.mouseOutColor+"><img src=hs_menuLine.png></td>"

		if (this.direction == "horizontal"){
			if (this.maxMenu && ((i+1)%this.maxMenu) == 0 && i != (this.arr_menu.length-1))
				str += "</tr><tr>";
		}
		else{
			if (this.maxMenu){
				if ((i+1)%this.maxMenu == 0 && i != (this.arr_menu.length-1))
					str += "</tr><tr>";
			}
			else
				if (i != (this.arr_menu.length-1))
					str += "</tr><tr>";
		}
		if (currMenu.imageOn != "")
				imgSrcIndex++;
	}
	str += "</tr>";
	str += "</table>";
	
	//Draw main menu
	document.write (str);

	//call create child menus
	x = 0;
	for (i=0; i<=this.menuCount; i++){
		if (this.arr_menu[i].arr_menu.length > 0){
			this.countPopupLevel[i] = 1;
			this.createChildMenu(this.arr_menu[i],"menuItem_"+i);
		}
	}

	//Call init
	this.init();	

}

HS_Menu.prototype.createChildMenu = function(objMenu,str_nameTag)
{	
	style = "style=visibility:"+STR_HIDE+";position:absolute;z-index:101;";
	str = "<div id='"+str_nameTag+"' "+style+">";
	str += "<table";
	str += " style='border:"+this.child_borderSize+"px solid #"+this.child_borderColor+";'";
	str += " cellpadding="+this.child_cellpadding;
	str += " cellspacing="+this.child_cellspacing;
	if (this.child_width) str += " width="+this.child_width;
	if (this.child_height) str += " height="+this.child_height;
	if (this.backgroundImage) str += " background='"+this.child_backgroundImage+"'";
	str += ">";
	objMenu.menuCount = objMenu.arr_menu.length-1;		
	for (objMenu.x=0; objMenu.x<=objMenu.menuCount; objMenu.x++){
		str += "<tr>";
		str += "<td";
		//Make Thin Border line
		if (objMenu.x<objMenu.menuCount && this.child_borderStyle == "")
			str += " style='border-bottom:"+this.child_borderSize+"px solid #"+this.child_borderColor+"'";
		str += " style='cursor:pointer;'";
		currMenu = objMenu.arr_menu[objMenu.x];
		if ((this.maxPopupLevel > this.countPopupLevel[i]) && (currMenu.arr_menu.length > 0)){
			str += " onMouseOver=changeBG(this,'"+this.child_mouseOverColor+"');showMenu('"+str_nameTag+"_"+objMenu.x+"',this);setStatus('"+escape(currMenu.title)+"');";
			if (this.child_fontColorOver != "")
				str += "changeFontStyle('childMenu"+x+"','"+this.child_fontColorOver+"');";
			str += " onMouseOut=changeBG(this,'"+this.child_mouseOutColor+"');hideMenu('"+str_nameTag+"_"+objMenu.x+"');setStatus();";
			if (this.child_fontColorOver != "")
				str += "changeFontStyle('childMenu"+x+"','"+this.child_fontColor+"');";	
			if (this.enableParentClick)
				str += " onClick=doLink('"+currMenu.url+"',"+currMenu.popup+");";
		}
		else{
			str += "onMouseOver=changeBG(this,'"+this.child_mouseOverColor+"');hideChildMenu('"+str_nameTag+"');setStatus('"+escape(currMenu.title)+"');";
			if (this.child_fontColorOver != "")
				str += "changeFontStyle('childMenu"+x+"','"+this.child_fontColorOver+"');";

			str += " onMouseOut=changeBG(this,'"+this.child_mouseOutColor+"');hideMenu('"+str_nameTag+"');setStatus();";
			if (this.child_fontColorOver != "")
				str += "changeFontStyle('childMenu"+x+"','"+this.child_fontColor+"');";	
			str += " onClick=doLink('"+currMenu.url+"',"+currMenu.popup+");";	
		}
		str += " bgColor='"+this.child_mouseOutColor+"'";
		str += ">";
		str += "<table cellpadding=0 cellspacing=0 width=100% style='cursor:pointer;'><tr><td";
		str += " align='"+this.child_align+"'";
		if (this.child_styleName) str += " class='"+this.child_styleName+"'";
		str += " id=childMenu"+x;
		str += ">";
		str += currMenu.title;
		if (currMenu.arr_menu.length > 0 && this.showArrowIcon)
			str += "<td width=10 align=center><img src=" + this.v_arrowIcon + "></td>";
		str += "</td></tr></table>";
		str += "</td>";
		str += "</tr>";
		arr_childMenu[arr_childMenu.length] = "childMenu"+x;
		x++;
	}
	str += "</table>";
	str += "</div>";

	//draw sub menu
	document.write (str);

	//store nameTags to array
	arr_menuNames[arr_menuNames.length] = str_nameTag;

	//Call recursive function until last child menu
	if (this.maxPopupLevel > this.countPopupLevel[i]){
		for (objMenu.x=0; objMenu.x<=objMenu.menuCount; objMenu.x++){	
			if (objMenu.arr_menu[objMenu.x].arr_menu.length > 0)
				this.createChildMenu(objMenu.arr_menu[objMenu.x],str_nameTag+"_"+objMenu.x);
		}
		//count current popup menu level position
		if (findMenuLevel(str_nameTag) > this.countPopupLevel[i])
			 this.countPopupLevel[i]++;
	}
}

HS_Menu.prototype.init = function()
{
	hideDelay = this.hideDelay * 1000;
	this.setCorrection();
	this.setFontStyle();
	this.createImageVariables();
	menuDirection = this.direction;
}

HS_Menu.prototype.setCorrection = function()
{
	//subtract border size for child menu popup position
	leftPosCorrection += this.borderSize;
	topPosCorrection += this.borderSize;
}

HS_Menu.prototype.setFontStyle = function()
{
	//Set container menu style
	if (this.styleName == ""){
		for(i=0; i < arr_containerMenu.length; i++){
			currMenu = document.getElementById(arr_containerMenu[i]);
			currMenu.style.fontFamily = this.fontFamily;
			currMenu.style.fontSize = this.fontSize;
			currMenu.style.color = this.fontColor;
			currMenu.style.fontWeight = this.fontWeight;
		}
	}

	//Set child menu style
	if (this.child_styleName == ""){
		for(i=0; i < arr_childMenu.length; i++){
			currMenu = document.getElementById(arr_childMenu[i]);
			currMenu.style.fontFamily = this.child_fontFamily;
			currMenu.style.fontSize = this.child_fontSize;
			currMenu.style.color = this.child_fontColor;
			currMenu.style.fontWeight = this.child_fontWeight;
		}
	}
}

HS_Menu.prototype.createImageVariables = function()
{
	arr_imgSrcOut = new Array();
	arr_imgSrcOver = new Array();

	var x = 0;
	for (i=0; i<this.arr_menu.length; i++){
		currMenu = this.arr_menu[i];
		if (currMenu.imageOn != ""){
			arr_imgSrcOut[x] = currMenu.image;
			arr_imgSrcOver[x] = currMenu.imageOn;
			x++;
		}	
	}
}

function Menu(title,url,type,popup,image,imageOn)
{
	this.title = title ? title : "Menu Item" ;
	this.url = url ? url : "#" ;
	this.type = type ? type : "text" ;
	this.popup = popup ? popup : false;
	this.image = image ? image : "";
	this.imageOn = imageOn ? imageOn : "";
	this.arr_menu = new Array();
}

Menu.prototype.addMenu = function(objMenu)
{
	this.menuSize = this.arr_menu.length;
	this.arr_menu[this.menuSize] = objMenu;
}

function doLink(url,popup)
{
	if (!popup)
		location.href = url;
	else
		window.open(url,'newWin','toolbar=yes,location=yes,directiries=yes,location=yes,menubar=yes,scrollbars=yes,resizable=yes,status=yes');
}

function setStatus(str)
{
	if (str)
		status = unescape(str);
	else
		status = "";
}

function changeImgOver(x){
	document[STR_IMAGENAME+x].src = arr_imgSrcOver[x];
}

function changeImgOut(x){
	document[STR_IMAGENAME+x].src = arr_imgSrcOut[x];
}

function changeBG(obj,color)
{
	if (browser.name == "IE")
		obj.style.backgroundColor = color;
	else
		obj.bgColor = color;
}


function changeFontStyle(objMenu,color)
{
	currMenu = document.getElementById(objMenu);
	currMenu.style.color = color;
}

function calcPosX(str_nameTag,objMenu)
{
	currPosX = 0;
	menuLeft = objMenu.offsetWidth;

	while (objMenu.offsetParent){
		currPosX += objMenu.offsetLeft;
		objMenu=objMenu.offsetParent;
	}

	menuLevel = findMenuLevel(str_nameTag);
	if (menuLevel == 1){
		if (menuDirection == "horizontal")
			currPosX -= leftPosCorrection;
		else
			currPosX += menuLeft-10;			
	}
	else if (menuLevel > 1)
		currPosX += menuLeft-10;

	if (browser.os == "mac" && browser.name != "safari")
		browserWidth = document.body.offsetWidth;

	return currPosX;
}

function calcPosY(str_nameTag,objMenu)
{
	currPosY = 0;
	menuTop = objMenu.offsetHeight;

	if(objMenu.offsetParent){
		while (objMenu.offsetParent){
			currPosY += objMenu.offsetTop;
			objMenu = objMenu.offsetParent;
		}
	}

	menuLevel = findMenuLevel(str_nameTag);
	if (menuLevel == 1){
		if  (menuDirection == "horizontal"){
			currPosY += menuTop;
			currPosY -= topPosCorrection;
		}
		else
			currPosY += 8;
	}
	else if (menuLevel > 1)
		currPosY += 8;

	return currPosY;
}

function findMenuLevel(str_nameTag)
{
	count = 0;
	pos = 0;
	while (pos >= 0){
		pos = str_nameTag.lastIndexOf("_");
		if (pos >= 0){
			str_nameTag = str_nameTag.substring(0,pos);
			count++;
		}
	}
	return count;
}

function setPosition(menuItem,x,y)
{
	menuItem.style.left = x;
	menuItem.style.top = y;
}

function showMenu(str_nameTag,objMenu)
{
	hideChildMenu(str_nameTag);
	posLeft = calcPosX(str_nameTag,objMenu);
	posTop = calcPosY(str_nameTag,objMenu);
	menuItem = document.getElementById(str_nameTag);
	setPosition(menuItem,posLeft,posTop);
	menuItem.style.visibility = STR_SHOW;
}

function hideChildMenu(str_nameTag)
{
	clearTimer(str_nameTag);
	
	//find all parents menu and self menu name
	var arr_appearMenus = new Array();
	pos = 0;
	while (pos >= 0){
		pos = str_nameTag.lastIndexOf("_");
		if (pos >= 0){
			arr_appearMenus[arr_appearMenus.length] = str_nameTag;
			str_nameTag = str_nameTag.substring(0,pos);
		}
	}

	//hide all menus except menu in arr_appearMenus
	for (i=0; i<=arr_menuNames.length-1; i++){
		this.keepIt = false;
		for (j=0; j<=arr_appearMenus.length-1; j++){
			if (arr_menuNames[i] == arr_appearMenus[j])
				this.keepIt = true;
		}
		if (!this.keepIt)
			hideMenuNow(arr_menuNames[i]);
	}
}

function clearTimer(str_nameTag)
{
	pos = 0;
	while (pos >= 0){
		pos = str_nameTag.lastIndexOf("_");
		if (pos >= 0){
			timerIndex = findMenuIndex(str_nameTag);
			timer = arr_menuTimers[timerIndex];

			if (timer)
				window.clearTimeout(timer);

			str_nameTag = str_nameTag.substring(0,pos);
		}
	}
}

function findMenuIndex(str_nameTag)
{
	for (i=0; i<=arr_menuNames.length; i++){
		if (arr_menuNames[i] == str_nameTag)
			return i;
	}
}

function hideMenu(str_nameTag)
{	
	pos = 0;
	while (pos >= 0){
		pos = str_nameTag.lastIndexOf("_");
		if (pos >= 0){
			timerIndex = findMenuIndex(str_nameTag);
			arr_menuTimers[timerIndex] = setTimeout("hideMenuNow('"+str_nameTag+"')",hideDelay);
			str_nameTag = str_nameTag.substring(0,pos);
		}
	}
}

function hideMenuNow(str_nameTag)
{
	menuItem = document.getElementById(str_nameTag);
	menuItem.style.visibility = STR_HIDE;
}

function hideMenuAll()
{
	for (i=0; i<=arr_menuNames.length-1; i++){
		var menuItem = document.getElementById(arr_menuNames[i]);
		menuItem.style.visibility = STR_HIDE;
	}
}