// Javascript from lib.js
/****************************************************************************   
DHTML library from DHTMLCentral.com
*   Copyright (C) 2001 Thomas Brattli 2001
*   This script was released at DHTMLCentral.com
*   Visit for more great scripts!
*   This may be used and changed freely as long as this msg is intact!
*   We will also appreciate any links you could give us.
*
*   Made by Thomas Brattli 2001
***************************************************************************/

//Browsercheck (needed) ***************
function lib_bwcheck(){ 
  this.ver=navigator.appVersion
  this.agent=navigator.userAgent
  this.dom=document.getElementById?1:0
  this.opera5=this.agent.indexOf("Opera 5")>-1
  this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0; 
  this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
  this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
  this.ie=this.ie4||this.ie5||this.ie6
  this.mac=this.agent.indexOf("Mac")>-1
  this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
  this.ns4=(document.layers && !this.dom)?1:0;
  this.bw=(this.ie6||this.ie5||this.ie4||this.ns4||this.ns6||this.opera5)
  return this
}
bw=new lib_bwcheck() //Browsercheck object

//Debug function ******************
function lib_message(txt){return false;}

//Lib objects  ********************
function lib_obj(obj,nest){ 
  if(!bw.bw) return lib_message('Old browser')
  nest=(!nest) ? "":'document.'+nest+'.'
  this.evnt=bw.dom? document.getElementById(obj):
    bw.ie4?document.all[obj]:bw.ns4?eval(nest+"document.layers." +obj):0; 
  if(!this.evnt) return lib_message('The layer does not exist ('+obj+')' 
    +'- \nIf your using Netscape please check the nesting of your tags!')
  this.css=bw.dom||bw.ie4?this.evnt.style:this.evnt; 
  this.ref=bw.dom||bw.ie4?document:this.css.document;
  this.x=parseInt(this.css.left)||this.css.pixelLeft||this.evnt.offsetLeft||0;
  this.y=parseInt(this.css.top)||this.css.pixelTop||this.evnt.offsetTop||0
  this.w=this.evnt.offsetWidth||this.css.clip.width||
    this.ref.width||this.css.pixelWidth||0; 
  this.h=this.evnt.offsetHeight||this.css.clip.height||
    this.ref.height||this.css.pixelHeight||0
  this.c=0 //Clip values
  if((bw.dom || bw.ie4) && this.css.clip) {
  this.c=this.css.clip; this.c=this.c.slice(5,this.c.length-1); 
  this.c=this.c.split(' ');
  for(var i=0;i<4;i++){this.c[i]=parseInt(this.c[i])}
  }
  this.ct=this.css.clip.top||this.c[0]||0; 
  this.cr=this.css.clip.right||this.c[1]||this.w||0
  this.cb=this.css.clip.bottom||this.c[2]||this.h||0; 
  this.cl=this.css.clip.left||this.c[3]||0
  this.obj = obj + "Object"; eval(this.obj + "=this")
  return this
}

//Moving object to **************
lib_obj.prototype.moveIt = function(x,y){
  this.x=x;this.y=y; this.css.left=x;this.css.top=y
}

lib_obj.prototype.moveItY = function(y){
  this.y=y; this.css.top=y
}

lib_obj.prototype.moveItX = function(x){
  this.x=x; this.css.left=x
}

//Moving object by ***************
lib_obj.prototype.moveBy = function(x,y){
  this.css.left=this.x+=x; this.css.top=this.y+=y
}

//Showing object ************
lib_obj.prototype.showIt = function(){this.css.visibility="visible"}

//Hiding object **********
lib_obj.prototype.hideIt = function(){this.css.visibility="hidden"}

//Changing backgroundcolor ***************
lib_obj.prototype.bg = function(color){ 
  if(bw.opera) this.css.background=color
  else if(bw.dom || bw.ie4) this.css.backgroundColor=color
  else if(bw.ns4) this.css.bgColor=color  
}

