function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v3.0
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

/* 
 * Following code creates menus sensitive to mouse over and mouse out.
 * Each menu has two parts: menu title and menu content.  We use an array
 * to store votes for each menu.  Each menu has two voters, one is the menu
 * title and the other is menu content.  When mouse is over either one,
 * it will get one vote whereas when mouse is out of either one, it will loose
 * one vote.  Therefore, when a menu's vote is zero, it means that the mouse
 * is neither over the menu title nor the menu content so we should hide
 * the menu.  On the other hand, if the menu's vote is 1, it means that
 * the mouse is either over menu title or menu content so we should show
 * the menu.  A menu from invisible to visible can only be triggered by 
 * mouse over menu title.  When this happens, we show the menu.  When user
 * moves mouse out of title area, we decrement the menu's vote and set a 
 * timer which closes the menu after a fixed period of time only if the menu's
 * vote is zero.  So if the user moves the mouse into the content area, the
 * vote will still be one which won't trigger the close action.  Same thing
 * happens when we move the mouse out of content area.  However if the user
 * moves the mouse to a position out of both title and content area, the vote
 * for the menu will be zero and the timer will close the menu shortly.
 * 
 * To get layer effect in both NS and IE, we use LAYER tag in NS and DIV
 * tag in IE.  
 */
var menuNum=7;
var menuWidthArray=new Array();
var menuList=new Array();
var showMenuVote=new Array();
var leftPosArray=new Array();
var topPosArray=new Array();
var menuHeightArray=new Array();
var menuContentArray=new Array();
var menuNameArray=new Array();
var thePause=80;
var timerID;
var curMenu="none";
function createLayer(name, left, top,width, height, visible, bgcolor, fgcolor, content) {
  var z=menuList.length; 
  menuList[z]=name;
  showMenuVote[z]=0;
  if (document.layers) {
    document.writeln('<layer BGCOLOR='+bgcolor+' color='+fgcolor+' name="' +name+ '" left=' +left+' top=' +top+ ' width=' +width+' height=' +height+ ' visibility=' +((visible==1)?'"show"':'"hide"') +' z-index=30000' + ' onMouseOver="mouseOverLayer(\'' +name+'\');" onMouseOut="mouseOutLayer(\''+name+'\');">');
    document.writeln('<P align="left">'+content+'</P>');    
    document.writeln('</layer>');
  }
  else if (document.all) {
    document.writeln('<div align="left" id="' +name+ '" style="position:absolute;overflow:none;padding:10; background-color:'+bgcolor+'; color:'+fgcolor+'; left:' +left+ 'px; top:' +top+ 'px; width:' +width+ 'px; height:' +height+ 'px;' +' visibility:' +((visible==1)?'visible;':'hidden;') +' z-index:30000' +'" onMouseOver="mouseOverLayer(\''+name+'\'); "onMouseOut="mouseOutLayer(\''+name+'\');">');
    document.writeln(content);
    document.writeln('</div>');
  }
  //clipLayer(name, 0, 0, width,height);
}

function getMenuIndex(name) {
  for (var i=0; i<menuList.length; i++) {
    if (menuList[i]==name) return i;
  }
  return -1;
}

/*
 * When mouse is over the menu content layer,
 * increment its vote and clear the timer set 
 * for this menu content layer.
 */
function mouseOverLayer(name) {
  showMenuVote[getMenuIndex(name)]++;  
  clearTimeout(timerID);
}

/*
 * When mouse is out of the menu content layer,
 * decrement its vote and time out this layer.
 */
function mouseOutLayer(name) {
  showMenuVote[getMenuIndex(name)]--;
  timeOutMenu();
}

/* 
 * Clear previous timer first.
 * Set new timer for current displayed menu.
 * If its vote reaches zero, close it.
 */
function timeOutMenu() {
  clearTimeout(timerID);
  timerID=setTimeout("if(showMenuVote[getMenuIndex(curMenu)]==0)closeMenu();", thePause);
}

/*
 * When mouse is over menu title, 
 * open menu and increment its vote.
 */
function menuOver(name) {
  openMenu(name);
  showMenuVote[getMenuIndex(name)]++;
}

/* 
 * When mouse is out of menu title,
 * decrement its vote and time out the menu.
 */
function menuOut(name) {
  showMenuVote[getMenuIndex(name)]--;
  timeOutMenu();
}

/* 
 * First clear the timer set previously.
 * Then close any currently opened menu.
 * Set current menu flag to the given menu name.
 * At last show the new menu.
 */
function openMenu(name) {
  clearTimeout(timerID);
  closeMenu();
  curMenu=name;
  showLayer(name);
}

/* If current menu flag is not "none",
 * hide current menu.
 */
function closeMenu() {
  if (curMenu!="none") {
    hideLayer(curMenu);
    curMenu="none";
  }
}

function hideLayer(name) {
  var layer=getLayer(name); 
  if (document.layers) layer.visibility="hide";
  if (document.all) layer.visibility="hidden";
}

function showLayer(name) {
  var layer=getLayer(name);
  if (document.layers) layer.visibility="show";
  if (document.all) layer.visibility="visible";
}

