// browser sniffer
function Browser(){
  this.iE = navigator.appName.toLowerCase().indexOf('microsoft') != -1 ? 1 : 0;
  this.mac =  navigator.userAgent.toLowerCase().indexOf('mac') != -1 ? 1 : 0;
  this.win = navigator.userAgent.toLowerCase().indexOf('windows') != -1 ? 1 : 0;
  this.safari =  navigator.userAgent.toLowerCase().indexOf('safari') != -1 ? 1 : 0;
  this.opera =  navigator.userAgent.toLowerCase().indexOf('opera') != -1 ? 1 : 0;    
  this.mozilla = navigator.appName.toLowerCase().indexOf('netscape') != -1 && !this.safari ? 1 : 0;
  this.winMozilla = this.mozilla && this.win ? 1 : 0;
  this.winIE = this.iE && this.win && !this.opera ? 1 : 0;
  this.macIE = this.iE && this.mac ? 1 : 0;
}
var browser = new Browser();

// framebuster
if (window!= top)top.location.href=location.href;

// getElementById
function getEl(el){
  return document.getElementById(el);
};

// addStyle
function addStyle(selector,properties){
  if (document.styleSheets) {
    var s = document.getElementsByTagName('STYLE');
    if (s.length == 0){
      var sheet = document.createElement('style');
      sheet.setAttribute('type','text/css');
      document.getElementsByTagName('HEAD')[0].appendChild(sheet);}
    if (browser.winIE){
      var lastSheet = document.styleSheets[document.styleSheets.length - 1];
      lastSheet.addRule(selector, properties);}
    else {var lastSheet = s[0];
      lastSheet.appendChild(document.createTextNode(selector + ' { ' + properties + ' }'));}
  	}
};
addStyle('.drempel','display:none;');
addStyle('.rel','position:absolute !important;');
addStyle('.script','display:block !important;');
addStyle('.info-row-off','display:none;');
addStyle('#steps .cont','overflow:hidden;display:none;');


//top nav
var active;
var activeMenu;
active = function(id) {
var nav = document.getElementById(id);
if (!nav){return;}
var e = nav.getElementsByTagName("LI");
for (var i=0; i<e.length; i++) {
	e[i].onmouseover=function() {
     if (activeMenu){activeMenu.onmouseout();}
     activeMenu = this;
		this.className+=" active";}
	e[i].onmouseout=function() {
		this.className=this.className.replace(/active/g, '');}
	}
	navFocus(id,true);
};

//focus nav on tab
var navFocus;
navFocus = function(id,mouseOverMenu){
 var subnav = document.getElementById(id);
  if (!subnav){return;}  
  var list = subnav.getElementsByTagName("A");
  for (var i = 0; i < list.length; i++){
     var e = list[i];
     if (e.parentNode.parentNode.id == id){
	  if (mouseOverMenu){
	    e.onfocus = function(){this.parentNode.onmouseover();}
	  }
	  else {
	    e.onfocus = function(){this.parentNode.onclick();}
	  }
     }
   }
if (list.length == 0){return;}
  var lastSub = list[list.length-1];
  if (lastSub.parentNode.parentNode.id == id){return;}
   lastSub.onblur = function(){
    this.parentNode.parentNode.parentNode.onmouseout();
   }
};

// event on part of element
function eventOnPartOfElement(e,element,to){
  var t;
  if (window.event){
    t = to ? window.event.toElement : window.event.srcElement;}
  else if (e){ t = to ? e.relatedTarget : e.target; } 
  else { return false; }
  if (t == null || (!element)){ return false; }
  while ((t.tagName) && t.tagName != 'BODY'){
    if (t == element){ return true; }
    t = t.parentNode; }
  return false;
};

function setupDDList(el){
	el.onclick = function() {
		this.className = this.className = 'active';
	}
	el.onmouseout = function(e) {
		if(!eventOnPartOfElement(e,this,1)){
			this.className = '';}
	}
};