//Writing content to object ***
lib_obj.prototype.writeIt = function(text,startHTML,endHTML){
  if(bw.ns4){
    if(!startHTML){startHTML=""; endHTML=""}
    this.ref.open("text/html"); 
    this.ref.write(startHTML+text+endHTML); 
    this.ref.close()
  }else this.evnt.innerHTML=text
}
lib_obj.prototype.width = function() {
  return (this.w = this.evnt.offsetWidth||this.css.clip.width||this.ref.width||this.css.pixelWidth||0)
}
    node_normal_images_39860 = new Array();
    node_mouseover_images_39860 = new Array();

          node_normal_images_39860[0] = '/upload/839263_7024_1111592847203-abonnementenproducten_wit.gif';
          node_mouseover_images_39860[0] = '/upload/839120_7024_1111592621109-abonnementenproducten_grijs.gif';

          node_normal_images_39860[1] = '/upload/839264_7024_1111592887909-magazines_wit.gif';
          node_mouseover_images_39860[1] = '/upload/839123_7024_1111592724131-magazines_grijs.gif';

          node_normal_images_39860[2] = '/upload/839255_7024_1111592833753-kids_wit.gif';
          node_mouseover_images_39860[2] = '/upload/839119_7024_1111592592696-kids_grijs.gif';

          node_normal_images_39860[3] = '/upload/839468_7024_1111592954062-funcontact_wit.gif';
          node_mouseover_images_39860[3] = '/upload/839121_7024_1111592690357-funcontact_grijs.gif';

          node_normal_images_39860[4] = '/upload/839265_7024_1111592910619-breedband_wit.gif';
          node_mouseover_images_39860[4] = '/upload/839124_7024_1111592777381-breedband_grijs.gif';

          node_normal_images_39860[5] = '/upload/839282_7024_1111592931481-abonneeservice_wit.gif';
          node_mouseover_images_39860[5] = '/upload/839125_7024_1111592799721-abonneeservice_grijs.gif';

          node_normal_images_39860[6] = '/upload/839483_7024_1112786908609-shopping_wit.gif';
          node_mouseover_images_39860[6] = '/upload/839122_7024_1112786921755-shopping_grijs.gif';

function Navigation() {
  this.root     = new NavigationNode(0, null)
  this.currentNode  = null
  this.sub      = null
  this.imageDir   = ''
  this.divImage   = '/upload/839493_7024_1078311396210-44013_7024_1044963725066-green.gif' 
  this.trans      = '<img src="/e.gif" width="1" height="1">'
  this.left     = 0
  this.mainTimeout  = 200
  this.resetTimeout = 1200
  this.timeout    = null
  this.selected   = null
  this.lookup     = new Object()
  window.onload     = function() { nav.init() }
  return this
}

Navigation.prototype.init = function() {
  this.relsub = new lib_obj("relsub")
  this.sub = new lib_obj("sub", "relsub")
  for (var i=0; i<this.root.children.length; i++) {
    
      if (!(false && this.root.children[i].adultonly)) {  
      
      this.root.children[i].init()
    }  
  }
  this.sub.writeIt('<nobr><span class="subitem">&nbsp;</span></nobr>')
  this.sub.showIt()
  var node = this.lookup['node_1']
  node.mouseOver('', 'a_node_1')
}

Navigation.prototype.setLabel = function(path, label) {
  var node = this.getNode(path, this.root, 0)
  node.label = label
}

Navigation.prototype.setLink = function(path, link) {
  var node = this.getNode(path, this.root, 0)
  node.link = link
}


Navigation.prototype.setAdultOnly = function(path, adultonly) {
  var node = this.getNode(path, this.root, 0)
  node.adultonly = adultonly
}
//

Navigation.prototype.setSelected = function(path) {
  if (this.selected) {
    this.selected.setSelected(false)
  } 
  var node = this.getNode(path, this.root, 0)
  this.selected = node
  this.selected.setSelected(true)
}

Navigation.prototype.getNode = function(path, parent, i) {
  var index = path[i] - 1
  var nodes = parent.children
  if (index >= nodes.length || !nodes[index]) {
    var node = new NavigationNode(this, index, parent, i)
    nodes[index] = node
    this.lookup[node.id] = node
  }
  if (i < path.length-1) {
    return this.getNode(path, nodes[index], i+1)
  } else {
    return nodes[index]
  } 
}

Navigation.prototype.getMainHtml = function() {
  var code = ''
  code += '<img src="' + this.imageDir + '/upload/839498_7024_1136290721072-piBot.gif" alt="" border="0" height="18">'
  for (var i=0; i<this.root.children.length; i++) {
  
    if (!(false && this.root.children[i].adultonly)) {  
    
      code += this.root.children[i].getMainHtml()
    }  
  }
  return code
}

