var inmenu=false;
var lastmenu=0;

function Menu(current) {
   if (!document.getElementById) return;
   inmenu=true;
   oldmenu=lastmenu;
   lastmenu=current;
   if (oldmenu) Erase(oldmenu);
   m=document.getElementById("menu-" + current);
   box=document.getElementById(current);
   tableWidth=document.getElementById("heading").style.width;
   var offset;
   var colWidth;
   switch(current) {
     case "home":
	   offset="0%";
	   colWidth="16%";
	   break;
     case "projects": 
	   offset="16%";
	   colWidth="17%";
	   break;
     case "pictures":
	   offset="33%";
	   colWidth="17%";
	   break;
     case "contact":
	   offset="50%";
	   colWidth="17%";
	   break;
     case "board":
	   offset = "67%";
	   colWidth="17%";
	   break;
     case "help":
	   offset = "84%";
	   colWidth="16%";
	   break;
   }
   box.style.left= offset;
   window.setTimeout("show('"+colWidth+"');",300);
}

function show(colWidth){
   if (!inmenu) return;
   m=document.getElementById("menu-" + lastmenu);
   box=document.getElementById(lastmenu);
   box.style.visibility="visible";
   m.style.backgroundColor="#F0EEE0";
   box.style.backgroundColor="#F0EEE0";
   box.style.width=colWidth;
}

function Erase(current) {
   if (!document.getElementById) return;
   if (inmenu && lastmenu==current) {
	  return;
   }
   m=document.getElementById("menu-" + current);
   box=document.getElementById(current);
   box.style.visibility="hidden";
   m.style.backgroundColor="#FBF9E9";
}
function Timeout(current) {
   inmenu=false;
   window.setTimeout("Erase('" + current + "');",500);
}
function Highlight(menu,item) {
   if (!document.getElementById) return;
   inmenu=true;
   lastmenu=menu;
   obj=document.getElementById(item);
   obj.style.backgroundColor="#BEDFC4";
}
function UnHighlight(menu,item) {
   if (!document.getElementById) return;
   Timeout(menu);
   obj=document.getElementById(item);
   obj.style.backgroundColor="#F0EEE0";
}

//clears out styles when the page is unloaded
function closeout() {
	inmenu=false;
}

/**
 * Drag.js: drag absolutely positioned HTML elements:
 * Arguments:
 *
 *   elementToDrag: the element that received the mousedown event or
 *     some containing element. It must be absolutely positioned. Its
 *     style.left and style.top values will be changed based on the user's
 *     drag.
 *
 *  event: the Event object for the mousedown event.
 **/
 function drag(elementToDrag, event){
	 // mouse position in window coordinates
	 var startX = event.clientX;
	 var startY = event.clientY;
	 // The original position in document coordinates of the element
	 var origX = elementToDrag.offsetLeft;
	 var origY = elementToDrag.offsetTop;
	 // we can compute the distance between these two point because
	 // the scrollbar position does not change during the drag.
	 var deltaX = startX - origX;
	 var deltaY = startY - origY;
	 // register handlers for the mousemove and mouseup events that
	 // follow this mousedown event.
	 if (document.addEventListener) {
		 document.addEventListener("mousemove",moveHandler, true);
		 document.addEventListener("mouseup", upHandler, true);
	 }
	 else if (document.attachEvent) {
		 elementToDrag.setCapture();
		 elementToDrag.attachEvent("onmousemove", moveHandler);
		 elementToDrag.attachEvent("onmouseup", upHandler);
		 // treat loss of capture as mouseup event
		 elementToDrag.attachEvent("onlosecapture", upHandler);
	 }
	 else {
		 var oldmovehandler = document.onmousemove; //used by upHandler()
		 var olduphandler = document.onmouseup;
		 document.onmousemove = moveHandler;
		 document.onmouseup = upHandler;
	 }
	 // We've handled the event so don't allow it to bubble up
	 if(event.stopPropagation) event.stopPropagation();
	 else event.cancelBubble = true;
	 // prevent default action
	 if (event.preventDefault) event.preventDefault();
	 else event.returnValue = false;
	 
	 /**
	 * This is the handler that captures the mousemove events and
	 * moves the element
	 **/
	 function moveHandler(e) {
		 if (!e) e = window.event;
		 // move the element to the current mouse location adjusted
		 // by the offset of the initial mouseclick
		 elementToDrag.style.left = (e.clientX - deltaX) + "px";
		 elementToDrag.style.top = (e.clientY - deltaY) + "px";
		 // don't bubble
		 if(e.stopPropagation) e.stopPropagation();
		 else e.cancelBubble = true;
	 }
	 
	 /**
	 * this is the handler for the mouse up at the end of the drag
	 **/
	 function upHandler(e){
		 if (!e) e = window.event;
		 // unregister the capturing event handlers
		 if (document.removeEventListener) {
			 document.removeEventListener("mouseup", upHandler, true);
			 document.removeEventListener("mousemove",moveHandler, true);
		 }
		 else if (document.detachEvent) {
			 elementToDrag.detachEvent("onlosecapture", upHandler);
			 elementToDrag.detachEvent("onmouseup", upHandler);
			 elementToDrag.detachEvent("onmousemove", moveHandler);
			 elementToDrag.releaseCapture();
		 }
		 else {
			 document.onmouseup = olduphandler;
			 document.onmousemove = oldmovehandler;
		 }
		 // stop propagation
		 if(e.stopPropagation) e.stopPropagation();
		 else e.cancelBubble = true;
	 }
 }
 
 function openwindow(picnum, e){
	 var thescroll = 0;
	 if(window.InnerWidth){
		 thescroll=window.pageYOffset;
	 }
	 else if (document.documentElement && document.documentElement.clientWidth){
		 thescroll=document.documentElement.scrollTop;
	 }
	 else if (document.body.clientWidth){
		 thescroll=document.body.scrollTop;
	 }
	 var myframe=document.getElementById("bigframe");
	 var picheight = picnum.charAt(picnum.length - 1)=='v'?1097:630;
	 var startletter=picnum.charAt(0)=='v'?'v':'u';
	 var mypic=document.getElementById("bpicture");
	 myframe.style.height=picheight+"px";
	 myframe.style.top=(50+thescroll)+"px";
	 mypic.style.height=(picheight-30)+"px";
	 mypic.style.background="url(pictures/"+startletter+"09/"+picnum+".jpg)";
	 myframe.style.visibility="visible";
 }
 
 function closepicture(){
	 document.getElementById("bigframe").style.visibility="hidden";
 }
 
window.onunload=closeout;