
/*****************  

  (c) 2004 Q42 B.V.
  
  The contents of this file, partially or in whole, may not be reproduced 
  without prior written permission by Q42 B.V.

*****************/

var appname = navigator.appName.toLowerCase();
var browserVersion = navigator.appVersion.toLowerCase();
var browserOS = (browserVersion.indexOf("win") != -1)?"win":"other";
var ie = false;
var nn = false;
if (appname == "netscape") nn = true;
if (appname == "microsoft internet explorer") ie = true;
var ie55 = (browserVersion.indexOf("msie 5.5") != -1);
var ie6 = (browserVersion.indexOf("msie 6") != -1);

var main = {
  doLoad : function(type, tijdloos, query) 
  {
    this.initCounters();
    var el = document.getElementById("verhalencontainer");            

    this.type = type;
    spif.styleMorpher.setDuration(800);
    spif.styleMorpher.setPropProfile("all");
    spif.styleMorpher.setRequireMorph(true);    
    var vc = document.getElementById("verhalencontainer");
    var oc = document.getElementById("objectencontainer");
    var zc = document.getElementById("zoekresultaatcontainer");
    
    this.hovers = 
    {
      "verhalen": { "enabled": true, "elements": vc? vc.getElementsByTagName("A") : [] },
      "objecten": { "enabled": true, "elements":  oc? oc.getElementsByTagName("A") : [] },
      "zoekresultaat": { "enabled": (query!=''), "elements":  zc? zc.getElementsByTagName("A") : [] }
    }
    
    if (!this.hovers.verhalen.elements) this.hovers.verhalen.elements = [];
    if (!this.hovers.objecten.elements) this.hovers.objecten.elements = [];
    
    var els = false;
    var scroll = false;

    switch(type) {
      case "verhaal":
        if (query == '') this.hovers.verhalen.enabled = false;
        var scroll = "verhalen";
        var els = this.hovers.verhalen.elements;
        break;
      case "object":
        var els = this.hovers.objecten.elements;
        var scroll = "objecten";

        // disable next object if this is the last one
        if (els.length && (els[els.length-1].className.indexOf("hot")!=-1)) {
          document.getElementById("volgendobject").style.display = "none";
          document.getElementById("anderobject").style.margin = "10 0 0 133";
        }

        break;
      case "thema":
        if (tijdloos) this.hovers.verhalen.enabled = false;
        else this.hovers.objecten.enabled = false;
        break;
    }

    if (query != '') {
      var scroll = "zoekresultaat";
      var els = this.hovers.zoekresultaat.elements;
    }

    // if we need to preselect a hover-series, move it to the appriopriate item        
    if (els) {
      var index = -1;      
      for (var i=0; i<els.length; i++) {        
        // if we just set our index, get the id of the next object
        if (index != -1) 
        {
          this.nextObjUrl = els[i].getAttribute("href");
          break;
        }
        if (els[i].className.indexOf("hot")!=-1) {
          index = i + (((type!="verhaal") || (query!=''))? 1 : 0);          
        }
      }
      this.doScroll(scroll, true, index);
    }

    // and start the hovering
    this.hover();
  },
  setState : function(elid, className) 
  {
    spif.styleMorpher.storeState(document.body);    
    
    // overwrite setState in home.js for topmenu "vorige"
    if (elid == "home")
    {
      window.location.href = "/";
      return;
    }
    
    var el = document.getElementById(elid);
    if (className == "switch") className = (el.className == "expanded")? "collapsed" : "expanded";
    
    switch(elid) {
      case "zoekresultaat" :
        if (className == "expanded") {
          // enable hovering of verhalen
          this.hovers.zoekresultaat.enabled = true;
        }
        else {
          // disable hovering of verhalen
          this.hovers.zoekresultaat.enabled = false;
        }
        break;
      case "alleverhalen" :
        if (className == "expanded") {
          // enable hovering of verhalen
          this.hovers.verhalen.enabled = true;
        }
        else {
          // disable hovering of verhalen
          this.hovers.verhalen.enabled = false;
        }
        break;
      case "alleobjecten" :
        if (className == "expanded") {
          // enable hovering of verhalen
          this.hovers.objecten.enabled = true;
        }
        else {
          // disable hovering of verhalen
          this.hovers.objecten.enabled = false;
        }
        break;
    }
    el.className = className;

    spif.styleMorpher.morph();
  },
  doScroll : function(type, toRight, directAmount) 
  {
    var el = document.getElementById(type + "container");        
    if (!el) return;
    var x = el.offsetLeft;
    var w = el.firstChild.offsetWidth;
    var step = 150;
    
    if (type == "objecten")
      step = 127;      

    var endValue = x + (toRight? -step : +step);
    var index = -((endValue - 60) / step);

    // fix for non animating things
    if (!ie) 
    {      
      if ((!toRight && (x == 60)) || (toRight && (x <= 620 - w + step))) return;
      el.style.left = endValue + "px";
      this.updateCounters(el, index, step)
      return;
    }

    // directAmount zet m op de bepaalde index
    if (!isNaN(directAmount)) 
    {
      directAmount -= 4;
      if (directAmount < 1) return;
      var newLeft = 60 - directAmount * step;      
      el.style.left = newLeft + "px";
      this.updateCounters(el, directAmount, step)
      return;
    }

    if (((x-60) % step) != 0) return;
    if ((!toRight && (x == 60)) || (toRight && (x <= 620 - w + step))) {      
      this.mouseDown = false;
      return;
    }

    this.updateCounters(el, index, step)

    this.mouseDown = true;
    var anim = [{
      setStyleAfterwards:true,
      el:el, 
      prop:"left", 
      endValue:endValue, 
      delay:0, 
      duration:500,
      endCode:"setTimeout('main.keepScrolling(\"" + type + "\"," + toRight + ")',5)"
    }];
    nanimator.addAnimations(anim);
  },
  keepScrolling : function(type, toRight)
  {
    if (main.mouseDown)
      main.doScroll(type, toRight);
  },
  doStopScrolling : function() {
    this.mouseDown = false;
  },
  hover : function() {    
    if (!this.hoverOffset) this.hoverOffset = 0;
    this.hoverOffset = (this.hoverOffset>=2 * Math.pi)? 0 : this.hoverOffset + 0.11;
    
    for (var hover in this.hovers) {
      if (!this.hovers[hover].enabled) continue;
      
      for (var i=0; i<this.hovers[hover].elements.length; i++) {        
        var el = this.hovers[hover].elements[i];        

        if (el.className == "hotcurrent") continue;
        if (i % 2 == 0) {
          var top = Math.round(Math.sin(this.hoverOffset + i * 0.6) * 15);
        } else {
          var top = Math.round(Math.cos(this.hoverOffset + 0.25 + i * 0.6) * 15);
        }        
        el.style.marginTop = (top-3) + 'px';        
      }
    }
    this.hoverTOH = setTimeout("main.hover()",45);
  },
  doTop : function() {
    document.body.scrollTop = 0;
  },
  gotoNextObject : function() {    
    document.location.href = this.nextObjUrl;
  },
  mouseOverVerhaal : function(el) {
    el.className = "hot";
  },
  mouseOutVerhaal : function(el) {
    el.className = "";    
  },
  mouseOverInstelling : function(el) {
    el.className = "hot";
  },
  mouseOutInstelling : function(el) {
    el.className = "";    
  },
  mouseOverObject : function(el, text, inZoek, elName) {
    el.className = "hotcurrent";    
    var elName = elName? elName : (inZoek? "zoektitel" : "objtitel");
    var el = document.getElementById(elName);
    if (el.style.display == "inline") return;
    el.innerHTML = text;
    el.style.display = "inline";
    document.getElementById(elName + "normaal").style.display = "none";
  },
  mouseOutObject : function(el, inZoek, elName) {
    el.className = "";    
    var elName = elName? elName : (inZoek? "zoektitel" : "objtitel");
    document.getElementById(elName).style.display = "none";
    document.getElementById(elName + "normaal").style.display = "inline";
  },
  popup : function(url) {
    var w = 700;
    var h = 500;
    var t = (parseInt(self.screen.height)/2) - h/2;
    var l = (parseInt(self.screen.width)/2) - w/2;
    var w = window.open(url, "popup", "toolbar=no, resizable=yes, scrollbars=yes, width="+w+", height="+h+", top="+t+", left="+l);
    w.focus();
  },
  kiesPlaatje : function(nr)
  {
    var afbeeldingen = [];
    var afb = document.getElementById("afbeeldingen");
    var tabjes = document.getElementById("tabjes").getElementsByTagName("A");
    var divs = afb.getElementsByTagName("div");
    for (var i=0; i<divs.length; i++)
      if (divs[i].className == "afbeelding_object")
        afbeeldingen.push(divs[i]);
    
    for (var i=0; i<afbeeldingen.length; i++)
    {
      var afbeelding = afbeeldingen[i];
      var tabje = tabjes[i];

      if (nr == (i+1))
      {
        afbeelding.style.display = "block";
        tabje.className = "selected";
      } 
      else
      {
        afbeelding.style.display = "none";
        tabje.className = "";
      }
    }
  },
  initCounters : function()
  {
    var aantalLefts = getElementsByTagNameAttributeValue(document.body, "div", "className", "aantal_left");
    for (var i=0; i<aantalLefts.length; i++)
    {
      var container = aantalLefts[i].parentNode.firstChild;
      
      var firstCollapsedContainer = getParentElementByTagNameAttributeValue(container, "div", "className", "collapsed");
      if (firstCollapsedContainer)
        firstCollapsedContainer.className = "expanded";

      var type = container.getAttribute("id").replace(/view/g,"");
      var step = 150;
      if (type == "objecten")
        step = 127;      
      this.updateCounters(container.firstChild, 0, step);

      if (firstCollapsedContainer)
        firstCollapsedContainer.className = "collapsed";
    }
  },
  updateCounters : function(container, index, step)
  {
    var aantalLeft = getElementsByTagNameAttributeValue(container.parentNode.parentNode, "div", "className", "aantal_left")[0];
    var aantalRight = getElementsByTagNameAttributeValue(container.parentNode.parentNode, "div", "className", "aantal_right")[0];

    if (!aantalLeft)
      return;
    var aantal = Math.floor(container.firstChild.offsetWidth / step);    
    aantalLeft.innerHTML = Math.max(index, 0);
    aantalRight.innerHTML = Math.max(aantal - index - 4, 0);
  }
}
function getElementsByTagNameAttributeValue(ancestorEl, tagName, attrName, attrValue)
{
  if (!ancestorEl)
    return;

  if (typeof(attrValue) == 'undefined')
    attrValue = null;

  var els = [];
  var a = ancestorEl.getElementsByTagName(tagName.toUpperCase());

  for (var i=0; i<a.length; i++)
  {
    var el = a[i];    
    switch(attrName)
    {
      case "class":
      case "className":
        var val = el.className;
        break;
      default:
        var val = el.getAttribute(attrName);    
    }        
    if (val != null && (attrValue == null || val.indexOf(attrValue) != -1))
      els.push(el);
  }
  
  return els;
}

function getParentElementByTagNameAttributeValue(el, tagName, attrName, attrValue)
{
  if (typeof(attrValue) == 'undefined')
    attrValue = null;

  tagName = tagName.toLowerCase();

  while (el && el.getAttribute && el.parentNode)
  {
    if (el.tagName && (el.tagName.toLowerCase() == tagName))
    {
      switch(attrName)
      {
        case "class":
        case "className":
          var val = el.className;
          break;
        default:
          var val = el.getAttribute(attrName);    
      }        
      if (val != null && (attrValue == null || val.indexOf(attrValue) != -1))
        return el;
    }
    el = el.parentNode;
  }

  return null;
}
