var home_flag = false;
var pP = "";

(document.layers) ? layerobj = true : layerobj = false;
(document.all) ? allobj = true : allobj = false;
(document.getElementById) ? dom = true : dom = false;

var tdColor="#ffffff";	// menu item text color
var tdBgColor="#993333";	// menu item background color
var hlColor="#000000";	// highlight text color
var hlBgColor="#e1eeda";	// highlight background color

var curHl = 0;
var windowWidth = 900;

var menuNumof = 4;
var menuID= [0, "mDes", "mPri", "mMed"];	// index zero means hide all
var menuState = [ 0, 0 , 0, 0 ];		// 0 = hidden, 1 transition, 2 visible
var menuAction = [ 0, 0 , 0, 0 ];		// 1 = blend to visible, 2 blend to hide
var menuOpacity = [ 0, 0 , 0, 0 ];
var menuTop = [0, 90 , 90, 90 ];
var menuLeft = [0, 450 , 552, 655 ];
var menuHeight = [ 0, 0 , 0, 0 ];
var menuWidth = [ 0, 0 , 0, 0 ];

var menuTimer = 0;
var menuTimeInc = 20;
var menuPerChange = 10;  //Inc * 100 divided by PerChange is the time it takes to transition

function locMenu(index) {

	var wW = windowWidth;
	var mID = "";
	var mLeft = 0;

	if(index >= menuNumof) return;

	if(window.document.body.clientWidth) wW = window.document.body.clientWidth;
	else if(window.innerWidth) wW = window.innerWidth;
	if( wW > windowWidth) mLeft = menuLeft[index] + (wW - windowWidth - 1)/2;
	else mLeft = menuLeft[index];

	mID = menuID[index];

	if(dom) {
		var obj =  window.document.getElementById(mID).style;
		var element =  window.document.getElementById(mID);
		obj.top = menuTop[index] + "px";
		obj.left = mLeft + "px";
		menuHeight[index] = element.offsetHeight;
		menuWidth[index] = element.offsetWidth;
//		element.clip = "rect(obj.top,right,bottom,obj.left)";   Need to fix right and bottom variables
	}
	else if(layerobj) {
		document.layers[mID].top = menuTop[index];
		document.layers[mID].left = mLeft;
	}
	else if(allobj) {
		document.all[mID].style.top =  menuTop[index];
		document.all[mID].style.left =  mLeft;
	}
}

function animEngine()
{
	var i;
	var mID;
	var stoptimer = 1;
	var opacity = 0;
	for(i = 1; i < menuNumof; ++i)
	{
		mID = menuID[i];
		if( mID == 0) continue;
		var object = document.getElementById(mID).style;
		switch( menuAction[i] )
		{
			case 1:
				opacity = menuOpacity[i];
				opacity += menuPerChange;
				stoptimer = 0;
				if( opacity >= 100 ) {opacity = 100; menuAction[i] = 0; menuState[i] = 2;}
				object.opacity = (opacity / 100);
				object.MozOpacity = (opacity / 100);
				object.KhtmlOpacity = (opacity / 100);
				object.filter = "alpha(opacity=" + opacity + ")";
				object.visibility = "VISIBLE";
				menuOpacity[i] = opacity;
				break;
			case 2:
				opacity = menuOpacity[i];
				opacity -= menuPerChange;
				stoptimer = 0;
				if( opacity <= 0 ) {opacity = 0; menuAction[i] = 0; menuState[i] = 0;}
				object.opacity = (opacity / 100);
				object.MozOpacity = (opacity / 100);
				object.KhtmlOpacity = (opacity / 100);
				object.filter = "alpha(opacity=" + opacity + ")";
				menuOpacity[i] = opacity;
				if(opacity == 0) object.visibility = "HIDDEN";
				break;
			default: break;
		}
	}

	if(stoptimer && menuTimer) {clearInterval(menuTimer); menuTimer = 0;}
}


function setMenu(index, the_change) {

	if(index >= menuNumof) return;
	var mID = "";
	var i;

	for(i = 1; i < menuNumof; ++i)
	{
	    mID = menuID[i];
		if( (i == index) && (the_change == "visible")) {
			if(dom) {
				menuAction[i] = 1;
				menuState[i] = 1;
				if(menuTimer == 0) menuTimer = setInterval("animEngine()", menuTimeInc);
			}
			else if(layerobj) document.layers[mID].visibility = "SHOW";
			else if (allobj) document.all[mID].style.visibility = "VISIBLE";
		} else {
		    if(dom) {
				if(menuState[i] == 0) continue;
				menuAction[i] = 2;
				menuState[i] = 1;
				if(menuTimer == 0) menuTimer = setInterval("animEngine()", menuTimeInc);
			}
			else if(layerobj) document.layers[mID].visibility = "HIDE";
			else if (allobj) document.all[mID].style.visibility = "HIDDEN";

			setItem(0,false);
		}
	}

}

