/*
Author: Tim Samshuijzen
Copyright 2008 Rockingstone
*/

var rsCommon = {
  typeOf: function(value) {
    var s = typeof value;
    if(s === 'object') {
      if(value) {
        if(typeof value.length === 'number' &&
           !(value.propertyIsEnumerable('length')) &&
           typeof value.splice === 'function') {
          s = 'array';
        }
      } else {
        s = 'null';
      }
    }
    return s;
  }, 
  isEmpty: function(o) {
    if((o === null) || (typeof o === 'undefined')) {
      return true;
    }
    return false;
  },
  trim: function(s) {
    return s.replace(/^\s+|\s+$/g, "");
  },
  escapeHTML: function(str) {
    var res = str.replace(/&/,"&");
    res = res.replace(/</,"&lt;");
    res = res.replace(/>/,"&gt;");
    res = res.replace(/\r\n/,"<br>");
    res = res.replace(/\n/,"<br>");
    res = res.replace(/\r/,"<br>");
    return res;
  },
  int: function(aValue, aDefault) {
    //var res = (aValue - 0);
    var res = Number(aValue);
    if(isNaN(res)) {
      if(arguments.length >= 2) {
        res = aDefault;
        if(isNaN(res)) {
          res = 0;
        }
      } else {
        res = 0;
      }
    }
    return res;
  },
  getClientWidth: function() {
    var res = 800;
    if(window.innerWidth) {
      res = window.innerWidth;
    } else if(document.documentElement && document.documentElement.clientWidth) {
      res = document.documentElement.clientWidth;
    } else if(document.body) {
      res = document.body.clientWidth;
    }
    return res;
  },
  getClientHeight: function() {
    var res = 600;
    if(window.innerHeight) {
      res = window.innerHeight;
    } else if(document.documentElement && document.documentElement.clientHeight) {
      res = document.documentElement.clientHeight;
    } else if(document.body) {
      res = document.body.clientHeight;
    }
    return res;
  },
  getBodyHeight: function() {
    var res = 600;
    if(window.innerHeight) {
      res = window.innerHeight;
    } else if(document.documentElement && document.documentElement.clientHeight) {
      res = document.documentElement.clientHeight;
      if(document.documentElement.scrollHeight && (document.documentElement.scrollHeight > document.documentElement.clientHeight)) {
        res = document.documentElement.scrollHeight;
      }
    } else if(document.body) {
      res = document.body.clientHeight;
      if(document.body.scrollHeight && (document.body.scrollHeight > document.body.clientHeight)) {
        res = document.documentElement.scrollHeight;
      }
    }
    return res;
  },
  scrollToTop: function() {
    if(document.body && document.body.scrollTop) {
      document.body.scrollTop = 0;
    } else if(document.documentElement && document.documentElement.scrollTop) {
      document.documentElement.scrollTop = 0;
    }
  }
};