/* set cookie */
function setCookie(cookieName,cookieValue,nDays) {
  var today = new Date();
  var expire = new Date();
  if (nDays==null || nDays==0) nDays=1;
  expire.setTime(today.getTime() + 3600000*24*nDays);
  document.cookie = cookieName+"="+escape(cookieValue)
  + ";expires="+expire.toGMTString()+";path=/";
};

/* get cookie */
function getCookie(c_name){
  if (document.cookie.length>0){
    c_start=document.cookie.indexOf(c_name + "=")
    if (c_start!=-1){ 
      c_start=c_start + c_name.length+1 
      c_end=document.cookie.indexOf(";",c_start)
      if (c_end==-1) c_end=document.cookie.length
        return unescape(document.cookie.substring(c_start,c_end));
      } 
    }
  return null;
};

//power animator dev 1.1, MDI, dec 2005
animTimer = [];
animate = function (oArg){
  clearTimeout(animTimer[oArg.timerName]);
  var cD,cS,pS,pD
  cD = !oArg.currDist ? 0 : oArg.currDist;
  cS = !oArg.currSpeed ? 0 : oArg.currSpeed;
  cS = !oArg.currSpeed && !oArg.easeIn ? oArg.speed : cS;
  pS = !oArg.peakSpeed ? oArg.speed : oArg.peakSpeed;
  if (oArg.peakDist){
    pD = oArg.peakDist;
  }
  else { 
    pD = oArg.easeIn && oArg.easeOut ? parseInt((oArg.dist)/(oArg.easeIn+oArg.easeOut)*oArg.easeIn) : 0;
  }
  if (cD >= pD && oArg.easeOut){
    cS = parseInt(((oArg.dist-cD)+((oArg.speed-cS)/2))/(oArg.easeOut+0.5)+1);
    if (cS > pS){
      cS = pS;
    }
  }
  else if (oArg.easeIn){
    cS = parseInt((cD+((oArg.speed-cS)/2))/(oArg.easeIn-0.5)+1);
    if (cS > oArg.speed){
      cS = oArg.speed;
    }
  }
  if (cD+cS > oArg.dist){
    cS = oArg.dist-cD;
  }
  cD += cS;
  for (var i in oArg.elements){
    var o = oArg.elements[i];
    var currPosition = o.negMove ? o.startPos-cD : o.startPos+cD;
    getEl(o.id).style[o.style] = currPosition + 'px';
  }
  if (cD < oArg.dist){
    oArg.currDist = cD;
    oArg.currSpeed = cS;
    oArg.peakDist = pD;
    oArg.peakSpeed = pS;
    animTimer[oArg.timerName] = setTimeout(function(){animate(oArg)},25);
    return;
  }
  if (oArg.afterFunc != ''){
    if (!oArg.obj){
      oArg.obj = 'window';
    }    
    animTimer[oArg.timerName] = setTimeout(oArg.obj + '.' + oArg.afterFunc,0);
  }	
};


// setup animated opening and closing of content
var openFolder = false;
function initAnimOpenFold(){
	var list = getEl('steps').getElementsByTagName('A');
	for (var i = 0; i < list.length; i++){
		var a = list[i];
		if (a.parentNode.parentNode.getAttribute('id') != 'steps'){
			continue;
		}
		a.setAttribute('href','javascript:void(0);');
		a.setAttribute('contId','stepCont' + i);
		a.setAttribute('innerId','stepInner' + i);
		
		var divEl = a.parentNode.getElementsByTagName('DIV')[0];
		divEl.style.overflow = 'visible';
		divEl.style.display = 'block';
		var containerHeight = divEl.offsetHeight;
		divEl.setAttribute('containerHeight',containerHeight);
		divEl.style.height = 0;
		divEl.style.overflow = 'hidden';
		divEl.setAttribute('id','stepCont' + i);
		
		var divInner = divEl.getElementsByTagName('DIV')[0];
		divInner.setAttribute('id','stepInner' + i);
		divInner.style.marginTop = (-containerHeight) + 'px';
		
		a.onclick = function(){
			if (openFolder == this){
				openFolder = false;
			}
			else {
				openFolder = this;
			}
			var list = getEl('steps').getElementsByTagName('A');
			for (var i = 0; i < list.length; i++){
				if (list[i].parentNode.parentNode.getAttribute('id') != 'steps'){
					continue;
				}
				if (openFolder == this && list[i] == this){
					animOpen(list[i]);
				}
				else {
					animFold(list[i]);
				}
			}
		}
	}
	if (list[0]){
		list[0].onclick();
	}
};

