// Menu class:
// -item[id].parentid
//          .text
//          .url
//          .level
//          .childid[]
// -rootid
// -menuopenid
// -optionopenid
// -popuptimer
// -popdowntimer
// -mousein
// -settings.imagepath
//          .style
//          .stylemo
//          .target
// +add()
// -buildmenu()
// -buildoptions()
// -buildsuboptions()
// -itemover()
// -itemout()
// -itemclicked()
// -itemhighlite()
// -pop()
// -pulldown()
// -pullup()
// +show()

function Menu()
/* Menu object constructor */
{
   /* properties */
   this.item=new Array()
   this.rootid=null
   this.menuopenid=null
   this.mousein=false
   this.optionopenid=null
   this.popuptimer=null
   this.popdowntimer=null
   this.settings=new Object()
   this.settings.imagepath=''
   this.settings.style='color:#303030; background-color:#B3D3FF; border:1px solid #00659C; text-align:center;'
   this.settings.stylemo='color:#000000; background-color:#639ACE; border:1px solid #00659C; text-align:center;'
   this.settings.target='location.href'
   this.settings.width='520'
   /* methods */
   this.add=Menu_add
   this.buildmenu=Menu_buildmenu
   this.buildoptions=Menu_buildoptions
   this.buildsuboptions=Menu_buildsuboptions
   this.itemover=Menu_itemover
   this.itemout=Menu_itemout
   this.itemclicked=Menu_itemclicked
   this.itemhighlite=Menu_itemhighlite
   this.pop=Menu_pop
   this.pulldown=Menu_pulldown
   this.pullup=Menu_pullup
   this.show=Menu_show
}

function Menu_add(parentid,id,text,url)
/* Add item method */
{
   this.item[id]=new Menu_item(parentid,text,url)
   if(parentid==0) //root item
   {
      this.item[id].level=0
      this.item[id].open=true
      this.rootid=id
   }
   else //item
   {
      this.item[id].level=this.item[parentid].level+1
      this.item[parentid].childid[this.item[parentid].childid.length]=id
   }
}

function Menu_buildmenu()
/* Build menu method */
{
   var teller, childid, html=new Array()
   html[html.length]='<span id="menu">'
   html[html.length]='<table cellpadding="3" cellspacing="2" width="'+this.settings.width+'"><tr>'
   for(teller=0;teller<this.item[this.rootid].childid.length;teller++)
   {
      childid=this.item[this.rootid].childid[teller]
      html[html.length]='<td id="menu_item'+childid+'" class="menustyle" style="cursor:'+(this.item[childid].url!=''? 'hand': 'default')+';" '+(this.item[childid].url!=''? 'onmouseover="menu.itemover('+childid+');menu.pulldown('+childid+');"': '')+' onmouseout="menu.itemout('+childid+')" onmousedown="menu.itemclicked('+childid+')" ondblclick="menu.itemclicked('+childid+')" onselectstart="return(false)">&nbsp;'+this.item[childid].text+'&nbsp;</td>'
   }
   html[html.length]='</tr></table>'
   html[html.length]='<span id="menu_options"></span>'
   html[html.length]='</span>'
   return(html.join(''))
}

function Menu_buildoptions(id)
/* Build options method */
{
   var teller, childid, html=new Array()
   html[html.length]='<table cellpadding="0" cellspacing="0"><tr><td valign="top">'
   //inspring
   if(document.all['menu_item'+id].offsetLeft>0) html[html.length]='<img width="'+document.all['menu_item'+id].offsetLeft+'" height="1" style="visibility:hidden">'
   //opties
   html[html.length]='</td><td valign="top">'
   html[html.length]='<table cellpadding="3" cellspacing="0" style="border-collapse:collapse; border-width:1px;">'
   for(teller=0;teller<this.item[id].childid.length;teller++)
   {
      childid=this.item[id].childid[teller]
      html[html.length]='<tr><td id="menu_item'+childid+'" class="menustyle" style="cursor:'+(this.item[childid].url!=''? 'hand': 'default')+';" onmouseover="menu.itemover('+childid+')" onmouseout="menu.itemout('+childid+')" onclick="menu.itemclicked('+childid+')" nowrap>'
      if(this.item[childid].childid.length>0) html[html.length]='<img name="menu_pijl'+childid+'" src="'+this.settings.imagepath+'menu_pijl.gif" width="4" height="7" hspace="6" vspace="4" align="right">'
      html[html.length]='&nbsp;&nbsp;&nbsp;'+this.item[childid].text+'&nbsp;&nbsp;&nbsp;'+(this.item[childid].childid.length>0? '&nbsp;&nbsp;&nbsp;': '')
      html[html.length]='</td></tr>'
   }
   html[html.length]='</table>'
   //subopties
   html[html.length]='</td><td valign="top"><span id="menu_suboptions"></span>'
   html[html.length]='</td></tr></table>'
   return(html.join(''))
}

function Menu_buildsuboptions(id)
/* Build suboptions method */
{
   var teller, childid, html=new Array()
   //inspring
   if(document.all['menu_item'+id].offsetTop-1>0) html[html.length]='<img width="1" height="'+(document.all['menu_item'+id].offsetTop-1)+'" style="visibility:hidden">'
   //subopties
   html[html.length]='<table cellpadding="2" cellspacing="0" style="border-style:outset; border-width:1px;">'
   for(teller=0;teller<this.item[id].childid.length;teller++)
   {
      childid=this.item[id].childid[teller]
      html[html.length]='<tr><td id="menu_item'+childid+'" class="menustyle" style="cursor:'+(this.item[childid].url!=''? 'hand': 'default')+';" onmouseover="menu.itemover('+childid+')" onmouseout="menu.itemout('+childid+')" onclick="menu.itemclicked('+childid+')" nowrap>&nbsp;&nbsp;&nbsp;'+this.item[childid].text+'&nbsp;&nbsp;</td></tr>'
   }
   html[html.length]='</table>'
   return(html.join(''))
}