Navigation.prototype.getSubHtml = function() {
  var code = ''
  if (bw.mac) {
    code += '<div id="relsub">\n'
    code += '<img src="/e.gif" width="1" height="18"><br>\n'
    code += '<div id="sub"><spacer type="block" width="635" height="1"></div>'
    code += '</div>\n'
  } else if (bw.ns6) {
    code += '<div id="relsub">\n'
    code += '<img src="/e.gif" width="1" height="18"><br>\n'
    code += '<div id="sub"><spacer type="block" width="635" height="1"></div>'
    code += '</div>\n'
  } else {
    code += '<div id="relsub">\n'
    code += '<div id="sub"><spacer type="block" width="635" height="1"></div>'
    code += '</div>\n'
  }
  return code
} 

Navigation.prototype.update = function() {
  var t = this.timeout
  t.node[t.fun](t.source, t.sourceid)
  this.timeout = null
} 
  
Navigation.prototype.updateOut = function() {
  var t = this.timeout
  t.node[t.fun](t.source, t.sourceid)
  this.timeout = null
  var node = this.lookup['node_1']
  node.mouseOver('', 'a_node_1')
}  

Navigation.prototype.mouseOver = function(source, sourceid) {
  var node = this.lookup[sourceid.substr(2)]
  if (node != this.currentNode) {
    if (this.timeout) {
      clearTimeout(this.timeout.id)
    }
    if (node.level == 0) {
      this.timeout = {'id': setTimeout("nav.update()", this.mainTimeout),
              'node': node,
              'source': source,
              'sourceid': sourceid,
              'fun': 'mouseOver' }
    } else {
      this.timeout = null
      node.mouseOver(source, sourceid)
    }
  }
}

Navigation.prototype.mouseOut = function(source, sourceid) {
  var node = this.lookup[sourceid.substr(2)]
  node.mouseOut(source, sourceid)
  if (this.timeout) {
    clearTimeout(this.timeout.id)
  }
  this.timeout = {'id': setTimeout("nav.updateOut()", this.resetTimeout),
          'node': node,
          'source': source, 
          'sourceid': sourceid,
          'fun': 'reset' }
}

function NavigationNode(nav, index, parent, level) {
  this.nav    = nav
  this.index    = index
  this.image    = {'current': null, 'normal': null, 'hoover': null}
  this.id     = (parent ? parent.id + "_" + index : "node")
  this.parent   = parent
  this.level    = level
  this.left   = 0
  this.right    = 0
  this.label    = null
  this.link   = null
  
  this.adultonly   = null
  
  this.source   = null
  this.focus    = false
  this.selected   = false
  this.children   = new Array()
}

function getElt() {
  if (document.all) { // IE4+
    var elt = eval('document.all[\'' + getElt.arguments[getElt.arguments.length - 1] + '\']');
    // Extra code to skip the LAYER for Netscape 4 with the same name which causes elt to be an array
    if (elt.length) {
      return elt[0];
    } else {
      return elt;
    }

  } else if (document.layers) { //NS4
    var currentLayer = document.layers[getElt.arguments[0]];

    for (var i = 1; i < getElt.arguments.length && currentLayer; i++) {
       currentLayer = currentLayer.document.layers[getElt.arguments[i]];
    }

    return currentLayer;
  } else if (document.getElementById) { // NS6
    return document.getElementById(getElt.arguments[getElt.arguments.length - 1]);
  }
}

NavigationNode.prototype.init = function() {
  if (this.level == 0) {
    
    this.image.current = getElt(this.id)
    this.image.normal = new Image()
    
    this.image.normal.src = node_normal_images_39860[this.index]
    this.image.hoover = new Image()
    
    this.image.hoover.src = node_mouseover_images_39860[this.index]
    var sub = this.nav.sub
    sub.writeIt(this.getSubHtml())
    
    for (var i=1; i<this.children.length; i++) {
      var layer = new lib_obj(this.children[i-1].id, "relsub.document.sub")
      this.children[i].left =  + layer.w + this.children[i-1].left
    }
    sub.width()
    var root_mid = this.nav.left + Math.round(this.image.current.width/2)
    this.nav.left += this.image.current.width

    this.sub_left = root_mid - (Math.round(sub.w/2))
    if (this.sub_left < 0) {
      this.sub_left = 0
    } else if (this.sub_left + sub.w > 635) {
      this.sub_left = 635 - sub.w
    }
  }
}