//open
function animOpen(el){
	var divId = el.getAttribute('contId');
	var innerId = el.getAttribute('innerId');
	var divEl = getEl(divId);
	divEl.style.display = 'block';
	var maxH = divEl.getAttribute('containerHeight');
	var cH = divEl.offsetHeight;
	var dist = maxH-cH;
  animate({
    timerName:divId,
    elements:Array(
			{id:divId,style:'height',startPos:cH,negMove:false},
			{id:innerId,style:'marginTop',startPos:-dist,negMove:false}
    ),
    dist:dist,
    speed:20,
    easeIn:4,
    easeOut:5
  });
};

//close
function animFold(el){
	var divId = el.getAttribute('contId');
	var innerId = el.getAttribute('innerId');
	var divEl = getEl(divId);
	divEl.style.display = 'block';
	var maxH = divEl.getAttribute('containerHeight');
	var cH = divEl.offsetHeight;
	var dist = cH;
  animate({
    timerName:divId,
    elements:Array(
      {id:divId,style:'height',startPos:cH,negMove:true},
			{id:innerId,style:'marginTop',startPos:-(maxH-cH),negMove:true}
    ),
    dist:dist,
    speed:20,
    easeIn:4,
    easeOut:5
  });
};
  
//hover form buttons
var setHover = function(){
var hbg = document.getElementsByTagName('input');
for (var i = 0; i < hbg.length; i++) {		
	if(hbg[i].getAttribute('type')=='submit' || hbg[i].getAttribute('type')=='reset' || hbg[i].getAttribute('type')=='button' || hbg[i].getAttribute('type')=='file') {
		hbg[i].onmouseover=function(){
			this.className = 'buttonhover';
		}
		hbg[i].onmouseout=function(){
			this.className = 'button';
			}
		}
	}
};

//check all/uncheck
var setChecked = function(){
var hbg = document.getElementById('bronnen').getElementsByTagName('input');
for (var i = 0; i < hbg.length; i++) {		
	if(hbg[i].getAttribute('type')=='checkbox') {
		hbg[i].checked= true;
		}
	}
};
var setUnchecked = function(){
var hbg = document.getElementById('bronnen').getElementsByTagName('input');
for (var i = 0; i < hbg.length; i++) {		
	if(hbg[i].getAttribute('type')=='checkbox') {
		hbg[i].checked= false;
		}
	}
};

//set searchfield value
var setSearch = function(){
if(!document.getElementById('qry')) return false;
var j = document.getElementById('qry');
var key = j.value;
	j.onfocus=function(){
		if(j.value==key)j.value='';
	}
	j.onblur=function(){
		if(j.value=='')j.value=key;
	}
};
	
//wmv popup
var setWmv = function(){
var j = document.getElementById('wmvoverlay');
var k = document.getElementById('wmvtxt');
	j.onclick=function(){
		k.style.display=(k.style.display!="block")? "block" : "none";
	}
	k.onmouseup=function(){
		this.style.display=(this.style.display!="block")? "block" : "none";
	}
};

//toggle
function toggle(id) {
	var el = document.getElementById(id); 
	el.className=(el.className=="show")? "hide" : "show"; 
}

//setup contact toggle
function setupContactToggle(){
	var el = getEl('contacttoggle');
	el.onclick = function(){
		if (this.className.indexOf('icofold') != -1){
			//open
			this.className = 'right icoopen';
		}
		else {
			//close
			this.className = 'right icofold';
		}
		toggle('headfold');
		return false;
	}
}