function setItem(iID, the_flag) {

	if((the_flag == true) && (iID != 0)) {
		if(dom)  {
			document.getElementById(iID).style.backgroundColor = hlBgColor;
			document.getElementById(iID).style.color = hlColor;
		} else if(layerobj)  {
			document.layers[iID].backgroundColor = hlBgColor;
			document.layers[iID].color = hlColor;
		} else if (allobj) {
			document.all[iID].style.backgroundColor = hlBgColor;
			document.all[iID].style.color = hlColor;
		}

		if( curHl == 0) {curHl = iID; return;}
		if( curHl == iID) return;
	}

	if(curHl == 0) return;

	if(dom)  {
		document.getElementById(curHl).style.backgroundColor = tdBgColor;
		document.getElementById(curHl).style.color = tdColor;
	} else if(layerobj)  {
		document.layers[curHl].backgroundColor = tdBgColor;
		document.layers[curHl].color = tdColor;
	} else if (allobj) {
		document.all[curHl].style.backgroundColor = tdBgColor;
		document.all[curHl].style.color = tdColor;
	}

	if( the_flag == true) curHl = iID;
	else curHl = 0;

}

function showMenuItem(index)
{
	if(index >= menuNumof) return;
	if(index == 0)
		setMenu(0, "hidden");
	else {
		locMenu(index);
		setMenu(index,"visible");
		setItem(0,false);
	}
}

function spaceMenu()
{
	document.write("<div class='CDDspace' onMouseOver='showMenuItem(0);'>&nbsp;</div>");
}


function init_frame(level,homeflag)
{

if (level == 0) pP = "";
if (level == 1) pP = "../"
if (level == 2) pP = "../../"

sH = '<table cellspacing="0" name="mDes" id="mDes" class="CDDmenu" onMouseOver="setMenu(1, \'visible\');">';
sH+= '<tr><td class="CDDmenuitem" name="mDes1" id="mDes1" onMouseOver="setItem(\'mDes1\', true);"  onClick="window.location = pP + \'matters.html\';">&bull; Design Matters</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mDes2" id="mDes2" onMouseOver="setItem(\'mDes2\', true);"  onClick="window.location = pP + \'struct.html\';">&bull; Structure</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mDes3" id="mDes3" onMouseOver="setItem(\'mDes3\', true);"  onClick="window.location = pP + \'tools.html\';">&bull; Tools</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mDes4" id="mDes4" onMouseOver="setItem(\'mDes4\', true);"  onClick="window.location = pP + \'gallery.html\';">&bull; Design Gallery</td></tr>';
sH+= '</table>';
document.write(sH);

sH = '<table cellspacing="0" name="mPri" id="mPri" class="CDDmenu" onMouseOver="setMenu(2, \'visible\');">';
sH+= '<tr><td class="CDDmenuitem" name="mPri1" id="mPri1" onMouseOver="setItem(\'mPri1\', true);"  onClick="window.location = pP + \'Portfolio/print1.html\';">&bull; Print Portfolio</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mPri2" id="mPri2" onMouseOver="setItem(\'mPri2\', true);"  onClick="window.location = pP + \'identity.html\';">&bull; Identity</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mPri3" id="mPri3" onMouseOver="setItem(\'mPri3\', true);"  onClick="window.location = pP + \'brand.html\';">&bull; Brand</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mPri4" id="mPri4" onMouseOver="setItem(\'mPri4\', true);"  onClick="window.location = pP + \'ads.html\';">&bull; Advertising</td></tr>';
sH+= '</table>';
document.write(sH);

sH = '<table cellspacing="0" name="mMed" id="mMed" class="CDDmenu" onMouseOver="setMenu(3, \'visible\');">';
sH+= '<tr><td class="CDDmenuitem" name="mMed1" id="mMed1" onMouseOver="setItem(\'mMed1\', true);"  onClick="window.location = pP + \'Portfolio/web1.html\';">&bull; Web Portfolio</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mMed2" id="mMed2" onMouseOver="setItem(\'mMed2\', true);"  onClick="window.location = pP + \'Web/website.html\';">&bull; Website Creation</td></tr>';
sH+= '<tr><td class="CDDmenuitem" name="mMed3" id="mMed3" onMouseOver="setItem(\'mMed3\', true);"  onClick="window.location = pP + \'ppt.html\';">&bull; Presentations</td></tr>';
sH+= '</table>';
document.write(sH);
}