function Menu_itemover(id)
/* Item over method */
{
   this.itemhighlite(id,true)
   this.mousein=true
   if(this.item[id].level==1) //menu item
   {
      if(this.menuopenid!=null && this.menuopenid!=id)
      {
         this.itemhighlite(this.menuopenid,false)
         document.all['menu_options'].innerHTML=this.buildoptions(id)
         this.menuopenid=id
         this.optionopenid=null
      }
   }
   else if(this.item[id].level==2) //menuoptie item
   {
      if(this.optionopenid!=id)
      {
         if(this.optionopenid!=null)
         {
            this.itemhighlite(this.optionopenid,false)
            if(this.item[id].childid.length==0) this.pop(this.optionopenid,false,true)
            this.optionopenid=null
         }
         if(this.item[id].childid.length>0) this.pop(id,true,true)
      }
   }
   else //menusuboptie item
   {
      if(this.optionopenid==null)
      {
         this.itemhighlite(this.item[id].parentid,true)
         this.optionopenid=this.item[id].parentid
         this.pop(this.item[id].parentid,true,false)
      }
   }
}

function Menu_itemout(id)
/* Item out method */
{
   this.mousein=false
   if(this.item[id].level==1) //menu item
   {
      if(this.menuopenid==null) this.itemhighlite(id,false)
   }
   else if(this.item[id].level==2) //menuoptie item
   {
      if(this.optionopenid==null)
      {
         this.itemhighlite(id,false)
         if(this.item[id].childid.length>0) this.pop(id,false,true)
      }
   }
   else //menusuboptie item
   {
      this.itemhighlite(id,false)
   }
}

function Menu_itemclicked(id)
/* Item clicked method */
{
   if(this.item[id].level==1) //menu item
   {
      if(this.menuopenid==null) //pulldown
      {
         this.pulldown(id)
      }
      else //pullup
      {
         this.pullup()
         this.itemhighlite(id,true)
      }
   }
   else if(this.item[id].level==2) //menuoptie item
   {
      if(this.item[id].childid.length>0) //folder
      {
         if(this.optionopenid!=id) this.pop(id,true,false)
         this.optionopenid=id
      }
      else this.pullup() //file
   }
   else //menusuboptie item
   {
      this.pullup()
   }
   //hyperlinken
   if(this.item[id].url!='') setTimeout(this.settings.target+'=menu.item['+id+'].url',20)
}


function Menu_itemhighlite(id,on)
/* Item highlite method */
{
   if(on==true)
   {
      document.all['menu_item'+id].className='menustylemo'
      if(this.item[id].level==2 && this.item[id].childid.length>0) document.images['menu_pijl'+id].src=this.settings.imagepath+'menu_pijlmo.gif'
   }
   else
   {
      document.all['menu_item'+id].className='menustyle'
      if(this.item[id].level==2 && this.item[id].childid.length>0) document.images['menu_pijl'+id].src=this.settings.imagepath+'menu_pijl.gif'
   }
}

function Menu_pop(id,up,timer)
/* Pop method */
{
   if(timer==true) //met timer
   {
      if(up==true) //popup
         this.popuptimer=setTimeout('document.all["menu_suboptions"].innerHTML=menu.buildsuboptions('+id+'); menu.popuptimer=null',700)
      else //popdown
      {
         if(this.popuptimer!=null)
         {
            clearTimeout(this.popuptimer)
            this.popuptimer=null
         }
         else this.popdowntimer=setTimeout('document.all["menu_suboptions"].innerHTML=""; menu.popdowntimer=null',700)
      }
   }
   else //zonder timer
   {
      if(this.popuptimer!=null)
      {
         clearTimeout(this.popuptimer)
         this.popuptimer=null
      }
      if(this.popdowntimer!=null)
      {
         clearTimeout(this.popdowntimer)
         this.popdowntimer=null
      }
      if(up==true) document.all['menu_suboptions'].innerHTML=this.buildsuboptions(id); else document.all['menu_suboptions'].innerHTML=''
   }
}

function Menu_pulldown(id)
/* Pull down method */
{
   document.all['menu_options'].innerHTML=this.buildoptions(id)
   this.menuopenid=id
   setTimeout("document.onmousedown=new Function('if(menu.mousein==false) menu.pullup()')",200)
}

function Menu_pullup()
/* Pull up method */
{
   this.pop(null,false,false) //verwijder menusubopties
   document.all['menu_options'].innerHTML='' //verwijder menuopties
   this.itemhighlite(this.menuopenid,false)
   document.onmousedown=null
   this.menuopenid=null
   this.optionopenid=null
}

function Menu_show()
/* Show method */
{
   document.write('<style>.menustyle{'+this.settings.style+'} .menustylemo{'+this.settings.stylemo+'}</style>')
   document.write(this.buildmenu())
}

function Menu_item(parentid,text,url)
/* Item subobject constructor */
{
   this.parentid=parentid
   this.text=text
   this.url=url
   this.level=null
   this.childid=new Array()
}