//layout case switcher 
var currentLarge = 1;
function checkWindowWidth() {
var smaller = ((document.documentElement.clientWidth > 0 && document.documentElement.clientWidth < 960) || document.body.clientWidth < 960);
if (smaller) {
	if (currentLarge == 0){return;}currentLarge = 0;
	document.getElementById('framework').className = 'small'; }
else {
	if (currentLarge == 1){return;}currentLarge = 1;
	document.getElementById('framework').className = ''; }
};
		
	
//clientside dfn, WGR, major changes by MDI
function Definition() {
}
Definition.setup = function() {
  if (!Array.prototype.splice) return false; // browser too old
  if (!Definition.MAP) return false;
  
  
  function findElements(list) {
    var nl = [];
    for (var i in list) {
      if (list[i].charAt(0) == "#") { // find element with id
        var n = document.getElementById(list[i].substring(1));
        if (n) nl[nl.length] = n;
      }
      else if (list[i].charAt(0) == ".") { // find elements with className
        var nl2 = document.all ? document.all : document.getElementsByTagName("*");
        for (var i = 0, l = nl2.length; i < l; i++)
          if (nl2[i].className == list[i].substring(1)) nl[nl.length] = nl2[i]; // TODO: tokenize to match against multiple classNames
      }
    }
    return nl;
  } 
	
  var wn = findElements(Definition.WHITELIST);
  var bn = findElements(Definition.BLACKLIST);
  var tn = [];
  
  function collectTextNodes(n) { // collect all descending text nodes in element n, excluding those in black list elements
    n = n.firstChild;
    while (n) {
      if (n.nodeType == 3) // text node
        tn[tn.length] = [n,n.nodeValue];
      else if (n.nodeType == 1 && n.hasChildNodes()) { // element with child nodes
        var black = false;
        for (var i in bn) {
          if (n == bn[i]) { // element is on black list
            black = true;
            break;
          }
        }
        if (!black && n.hasChildNodes()) collectTextNodes(n);
      }
      n = n.nextSibling;
    }
  }
  for (var i in wn){
    collectTextNodes(wn[i]); // kick off recursive function
  }
  
	var map = Definition.MAP;
  var maxocc = Definition.MAX_OCCURENCES;
  counter = 0;
  var m = []; 
  for (var i = 0; i < map.length; i++) {
    map[i][2] = map[i][0].toLowerCase();
  }
  for (var i in tn) { // loop through collected text nodes
    if (maxocc > 0 && counter >= maxocc){
      break;
    }
    var v = tn[i][1];
    var vLower = v.toLowerCase();
    
    for (var j = 0; j < map.length; j++) { // loop through all definitions
      if (map[j][0] == null){
        continue;
      }
      if (vLower.indexOf(map[j][2]) != -1){
        var key = map[j][0]; // keyword
        var regOptions = Definition.SINGLE_OCCURENCES ? 'i' : 'gi';
        v = v.replace(new RegExp("(^|[\\W])("+ key +")($|[\\W])",regOptions),'$1<dfn title="' + j +'">$2</dfn>$3');
        tn[i][1] = v;
        tn[i][2] = true;
        if (Definition.SINGLE_OCCURENCES) map[j][0] = null;
        counter++;
      }
    }
    if (tn[i][2]){
      var el = tn[i][0];
      var span = document.createElement('span');
      span.innerHTML = tn[i][1];
      el.parentNode.insertBefore(span,el);
      el.parentNode.removeChild(el);
    }
  }
  //replace reference with real titles
  var list = document.getElementsByTagName('DFN');
  for (var i = 0; i < list.length; i++) {
    var arrNumber = list[i].getAttribute('title');
	 if (!parseInt(arrNumber,10)){
	 	continue;
	 }
	 list[i].setAttribute('title',map[arrNumber][1]);
  }
}

Definition.WHITELIST = ["#content"];
Definition.BLACKLIST = ["#subnavigation", "#breadcrumb", "#ledenlijst", "#begrippen", "#hscommissie","#hsplenair"];
Definition.MAX_OCCURENCES = 0;
Definition.SINGLE_OCCURENCES = true;
function setDfn() {
	Definition.setup();
};