var rsElements = {
  get: function(element) {
    if((typeof element == "string") || (typeof element == "number")) {
      return document.getElementById(element);
    } else {
      return element;
    }
  },
  setStyles: function(element, styles) {
    element = rsElements.get(element);
    for(var i = 1, length = arguments.length; i < length; i++) {
      var arg = arguments[i];
      for(var property in arg) if(property !== null) {
        element.style[property] = arg[property];
      }
    }
    return element;
  },
  purgeHandlers: function(element) {
    element = rsElements.get(element);
    var a = element.attributes, i, l, n;
    if(a) {
      l = a.length;
      for(i = 0; i < l; i += 1) {
        n = a[i].name;
        if(typeof element[n] === 'function') {
          element[n] = null;
        }
      }
    }
    a = element.childNodes;
    if(a) {
      l = a.length;
      for(i = 0; i < l; i += 1) {
        rsElements.purgeHandlers(element.childNodes[i]);
      }
    }
  },
  setContent: function(element, content) {
    var el = rsElements.get(element);
    if(1 === 0) {
      var a = el.childNodes;
      if(a) {
        l = a.length;
        for(i = 0; i < l; i += 1) {
          rsElements.purgeHandlers(el.childNodes[i]);
        }
      }
    }
    el.innerHTML = content;
    return el;
  },
  setTextContent: function(element, textContent) {
    var el = rsElements.get(element);
    if(1 === 0) {
      var a = el.childNodes;
      if(a) {
        l = a.length;
        for(i = 0; i < l; i += 1) {
          rsElements.purgeHandlers(el.childNodes[i]);
        }
      }
    }
    while(el.firstChild) {
      el.removeChild(el.childNodes[0]);
    }
    el.appendChild(document.createTextNode(textContent));
    return el;
  },
  append: function(aContainerDOMID, aNewDOMID, aArguments) {
    var args = aArguments || {};
    var res = document.createElement('div');
    var con = rsElements.get(aContainerDOMID);
    if(con) {
      con.appendChild(res);
    } else {
      document.body.appendChild(res);
    }
    if(arguments.length >= 2) {
      res.id = aNewDOMID;
    }
    if((typeof args.content == 'string') && (args.content !== '')) {
      res.innerHTML = args.content;
    }
    if((typeof args.textContent == 'string') && (args.textContent !== '')) {
      res.nodeValue = args.textContent;
    }
    return res;
  },
  remove: function(element) {
    var el = rsElements.get(element);
    if(1 === 0) {
      rsElements.purgeHandlers(el);
    }
    el.parentNode.removeChild(el);
    return el;
  }
};

var rsSimpleEvents = {
  AddEvent: function(element, eventname, handler) {
    if(element.addEventListener) {
      element.addEventListener(eventname, handler, false);
    } else if(element.attachEvent) {
      element.attachEvent("on" + eventname, handler);
    } else {
      element["on" + eventName] = handler;
    }
  }
}

var rsEvents = function() {
  var handlers = [];
  var lastHandlerID = 0;
  var enableEvents = true;
  var that = {
    indexOfHandler: function(aHandler) {
      var hidx = -1;
      for(var i = 0, length = handlers.length; i < length; i++) {
        var hob = handlers[i];
        if((hob.handler == aHandler) || (hob.DOMHandler == aHandler)) {
          hidx = i;
          break;
        }
      }
      return hidx;
    },
    indexOfHandlerID: function(aHandlerID) {
      var hidx = -1;
      for(var i = 0, length = handlers.length; i < length; i++) {
        var hob = handlers[i];
        if(hob.handlerID == aHandlerID) {
          hidx = i;
          break;
        }
      }
      return hidx;
    },
    add: function(aNode, aType, aHandler, aArguments) {
      var node = rsElements.get(aNode);
      var domh = aHandler;
      var args = aArguments || {};
      lastHandlerID++;
      var lHandlerID = lastHandlerID;
      if(args.scope) {
        if(args.once) {
          domh = function(e) {
            var ev = that.getEvent(e);
            if(enableEvents) {
              rsEvents.removeByHandlerID(lHandlerID);
              return aHandler.apply(args.scope, ev);
            } else {
              return false;
            }
          };
        } else {
          domh = function(e) {
            var ev = that.getEvent(e);
            if(enableEvents) {
              return aHandler.apply(args.scope, ev); 
            } else {
              return false;
            }
          };
        }
      } else if(args.once) {
        domh = function(e) {
          var ev = that.getEvent(e);
          if(EnableEvents) {
            rsEvents.removeByHandlerID(lHandlerID);
            return aHandler(ev);
          } else {
            return false;
          }
        };
      } else {
        domh = function(e) {
          var ev = that.getEvent(e);
          if(enableEvents) {
            return aHandler(ev);
          } else {
            return false;
          }
        };
      }
      handlers[handlers.length] = {
        handler: aHandler,
        DOMHandler: domh,
        node: node,
        type: aType,
        handlerID: lHandlerID
      };
      if(node.addEventListener) {
        node.addEventListener(aType, domh, false);
      } else if(node.attachEvent) {
        node.attachEvent('on' + aType, domh);
      } else {
        node['on' + aType] = domh;
      }
      return domh;
    },
    remove: function(aNode, aType, aHandler) {
      var node = rsElements.get(aNode);
      var domh = aHandler;
      var eidx = that.indexOfHandler(domh);
      if(eidx >= 0) {
        domh = handlers[eidx].DOMHandler;
        handlers.splice(eidx, 1);
      }
      if(node.removeEventListener) {
        node.removeEventListener(aType, domh, false);
      } else if(node.detachEvent) {
        node.detachEvent('on' + aType, domh);
      } else {
        node['on' + aType] = '';
      }
    },
    removeByHandlerID: function(aHandlerID) {
      var eidx = that.indexOfHandlerID(aHandlerID);
      if(eidx >= 0) {
        var hob = handlers[eidx];
        handlers.splice(eidx, 1);
        if(hob.node.removeEventListener) {
          hob.node.removeEventListener(hob.type, hob.DOMHandler, false);
        } else if(hob.node.detachEvent) {
          hob.node.detachEvent('on' + hob.type, hob.DOMHandler);
        }
      }
    },
    removeByHandler: function(aHandler) {
      var eidx = that.indexOfHandler(aHandler);
      if(eidx >= 0) {
        var hob = handlers[eidx];
        handlers.splice(eidx, 1);
        if(hob.node.removeEventListener) {
          hob.node.removeEventListener(hob.type, hob.DOMHandler, false);
        } else if(hob.node.detachEvent) {
          hob.node.detachEvent('on' + hob.type, hob.DOMHandler);
        }
      }
    },
    getEvent: function(e) {
      return e || window.event;
    },
    getMousePosition: function(e) {
      var pos = {x: 0, y: 0};
      if(e.pageX || e.pageY) {
        pos.x = e.pageX;
        pos.y = e.pageY;
      } else if(e.clientX || e.clientY) {
        pos.x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
        pos.y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
      }
      return pos;
    }
  };
  return that;
}();