function clipLayer(name, clipleft, cliptop, clipright, clipbottom) {
  var layer=getLayer(name);
  if (document.layers) {
    layer.clip.left=clipleft;
    layer.clip.top=cliptop;
    layer.clip.right=clipright;
    layer.clip.bottom=clipbottom;
  }
  if (document.layers) {
    layer.clip='rect('+cliptop+' '+clipright+' '+clipbottom+' '+clipleft+')';
  }
}

function getLayer(name) {
  if (document.layers) return (document.layers[name]);
  else if (document.all) {
    layer=eval('document.all.'+name+'.style'); 
    return layer;
  }
  else {
    return null;
  }
}

function initPosArrays() {
  var topConst;
  var leftPos;
  if (navigator.appName=="Netscape") {
    leftPos=11;
    topConst=37+80;
  }
  else {
    leftPos=13;
    topConst=44+80;
  }
  for (var i=0; i<menuNum; i++) {
    topPosArray[i]=topConst;
    leftPosArray[i]=leftPos+i*139;
  }
}

function initMenuWidthArray() {
  menuWidthArray[0]=135;
  menuWidthArray[1]=180;
  menuWidthArray[2]=155;
  menuWidthArray[3]=135;
  menuWidthArray[4]=135;
  menuWidthArray[5]=135;
  menuWidthArray[6]=135;
}

function initMenuHeightArray() {
  menuHeightArray[0]=50;
  menuHeightArray[1]=100;
  menuHeightArray[2]=200;
  menuHeightArray[3]=200;
  menuHeightArray[4]=150;
  menuHeightArray[5]=150;
  menuHeightArray[6]=50;
}
function initMenuContentArray() {
  menuContentArray[0]='<A href="index.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>My Homepage</B></Font></A>';

  menuContentArray[1]='<A href="chatroom.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>Chat Room</B></Font></A><br>';
  menuContentArray[1]+='<A href="riveracct.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Riverknoll Account</B></Font></A><br>';
  menuContentArray[1]+='<A href="projects.html"><Font face="Helvetica" size="2" color="#ffffff"><B>CS Projects</B></Font></A><br>';

  menuContentArray[2]='<A href="fav-banks.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>Banks &amp; Credits</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-onlineshopping.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Online Shopping</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-ITLinks.html"><Font face="Helvetica" size="2" color="#ffffff"><B>IT Links</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-yahoo.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Yahoo!</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-searchengine.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Search Engines</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-friends.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Friends</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-bbs.html"><Font face="Helvetica" size="2" color="#ffffff"><B>BBS</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-misc.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Miscellaneous</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-photography.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Photography</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-hardware.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Hardware</B></Font></A><br>';
  menuContentArray[2]+='<A href="fav-networking.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Networking</B></Font></A><br>';
 
  menuContentArray[3]='<A href="learn-linux.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>Linux</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-java.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Java</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-perl.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Perl</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-javascript.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Javascript</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-xml.html"><Font face="Helvetica" size="2" color="#ffffff"><B>XML</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-cpp.html"><Font face="Helvetica" size="2" color="#ffffff"><B>C++</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-html.html"><Font face="Helvetica" size="2" color="#ffffff"><B>HTML</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-latex.html"><Font face="Helvetica" size="2" color="#ffffff"><B>LaTeX</B></Font></A><br>';
  menuContentArray[3]+='<A href="learn-shell.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Shell</B></Font></A><br>';
  

  menuContentArray[4]='<A href="albums-lily-pg01.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>My Girl</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-wed-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Wedding</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-bride-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Bride Photos</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-travel-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Travel</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-airshow-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Air Show</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-family-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Family</B></Font></A><br>';
  menuContentArray[4]+='<A href="albums-class-pg01.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Class</B></Font></A><br>';


  menuContentArray[5]='<A href="about-bio.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>Biography</B></Font></A><br>';
  menuContentArray[5]+='<A href="about-resume.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Resume</B></Font></A><br>';
  menuContentArray[5]+='<A href="about-literature.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Literature</B></Font></A><br>';
  menuContentArray[5]+='<A href="about-contact.html"><Font face="Helvetica" size="2" color="#ffffff"><B>Contact Me</B></Font></A><br>';

  menuContentArray[6]='<A href="reserved.html"><Font  face="Helvetica" size="2" color="#ffffff"><B>Reserved</B></Font></A><br>';
}

function initMenuNameArray() {
  menuNameArray[0]='homeMenu';
  menuNameArray[1]='chatMenu';
  menuNameArray[2]='favoritesMenu';
  menuNameArray[3]='learningMenu';
  menuNameArray[4]='albumsMenu';
  menuNameArray[5]='aboutMeMenu';
  menuNameArray[6]='reservedMenu';
}

function createAllLayers() {
  initMenuNameArray();
  initMenuContentArray();
  initPosArrays();
  initMenuHeightArray();
  initMenuWidthArray();
  for (var i=0; i<menuNum; i++) {
    createLayer(menuNameArray[i], leftPosArray[i], topPosArray[i], menuWidthArray[i], menuHeightArray[i], 0, "#0099cc", "#ffffff", menuContentArray[i]);
  }
}

createAllLayers();