// set external links
var setExternalLinks = function(){
	var localDomain = (location.href.split('/')[2]);
	var localExtensionsInNewWindow = Array('doc','xls','pdf');
	var list = document.getElementsByTagName('A');
	for (var i = 0; i < list.length; i++){
		var aEl = list[i];
		var aElHref = aEl.href;
		// check for extensions
		var extension = (aElHref.substring(aElHref.length - 4,aElHref.length)).toLowerCase();
		var foundExtension = false;
			for (var j = 0; j < localExtensionsInNewWindow.length; j++){
			if (extension == '.' + localExtensionsInNewWindow[j]){
				foundExtension = true;
			  break;
			}
		}
		// open in new window if conditions are right
		if ((aElHref.split('/')[2] != localDomain && aElHref.indexOf('mailto:') == -1 && aElHref.indexOf('javascript:') == -1 && aElHref.className != 'thickbox') || foundExtension){
			aEl.onclick = function(){
			var answer = confirm("Hiermee opent u een nieuw venster");
			  if (answer){
					window.open(this.href);
				}
				return false;
			}
		}
	}
};


/* hotspots(mdi) */
addStyle('.hotspotsnojavascript','display:none;');
var setupHotSpots = function(){
	var el = getEl('columntwo');
	if (!el){
		return;
	}
	var list = el.getElementsByTagName('DIV');
	for (var i = 0; i < list.length; i++){
		if (list[i].className.indexOf('hotspotsnojavascript') != -1){
			var classArr = list[i].className.split(' ');
			list[i].className = classArr[0] + ' hotspots';
			var listA = list[i].getElementsByTagName('A');
			for (var j = 0; j < listA.length; j++){
				var aEl = listA[j];
				if (aEl.className != 'target'){
					continue;
				}
				aEl.onmouseover = function(){
					hotSpotToggle(this,true);
				}
				aEl.onfocus = aEl.onmouseover;
				aEl.onmouseout = function(){
					hotSpotToggle(this,false);
				}
				aEl.onblur = aEl.onmouseout;
			}
		}
	}
};

var hotSpotToggle = function(el,over){
	var elItem = el.parentNode.parentNode;
	var list = elItem.parentNode.childNodes;
	for (var i = 0; i < list.length; i++){
		if (!list[i].tagName){
			continue;
		}
		if (over){
			if (list[i] == elItem){
				list[i].className = 'item active';
			}
			else {
				list[i].className = list[i].className.split(' ')[0];
			}
		}
		else {
			if (list[i].className.indexOf('intro') != -1){
				list[i].className = 'intro active';
			}
			else {
				list[i].className = list[i].className.split(' ')[0];
			}
		}
	}
};
/* end hotspots */


/* stream popup with cookie (mdi) */
var selectedStream = false;
addStyle('#vergaderingen .stream-link-container','display:none;');

function setupStreams(){
	var el = getEl('vergaderingen');
	if (!el){
		return;
	}
	var list = el.getElementsByTagName('DIV');
	for (var i = 0; i < list.length; i++){
		if (list[i].className != 'stream-text'){
			continue;
		}
		// checking for existence elements
		var listA = list[i].parentNode.getElementsByTagName('A');
		if (listA.length == 0){
			continue;
		}
		if (listA.length == 1){
			list[i].innerHTML = '<a href="' + listA[0].getAttribute('href') + '">' + list[i].innerHTML + '</a>';
			continue;
		}
		list[i].innerHTML = '<a href="#" onclick="checkStream(this);return false;">' + list[i].innerHTML + '</a>';
		
	}
	writeStreamPopup();
};