NavigationNode.prototype.setSelected = function(selected) {
  var node = this
  node.selected = selected
  while (node.parent != null) {
    node.focus = selected
    node = node.parent
  }
  node.focus = selected
}

NavigationNode.prototype.getMainHtml = function() {
  var code = ''
  if (!this.selected) {
    code += this.getAnchorHtml(this.link, "sub")
  } 
  code += '<img src="' + this.nav.divImage + '" width="1" height="18" border="0">'

  code += '<img name="' + this.id + '" id="' + this.id + '"'
  code += ' src="' + this.nav.imageDir + (this.focus ? node_mouseover_images_39860[this.index] : node_normal_images_39860[this.index]) +'"'
  code += ' border="0" height="18">'
  
  if (!this.selected) {
    code += '</a>'
  } 
  return code
}


NavigationNode.prototype.getSubHtml = function() {
  var code = ''
  code += '<nobr>'
  first = true;
  for (var i=0; i<this.children.length; i++) {
    
      if (!(false && this.children[i].adultonly)) {  
      
      code += this.children[i].getSubItemHtml(first);
      first = false;
    }
  }
  code += '</nobr>'
  return code
}


NavigationNode.prototype.getSubItemHtml = function (first) {
  
  var code = ''
  code += '<span class="subitem" id="' + this.id + '">'
  if (!this.selected) {
    code += this.getAnchorHtml(this.link, "sub")
  } 
  if ((this.index > 0) && (!(first))) {
    code += '&#8226;'
  } else {
    code += '&nbsp;'
  }
  code += '&nbsp;&nbsp;' + this.label + '&nbsp;&nbsp;&nbsp;'
  if (!this.selected) {
    code += '</a>'
  }
  code += '</span>'

  return code
}

NavigationNode.prototype.getAnchorHtml = function(link, className, hasEvents) {
  var code = ''
  code += '<a'
  if (className) {
    code += ' class="' + className + '"'
  }
  if (this.link) {
    code += ' href="' + link + '" target="_top" '
  } else {
    code += ' href=":;" onclick="return false;"'
  }
  if (typeof hasEvents == 'undefined' || hasEvents) {
    code += ' onmouseover="nav.mouseOver(this, \'a_' + this.id + '\');" onmouseout="nav.mouseOut(this, \'a_' + this.id + '\');">'
  } else {
    code += '>'
  } 
  return code
}

NavigationNode.prototype.mouseOver = function(source, sourceid) {
  this.source = source
  if (this.level == 0) {
    if (this.nav.currentNode) {
      if (this.nav.currentNode.level == 0) {
        this.nav.currentNode.setImage("normal")
      } else if (this.nav.currentNode.level == 1) {
        this.nav.currentNode.parent.setImage("normal")
      } 
    }
    this.setImage("hoover")
    this.nav.sub.moveItX(this.sub_left)
    this.nav.sub.writeIt(this.getSubHtml())
  } else if (this.level == 1) {
    if (this.nav.currentNode) {
      if (this.nav.currentNode.level == 1) {
        this.nav.currentNode.setColor("")      
      } 
    }
    this.setColor("")
  } else {
    this.setBgColor('')
  }
  this.nav.currentNode = this
}

NavigationNode.prototype.reset = function () {
  if (this.level == 0) {
    this.nav.sub.writeIt('<nobr><span class="subitem">&nbsp;</span></nobr>')
    this.setImage("normal")
  } else if (this.level == 1) {
    this.nav.sub.writeIt('<nobr><span class="subitem">&nbsp;</span></nobr>')
    this.parent.setImage("normal")
  } 
  this.nav.currentNode = null  
}

NavigationNode.prototype.mouseOut = function(source, sourceid) {
  if (this.level == 2) {
    this.setBgColor("")
  }
} 

NavigationNode.prototype.setImage = function(type) {
  this.image.current.src = this.image[type].src
}

NavigationNode.prototype.setColor = function(color) {
  if (bw.dom || bw.ie4) {
    this.source.style.color=color
  } else if (bw.ns4) {
//    source.color=color
  }
}

NavigationNode.prototype.setBgColor = function(color) {
  var item = new lib_obj(this.id, "relsub.document.dropdown.document.i_" + this.id)
  item.bg(color)
}