var rsAjax = {
  createXMLHTTPObject: function() {
    var xmlhttp = false;
    if(window.ActiveXObject) {
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } else if(window.XMLHttpRequest) {
      xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
  },
  sendRequest: function(url,callback,onerror) {
    var req = this.createXMLHTTPObject();
    if(!req) {
      return;
    }
    var method = "GET";
    var postData = null;
    req.open(method,url,true);
    req.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT");
    if(method == "POST") {
      postData = 'dummy';
      req.setRequestHeader('Content-type','application/x-www-form-urlencoded');
    }
    req.onreadystatechange = function () {
      if(req.readyState != 4) {
        return;
      }
      if(req.status != 200 && req.status != 304) {
        if(onerror) {
          onerror(req);
        }
        //alert('HTTP error ' + req.status + ' - url.length=' + url.length + ' - ' + url);
        return;
      }
      callback(req);
    };
    if(req.readyState == 4) {
      return;
    }
    req.send(postData);
    return req;
  },
  evalReply: function(callpage) {
    this.sendRequest(callpage, function(req){ eval(req.responseText); });
  },
  alertReply: function(callpage) {
    this.sendRequest(callpage, function(req){ alert(req.responseText); });
  }
};

function TStringCat() {
  var sp;
  var ep = [];
  var l = 0;
  var accum = '';
  this.push = function(what) {
    accum += what;
    if(accum.length > 2800) {
      if(typeof(sp) == 'undefined') {
        ep = [];
        sp = ep;
      } else {
        var oep = ep;
        ep = [];
        oep[1] = ep;
      }
      ep[0]=accum;
      accum='';
      ++l;
    }
  };
  this.toString = function() {
    if(accum !== '') {
      if(!sp) {
        ep = [];
        sp = ep;
      } else {
        var oep = ep;
        ep = [];
        oep[1] = ep;
      }
      ep[0] = accum;
      accum = '';
      ++l;
    }
    if(l === 0) {
      return;
    }
    //if(l === 0) return accum;
    ep[0] += accum;
    while(l > 1) {
      var ptr = sp;
      var nsp = [];
      var nep = nsp;
      var nl = 0;
      while(typeof(ptr) != 'undefined') {
        if(typeof(nep[0]) == 'undefined') {
          nep[0] = ptr[0];
          ++nl;
        } else {
          if(typeof(ptr[0]) != 'undefined') {
            nep[0] += ptr[0];
          }
          nep[1] = [];
          nep = nep[1];
        }
        ptr=ptr[1];
      }
      sp = nsp;
      ep = nep;
      l = nl;
    }
    return sp[0];
  };
}

var g_searchFormCategories = [
  { id: 'cat_boomgroepencategorie',
    txt: 'boomgroep en categorie' },
  { id: 'cat_groeiplaatskenmerken',
    txt: 'groeiplaatskenmerken' },
  { id: 'cat_boomkenmerken_kroonkenmerken',
    txt: 'kroonkenmerken' },
  { id: 'cat_boomkenmerken_bladkenmerken',
    txt: 'bladkenmerken' },
  { id: 'cat_boomkenmerken_bloemkenmerken',
    txt: 'bloemkenmerken' },
  { id: 'cat_boomkenmerken_vruchtkenmerken',
    txt: 'vruchtkenmerken' },
  { id: 'cat_boomkenmerken_wortelkenmerk',
    txt: 'wortelkenmerk' },
  { id: 'cat_boomkenmerken_weerstandtegenaantastingen',
    txt: 'weerstand tegen aantastingen' }
];

var g_selectedSearchFormCategory = 0;
var nextAjaxSearchRequest = '';

var g_searchFormFields = [
  { fldname: 's_genus',
    txtname: 'Genus' },
  { fldname: 's_familie',
    txtname: 'Familie' },
  { fldname: 's_beschikbaarheid[]',
    txtname: 'Beschikbaarheid' },
  { fldname: 's_voorkeursbomen[]',
    txtname: '300 voorkeursbomen' },
  { fldname: 's_karakter[]',
    txtname: 'Karakter' },
  { fldname: 's_verschijningsvorm[]',
    txtname: 'Verschijningsvorm' },
  { fldname: 's_functie[]',
    txtname: 'Functie' },
  { fldname: 's_geslacht[]',
    txtname: 'Geslacht' },
/*
  { fldname: 's_locatievoorkeurstoepassing[]',
    txtname: 'Locatie (voorkeurstoepassing)' },
*/
  { fldname: 's_locatieruimetoepassing[]',
    txtname: 'Toepassing' },
  { fldname: 's_grondsoort[]',
    txtname: 'Grondsoort' },
  { fldname: 's_voedselrijkdom[]',
    txtname: 'Voedselrijkdom' },
  { fldname: 's_zuurgraad[]',
    txtname: 'Zuurgraad' },
  { fldname: 's_vochtgehalte[]',
    txtname: 'Vochtgehalte' },
  { fldname: 's_zonlicht[]',
    txtname: 'Zonlicht' },
/*
  { fldname: 's_temperatuurzone[]',
    txtname: 'Temperatuurzone ºC' },
*/
  { fldname: 's_groeiruimtebovengronds[]',
    txtname: 'Groeiruimte bovengronds' },
  { fldname: 's_verharding[]',
    txtname: 'Verharding' },
  { fldname: 's_groeiplaatsomstandigheden[]',
    txtname: 'Bijzondere groeiplaatsomstandigheden' },
  { fldname: 's_hoogte10jaar[]',
    txtname: 'Hoogte 10 jaar' },
  { fldname: 's_hoogtedoelbeeld[]',
    txtname: 'Hoogte doelbeeld' },
  { fldname: 's_breedtedoelbeeld[]',
    txtname: 'Breedte doelbeeld' },
  { fldname: 's_vormdoelbeeld[]',
    txtname: 'Vorm doelbeeld' },
  { fldname: 's_kroonstructuur[]',
    txtname: 'Kroonstructuur' },
  { fldname: 's_wintergroen[]',
    txtname: 'Wintergroen' },
  { fldname: 's_bladtextuur[]',
    txtname: 'Bladtextuur' },
  { fldname: 's_bladkleurzomer[]',
    txtname: 'Bladkleur zomer' },
  { fldname: 's_opvallendeherfstkleur[]',
    txtname: 'Opvallende herfstkleur' },
  { fldname: 's_bladkleurherfst[]',
    txtname: 'Bladkleur herfst' },
  { fldname: 's_bloeitijd[]',
    txtname: 'Bloeitijd' },
  { fldname: 's_opvallendebloei[]',
    txtname: 'Opvallende bloei' },
  { fldname: 's_bloemkleur[]',
    txtname: 'Bloemkleur' },
  { fldname: 's_bloemvorm[]',
    txtname: 'Bloemvorm' },
  { fldname: 's_opvallendevruchten[]',
    txtname: 'Opvallende vruchten' },
  { fldname: 's_vruchtkleur[]',
    txtname: 'Vruchtkleur' },
  { fldname: 's_vruchtgrootte[]',
    txtname: 'Vruchtgrootte' },
  { fldname: 's_zachtevruchtenofbessen[]',
    txtname: 'Zachte vruchten of bessen' },
  { fldname: 's_wortelkenmerk[]',
    txtname: 'Wortelkenmerk' },
  { fldname: 's_bastwoekerziekte[]',
    txtname: 'Bastwoekerziekte, bloedingsziekte en iepenziekte' },
  { fldname: 's_roest[]',
    txtname: 'Roest' },
  { fldname: 's_bladvlekkenziekte[]',
    txtname: 'Bladvlekkenziekte' },
  { fldname: 's_kanker[]',
    txtname: 'Kanker' },
  { fldname: 's_schurft[]',
    txtname: 'Schurft' },
  { fldname: 's_bacterievuur[]',
    txtname: 'Bacterievuur' },
  { fldname: 's_bastkanker[]',
    txtname: 'Bastkanker bacterie' },
  { fldname: 's_bladluizen[]',
    txtname: 'Bladluizen' }
];


function initSearchForm() {
  rsElements.setStyles('searchformcontainer', {
    position: 'relative',
    left: '0',
    top: '0'
  });
  var lc = g_searchFormCategories.length;
  var li = 0;
  while(li <= (lc - 1)) {
    rsElements.setStyles(g_searchFormCategories[li].id, {
      display: 'none',
      position: 'relative',
      left: '0',
      top: '0'
    });
    li++;
  }

  var el = null;
  var clc = 0;
  var cli = 0;
  var cel = null;
  var cclc = 0;
  var ccli = 0;
  var ccel = null;
  var hinttxt = '';

  li = 0;
  while(li <= (lc - 1)) {
    el = rsElements.get(g_searchFormCategories[li].id);
    if(el) {
      if(el.childNodes) {
        clc = el.childNodes.length;
        cli = 0;
        while(cli <= (clc - 1)) {
          cel = el.childNodes[cli];
          if((cel) && (cel.className == 'formrow')) {
            if(cel.childNodes) {
              cclc = cel.childNodes.length;
              ccli = 0;
              while(ccli <= (cclc - 1)) {
                ccel = cel.childNodes[ccli];
                if((ccel) && (ccel.className == 'formhint')) {
                  hinttxt = ccel.innerHTML;
                  hinttxt = hinttxt.replace(/^\s+|\s+$/g, '');
                  if(hinttxt != '') {
                    ccel.innerHTML = 
                      '<div style="position: relative; top: 0; left: 0; width: 48px; height: 30px;" ' + 
                        ' onMouseOver="{' +
                           'document.getElementById(\'hint_' + li + '_' + cli + '\').style[\'display\'] = \'block\'; ' +
                          ' }" ' + 
                        ' onMouseOut="{' +
                           'document.getElementById(\'hint_' + li + '_' + cli + '\').style[\'display\'] = \'none\'; ' +
                        ' }" ' + 
                        '>' +
                        '<div id="hint_' + li + '_' + cli + '" style="position: absolute; top: -20px; left: 24px; width: 300px; height: auto; z-index: 1; border: 3px solid #008000; padding: 4px; background-color: #74DB74; display: none;">' +
                          hinttxt +
                        '</div>' +
                        '<img src="./img/info.png" border="0" />' +
                      '</div>';
                    ccel.style['visibility'] = 'visible';
                  }
                }
                ccli++;
              }
            }
          }
          cli++;
        }
      }
    }
    li++;
  }

  var selcatbuttonscontent = ''
  selcatbuttonscontent = selcatbuttonscontent +
    '<div id="searchformselcatcontainer" style="float: left;">';
  li = 0;
  while(li <= (lc - 1)) {
    selcatbuttonscontent = selcatbuttonscontent +
      '<div id="selcatbutton_' + g_searchFormCategories[li].id + '"' +
        ' style="width: 300px; padding: 4px; cursor: pointer;"' +
        ' onclick="{g_selectedSearchFormCategory = ' + li + '; updateSearchFormCategory();}" ' + 
        ' onMouseOver="{' +
          'document.getElementById(\'selcatbutton_' + g_searchFormCategories[li].id + '\').style[\'backgroundColor\'] = \'#94FB94\'; ' +
        ' }" ' + 
        ' onMouseOut="{' +
          'document.getElementById(\'selcatbutton_' + g_searchFormCategories[li].id + '\').style[\'backgroundColor\'] = (g_selectedSearchFormCategory == ' + li + ' ? \'#008000\' : \'#74DB74\'); ' +
        ' }" ' + 
        '>' + 
        g_searchFormCategories[li].txt + 
      '</div>';
    li++;
  }
  selcatbuttonscontent = selcatbuttonscontent +
    '</div>';
  selcatbuttonscontent = selcatbuttonscontent +
    '<div id="searchforminfoboxcontainer" style="float: left; margin-left: 40px; padding: 4px; width: 298px; height: 184px; overflow: hidden; background-color: #74DB74;">' +
      '&nbsp;' +
    '</div>';
  selcatbuttonscontent = selcatbuttonscontent +
    '<br clear="all"/>&nbsp;';
  rsElements.get('searchformheader').innerHTML = selcatbuttonscontent;

  lc = g_searchFormFields.length;
  li = 0;
  while(li <= (lc - 1)) {
    document.forms['treeform'][g_searchFormFields[li].fldname].onchange = function() { updateSearchFormInfoBox('change'); };
    li++;
  }

  updateSearchFormCategory();
  updateSearchFormInfoBox('init');
}

function updateSearchFormCategory() {
  var lc = g_searchFormCategories.length;
  var li = 0;
  while(li <= (lc - 1)) {
    if(li == g_selectedSearchFormCategory) {
      rsElements.setStyles(g_searchFormCategories[li].id, {
        display: 'block'
//      visibility: 'visible'
      });
    } else {
      rsElements.setStyles(g_searchFormCategories[li].id, {
        display: 'none'
//      visibility: 'hidden'
      });
    }
    li++;
  }
  li = 0;
  while(li <= (lc - 1)) {
    if(li == g_selectedSearchFormCategory) {
      rsElements.setStyles('selcatbutton_' + g_searchFormCategories[li].id, {
        backgroundColor: '#008000'
      });
    } else {
      rsElements.setStyles('selcatbutton_' + g_searchFormCategories[li].id, {
        backgroundColor: '#74DB74'
      });
    }
    li++;
  }
}


function updateSearchFormInfoBox(updatetype) {
  var lc = g_searchFormFields.length;
  var li = 0;
  var frmel = null;
  var frmval = '';
  var criteria = '';
  var hrefcriteria = '';
  var oplc = 0;
  var opli = 0;
  if((updatetype == 'init') || (updatetype == 'change')) {
    while(li <= (lc - 1)) {
      frmel = document.forms['treeform'][g_searchFormFields[li].fldname];
      if(frmel) {
        frmval = '';
        if(g_searchFormFields[li].fldname.indexOf('[]') >= 0) {
          oplc = frmel.options.length;
          opli = 0;
          while(opli <= (oplc - 1)) {
            if(frmel.options[opli].selected) {
              if(frmel.options[opli].value != '') {
                if(frmval != '') {
                  frmval += ', ';
                }
                frmval += frmel.options[opli].value;
                if(hrefcriteria != '') {
                  hrefcriteria += '&';
                }
                hrefcriteria += g_searchFormFields[li].fldname + '=' + encodeURIComponent(frmel.options[opli].value);
              }
            }
            opli++;
          }
        } else {
          frmval = frmel.value;
          if(frmval != '') {
            if(hrefcriteria != '') {
              hrefcriteria += '&';
            }
            hrefcriteria += g_searchFormFields[li].fldname + '=' + encodeURIComponent(frmval);
          }
        }
        if(frmval != '') {
          if(criteria != '') {
            criteria += '<br />\n'
          }
          criteria += '<strong>' + g_searchFormFields[li].txtname + '</strong>: ' + rsCommon.escapeHTML(frmval);
        }
      }
      li++;
    }
  }
  if(criteria != '') {
    rsElements.get('searchforminfoboxcontainer').innerHTML = 
      '<div style="margin: 0: padding: 0; width: 298px; height: 142px; overflow: hidden; overflow: scroll;">' +
      '<span style="color: \'#ffffff\';">geselecteerde criteria:</span><br />\n' +
      criteria +
      '</div>' +
      '<br />\n' +
      '<span id="ajaxresultbox"></span>&nbsp;<button onclick="document.forms[\'treeform\'].submit();">toon bomen</button>\n';
  } else {
    rsElements.get('searchforminfoboxcontainer').innerHTML = 
      '<br />\n' +
      'Selecteer de gewenste criteria m.b.v. het zoekformulier.<br />\n' +
      '<br />\n' +
      'U heeft nog geen zoekcriteria opgegeven\n' +
      '<span id="ajaxresultbox"></span>\n';
  }
  if(updatetype == 'change') {
    if(hrefcriteria != '') {
      var sReqURL = 'ajaxsearch.php?' + hrefcriteria;
      if(rsAjax.ajaxBusy) {
        nextAjaxSearchRequest = sReqURL;
      } else {
        rsAjax.sendRequest(sReqURL, showAjaxSearchInfo);
      }
    }
  }
}

function showAjaxSearchInfo(req) {
  var resp = eval('(' + req.responseText + ')');
  var el = null;
  if(resp.numberResults !== '') {
    el = document.getElementById('ajaxresultbox');
    if(el) {
      el.innerHTML = '<strong>aantal bomen: ' + resp.numberResults + '</strong>';
    }
  } else {
    el = document.getElementById('ajaxresultbox');
    if(el) {
      el.innerHTML = '';
    }
  }
  if(nextAjaxSearchRequest !== '') {
    var sReqURL = nextAjaxSearchRequest;
    nextAjaxSearchRequest = '';
    rsAjax.sendRequest(sReqURL, showAjaxSearchInfo);
  }
}


var g_detailCategories = [
  { id: 'cat_boomgroepencategorie',
    txt: 'boomgroep en categorie' },
  { id: 'cat_groeiplaatskenmerken',
    txt: 'groeiplaatskenmerken' },
  { id: 'cat_boomkenmerken_kroonkenmerken',
    txt: 'kroonkenmerken' },
  { id: 'cat_boomkenmerken_bladkenmerken',
    txt: 'bladkenmerken' },
  { id: 'cat_boomkenmerken_bloemkenmerken',
    txt: 'bloemkenmerken' },
  { id: 'cat_boomkenmerken_vruchtkenmerken',
    txt: 'vruchtkenmerken' },
  { id: 'cat_boomkenmerken_wortelkenmerk',
    txt: 'wortelkenmerk' },
  { id: 'cat_boomkenmerken_weerstandtegenaantastingen',
    txt: 'weerstand tegen aantastingen' },
  { id: 'cat_extrainformatie',
    txt: 'extra informatie' },
  { id: 'cat_afbeeldingen',
    txt: 'afbeeldingen' }
];

var g_selectedDetailCategory = 0;

function initDetailPage() {
  rsElements.setStyles('treedetailcontainer', {
    position: 'relative',
    left: '0',
    top: '0'
  });
  var lc = g_detailCategories.length;
  var li = 0;
  while(li <= (lc - 1)) {
    rsElements.setStyles(g_detailCategories[li].id, {
      display: 'none',
      position: 'relative',
      left: '0',
      top: '0'
    });
    li++;
  }

  var selcatbuttonscontent = ''
  selcatbuttonscontent = selcatbuttonscontent +
    '<div id="detailselcatcontainer" style="float: left;">';
  li = 0;
  while(li <= (lc - 1)) {
    selcatbuttonscontent = selcatbuttonscontent +
      '<div id="selcatbutton_' + g_detailCategories[li].id + '"' +
        ' style="width: 300px; padding: 4px; cursor: pointer;"' +
        ' onclick="{g_selectedDetailCategory = ' + li + '; updateDetailCategory();}" ' + 
        ' onMouseOver="{' +
          'document.getElementById(\'selcatbutton_' + g_detailCategories[li].id + '\').style[\'backgroundColor\'] = \'#94FB94\'; ' +
        ' }" ' + 
        ' onMouseOut="{' +
          'document.getElementById(\'selcatbutton_' + g_detailCategories[li].id + '\').style[\'backgroundColor\'] = (g_selectedDetailCategory == ' + li + ' ? \'#008000\' : \'#74DB74\'); ' +
        ' }" ' + 
        '>' + 
        g_detailCategories[li].txt + 
      '</div>';
    li++;
  }
  selcatbuttonscontent = selcatbuttonscontent +
    '</div>';

  var imgsrc = '';
  var imgel = rsElements.get('treedetailfullimage_img');
  if(imgel) {
    imgsrc = imgel.src;
    //image.php?img=boom23_1.jpg&amp;maxwidth=600&amp;maxheight=600
    if(imgsrc != '') {
      var ipos1 = imgsrc.indexOf('=');
      var ipos2 = imgsrc.indexOf('&');
      if((ipos1 >= 1) && (ipos2 >= 1)) {
        imgsrc = imgsrc.substring(ipos1 + 1, ipos2);
      }
    }
  }
  selcatbuttonscontent = selcatbuttonscontent +
    '<div id="detailinfoboxcontainer" style="float: left; margin-left: 40px; padding: 4px; width: 298px; height: 184px; overflow: hidden; background-color: #74DB74; background-color: none;">';
  if(imgsrc != '') {
    li = (lc - 1);
    selcatbuttonscontent = selcatbuttonscontent +
      '<img src="image.php?img=' + imgsrc + '&amp;maxwidth=200&amp;maxheight=176" border="0" style="cursor: pointer;" onclick="{g_selectedDetailCategory = ' + li + '; updateDetailCategory();}" />';
  } else {
    selcatbuttonscontent = selcatbuttonscontent +
      '&nbsp;';
  }
  selcatbuttonscontent = selcatbuttonscontent +
    '</div>';
  selcatbuttonscontent = selcatbuttonscontent +
    '<br clear="all"/>&nbsp;';

  rsElements.get('detailheader').innerHTML = selcatbuttonscontent;
  updateDetailCategory();
}

function updateDetailCategory() {
  var lc = g_detailCategories.length;
  var li = 0;
  while(li <= (lc - 1)) {
    if(li == g_selectedDetailCategory) {
      rsElements.setStyles(g_detailCategories[li].id, {
        display: 'block'
//      visibility: 'visible'
      });
    } else {
      rsElements.setStyles(g_detailCategories[li].id, {
        display: 'none'
//      visibility: 'hidden'
      });
    }
    li++;
  }
  li = 0;
  while(li <= (lc - 1)) {
    if(li == g_selectedDetailCategory) {
      rsElements.setStyles('selcatbutton_' + g_detailCategories[li].id, {
        backgroundColor: '#008000'
      });
    } else {
      rsElements.setStyles('selcatbutton_' + g_detailCategories[li].id, {
        backgroundColor: '#74DB74'
      });
    }
    li++;
  }
}