function writeStreamPopup(){
	var w = ''+
		'	<form>'+
		'		<div class="inner">'+
		'			<p>'+
		'				<strong>Selecteer uw internet instellingen</strong>'+
		'			</p>'+
		'			<div class="radio-container">'+
		'				<input type="radio" name="stream-choice" id="stream-choice-adsl" class="checkbox" value="adsl" />'+
		'				<label for="stream-choice-adsl" class="inline">ADSL</label>'+
		'			</div>'+
		'			<div class="radio-container">'+
		'				<input type="radio" name="stream-choice" id="stream-choice-modem" class="checkbox" value="modem" />'+
		'				<label for="stream-choice-modem" class="inline">Modem</label>'+
		'			</div>'+
		'			<div class="checkbox-container">'+
		'				<input type="checkbox" name="stream-choice-remember" id="stream-choice-remember" class="checkbox" />'+
		'				<label for="stream-choice-remember" class="inline">Maak dit mijn standaard instellingen</label>'+
		'			</div>'+
		'			<div class="checkbox-container">'+
		'				<input type="button" class="button" id="stream-open" value="Open video" />'+
		'				<input type="button" class="button" id="stream-cancel" value="Annuleer" />'+
		'			</div>'+
		'		</div>'+
		'	</form>';
	var divEl = document.createElement('DIV');
	divEl.setAttribute('id','popup-stream');
	divEl.style.display = 'none';
	divEl.innerHTML = w;
	
	document.body.appendChild(divEl);	
	getEl('stream-open').onclick = function(){
		setStream();
	};
	getEl('stream-cancel').onclick = function(){
		toggleStreamPopup('hide');
	};
};

function setStream(){
	var ADSL= getEl('stream-choice-adsl');
	var modem = getEl('stream-choice-modem');
	if((!ADSL.checked) && (!modem.checked)){
		alert('Kies eerst een internet-instelling');
		return;
	}
	var streamType = ADSL.checked ? ADSL.value : modem.value;
	setCookie('streamType',getEl('stream-choice-remember').checked ? streamType : null,365);
	openStream(streamType);
	toggleStreamPopup('hide');
};

function toggleStreamPopup(toggle){
	getEl('popup-stream').style.display = toggle == 'show' ? 'block' : 'none';
	if (toggle == 'show'){
		getEl('stream-choice-adsl').focus();
	}
	else if (selectedStream){
		selectedStream.focus();
	}
};

function checkStream(el){
	selectedStream = el;
	var streamType = getCookie('streamType');
	if ((!streamType) || streamType == 'null'){
		toggleStreamPopup('show');
		return;
	}
	openStream(streamType);
};

function openStream(streamType){
	var el = selectedStream;
	if (!el){
		return;
	}
	var divEl = el.parentNode.parentNode.getElementsByTagName('DIV')[1];
	if (!divEl){
		return;
	}
	var list = divEl.getElementsByTagName('A');
	for (var i = 0; i < list.length; i++){
		if (list[i].className == 'stream-' + streamType){
			window.location = (list[i].getAttribute('href'));
			break;
		}
	}
};

/* end stream popup with cookie */


//DOM loader
function init() {
	if (arguments.callee.done) return;
	arguments.callee.done = true;
	
	if (getEl('framework'))checkWindowWidth();
	if (getEl('navigation'))active('nav');
	if (getEl('kalender'))setupDDList(getEl('list1').getElementsByTagName('LI')[0]);
	if (getEl('kalender'))setupDDList(getEl('list2').getElementsByTagName('LI')[0]);
	setExternalLinks();
	if (getEl('wmvstream'))setWmv();
	if (getEl('searchisland'))setSearch();
	if (document.getElementsByTagName('input'))setHover();
	if (getEl('ledenlijst'))setTableSort();
  //	if (getEl('downloads'))setTableSort();
	if (getEl('ledenlijst'))setExpand();
  
	if (getEl('daghandeling'))initHandeling();
  if (getEl('content'))setDfn();
	if (getEl('steps'))initAnimOpenFold();
	if (getEl('vergaderingen'))setupStreams();
	if (getEl('contacttoggle'))setupContactToggle();
	if (getEl('wmvstream'))getEl('wmvstream').className = '';
	
	setupHotSpots();
	repBanner.setup();
};
if (document.addEventListener) {
	document.addEventListener("DOMContentLoaded", init, null);
}
if (/WebKit/i.test(navigator.userAgent)) {  
var _timer = setInterval(function() {        
	if (/loaded|complete/.test(document.readyState)) {            
		clearInterval(_timer); init();}}, 10);
};

// for Internet Explorer (using conditional comments)
/*@cc_on @*/
/*@if (@_win32)document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
var script = document.getElementById("__ie_onload");
script.onreadystatechange = function() {    
	if (this.readyState == "complete") {        
		init();  
	}
};

/*@end @*/
window.onload = init;

window.onresize = function(){
	if (getEl('framework'))checkWindowWidth();
}


// ajax functions, mdi
var xmlDoc = [];

function loadXMLDoc(oArg){
  if (window.XMLHttpRequest){
    xmlDoc[oArg.documentName] = new XMLHttpRequest();
  }
  else if (window.ActiveXObject){
    xmlDoc[oArg.documentName] = new ActiveXObject("Microsoft.XMLHTTP");
    if (!xmlDoc[oArg.documentName]){ 
      return;
    }
  }
  xmlDoc[oArg.documentName].onreadystatechange = function(){xmlhttpChange(oArg);}
  xmlDoc[oArg.documentName].open("GET",oArg.documentPath,true);
  xmlDoc[oArg.documentName].send(null);
};

function xmlhttpChange(oArg){
  if (xmlDoc[oArg.documentName].readyState==4){
    if (xmlDoc[oArg.documentName].status==200){
        setTimeout(oArg.callBack,0);
    }
    else{
      alert("Problem retrieving XML data");
    }
  }
};



// Class Representative banner, v2, mdi, nov 2006
var RepBanner = function(oArg){
  
  // instance variables
  this.id = oArg.id;
  this.delay = oArg.delay;
  this.transitionSpeed = oArg.transitionSpeed;
  this.documentPath = oArg.documentPath;
  this.defaultImagePath = oArg.defaultImagePath;
  this.allRepsURL = oArg.allRepsURL;
  this.allRepsText = oArg.allRepsText;
  
  // internal variables (don't change)
  this.numItems = 150;
  this.textId = false;
  this.el = false;
  this.visualEl = false;
  this.imgEl = false;
  this.frameEl = false;
  this.textEl = false;
  this.transAmount = 0;
  this.numChanges = 0;
  this.firstTime = true;
  this.fadeInCallBack = false;
  
  // set current item random or based on a cookie 
  this.currentItem = getCookie('repBanner' + this.id + 'CurrentItem');
  if((!this.currentItem) || isNaN(this.currentItem) || this.currentItem < 1 || this.currentItem > this.numItems){
    this.currentItem = Math.ceil(Math.random() * this.numItems);
  }
  
  // instance hash
  if (!RepBanner.prototype.instances){
    RepBanner.prototype.instances = [];
  }  
  this.instance = RepBanner.prototype.instances.length;
  RepBanner.prototype.instances[this.instance] = this;
  
  // set me up (called from the global function init())
  this.setup = function(){
    this.el = getEl(this.id);
    if (!this.el){
      return;
    }  
    this.createElements();
    this.getNewRep();
  };
  
  // create the dom elements with javascript, no use for users without javascript to see those nodes anyway 
  this.createElements = function(){
    
    // create visual    
    this.visualEl = document.createElement('span');
    this.visualEl.setAttribute('id',this.id + '-visual');
    this.el.appendChild(this.visualEl);
    this.visualEl.style.display = 'none';
    
    // create image
    this.imgEl = document.createElement('img');
    this.imgEl.setAttribute('id',this.id + '-img');
    this.imgEl.setAttribute('src',this.defaultImagePath);
    this.visualEl.appendChild(this.imgEl);
    this.imgEl.setAttribute('repBanner',this.instance);
    
    // create frame
    this.frameEl = document.createElement('span');
    this.frameEl.setAttribute('id',this.id + '-frame');
    this.visualEl.appendChild(this.frameEl);
    
    // create text element
    this.textId = this.id + '-text';
    this.textEl = document.createElement('span');
    this.textEl.setAttribute('id',this.textId);
    this.textEl.style.display = 'none';
    this.el.appendChild(this.textEl);
    this.textEl.appendChild(document.createTextNode('-'));
    
  };
  
  // get a new representative in XML-format
  this.getNewRep = function(){
    loadXMLDoc({
      documentPath:this.documentPath + this.currentItem,
      documentName:this.id,
      callBack:'RepBanner.prototype.instances[' + this.instance + '].onDataLoaded()'
    });
  };
  
  // when the xml is loaded...
  this.onDataLoaded = function(){
    if (this.firstTime){
      this.startFadeIn();
      this.firstTime = false;
    }
    else {
      this.startFadeOut();
    }  
  };
  
  // insert the xml data
  this.insertData = function(){
    var xml = xmlDoc[this.id].responseXML;
    this.el.setAttribute('href',this.getNodeValue(xml,'url'));
    this.textEl.childNodes[0].data = this.getNodeValue(xml,'name') + ' (' + this.getNodeValue(xml,'party') + ')';
    this.imgEl.setAttribute('src',this.getNodeValue(xml,'visual'));
    this.imgEl.onload = function(){  
      var repBanner = RepBanner.prototype.instances[this.getAttribute('repBanner')];
      repBanner.visualEl.style.display = 'block';        
      animTimer[repBanner.textId] = setTimeout('getEl(\'' + repBanner.textId +'\').style.display = \'block\'',400);
      repBanner.fadeIn();
    }
    this.imgEl.setAttribute('alt',this.getNodeValue(xml,'name'));
  };
  
  // wrapper function to retrieve xml node values
  this.getNodeValue = function(tree, el){
    var firstEl = tree.getElementsByTagName(el)[0];
    if (!firstEl){
      return '';
    }
    return firstEl.firstChild.nodeValue;
  };
  
  // start the fade in
  this.startFadeIn = function(){
    if (this.numChanges == 5){ // show a global banner after every five rep banners
      this.visualEl.style.display = 'none';
      this.el.setAttribute('href',this.allRepsURL);
      this.textEl.childNodes[0].data = this.allRepsText;
      this.fadeInCallBack = 'onDataLoaded';
      this.numChanges = 0;
      animTimer[this.textId] = setTimeout('getEl(\'' + this.textId +'\').style.display = \'block\'',400);
      this.fadeIn();      
    }
    else {
      this.fadeInCallBack = 'getNewRep';
      this.numChanges++;
      this.insertData();
      setCookie('repBanner' + this.id + 'CurrentItem',this.currentItem);
      this.currentItem++;
      if (this.currentItem > this.numItems){
        this.currentItem = 1;
      }
    }
  };
  
  // looping function to fade in
  this.fadeIn = function(){
    if (this.transAmount > 100){
      this.transAmount = 100;
    }
    else {
      this.transAmount += this.transitionSpeed;
    }
    this.setOpacity(this.visualEl,this.transAmount);
    if (this.transAmount < 100){
      animTimer[this.id] = setTimeout('RepBanner.prototype.instances[' + this.instance + '].fadeIn()',40);
    }
    else {
      animTimer[this.id] = setTimeout('RepBanner.prototype.instances[' + this.instance + '].' + this.fadeInCallBack +'()',this.delay);
    }
  };
  
  // looping function to fade out
  this.fadeOut = function(){
    if (this.transAmount < 0){
      this.transAmount = 0;
    }
    else {
      this.transAmount -= this.transitionSpeed;
    }
    this.setOpacity(this.visualEl,this.transAmount);
    if (this.transAmount > 0){
      animTimer[this.id] = setTimeout('RepBanner.prototype.instances[' + this.instance + '].fadeOut()',40);
    }
    else {
      this.startFadeIn();
    }
  };
  
  // start the fade out
  this.startFadeOut = function(){
    this.fadeOut();
    animTimer[this.textId] = setTimeout('getEl(\'' + this.textId +'\').style.display = \'none\'',750);
  };
  
  // the actual cross browser fading effect
  this.setOpacity = function(el,opac){
    if (el.filters){
      //status = 'filters';
      el.filters.alpha.opacity = opac;
    }
    else {
      status = 'opacity';
      el.style.opacity = opac / 101;
    }
  };
    
};

//create the instance
var repBanner = new RepBanner({
  id:'banner-kamerleden',
  delay:4000,
  transitionSpeed:4,
  documentPath:'/xml/dynban.jsp?id=',
  defaultImagePath:'images/spacer.gif',
  allRepsURL:'http://www.tweedekamer.nl/kamerleden/alle_kamerleden/index.jsp',
  allRepsText:'Alle 150 kamerleden'
});