// Main navigation dropdown, fontscaling and contrast tools, and search bar enhancements
// by Lost Boys - www.lostboys.nl

// menu opens on mouseover events on top-level LIs (class 'open' added), closes on mouseover op BODY (document).
// event on BODY only exists when menu is open (set in doDropDown)

DropDownMenu = function() {
	if(!document.getElementById("navigation-secondary") || document.getElementById("navigation-secondary").getElementsByTagName("ol").length == 0) return;
	this.root = document.getElementById("navigation-secondary").getElementsByTagName("ol")[0];	
	this.bodyClosingEvent = this.bodyClosingEventKeyboard1 = this.bodyClosingEventKeyboard2 = null;
	this.dropDelay = 300;
	var self = this;
	var items = this.root.childNodes;
	this.navItems = new Array;
	for(var i = 0; i < items.length; i++) {
		if(items[i].tagName) {
			this.navItems[this.navItems.length] = items[i];
			EventListener.addEvent(items[i], "mouseover", function(e) {
				self.startDropDown(this,e);
			});
			EventListener.addEvent(items[i], "focus", function(e) {
				self.startDropDown(this,e);
			});
			EventListener.addEvent(items[i], "focusin", function(e) {
				self.startDropDown(this,e);
			});
		}
	}
	EventListener.addEvent(this.root, "focus", function(e) {
		EventListener.stopPropagation(e);
	} );
	EventListener.addEvent(this.root, "focusin", function(e) {
		EventListener.stopPropagation(e);
	} );
	// iframe coverage for IE6 and below
	if(/msie (5|6)/i.test(navigator.userAgent)) {
		this.frm = document.createElement("iframe");
		this.frm.className = "cover-frm";
		this.frm.frameBorder = 0;
		document.getElementById("canvas").appendChild(this.frm);
	}
}

DropDownMenu.prototype.startDropDown = function(navItem,e) {
	if(window.metaNavigation) metaNavigation.setCurrent(null);
	if(navItem.className.match("open")) return EventListener.stopPropagation(e);
	var self = this;
	window.clearTimeout(self.timedDropDown);
	this.closeDropDown(); // close all
	addClass(navItem, "over");
	this.timedDropDown = window.setTimeout(function() { self.openDropDown(navItem) }, (self.bodyClosingEvent) ? 0 : self.dropDelay);
	if(!this.bodyClosingEvent) {
		this.bodyClosingEvent = EventListener.addEvent(document, "mouseover", function() {
			self.bodyClosing();
		} );
		this.bodyClosingEventKeyboard1 = EventListener.addEvent(document, "focus", function() {
			self.bodyClosing();
		} );
		this.bodyClosingEventKeyboard2 = EventListener.addEvent(document, "focusin", function() {
			self.bodyClosing();
		} );
	}
	EventListener.stopPropagation(e);
}

DropDownMenu.prototype.openDropDown = function(navItem) {
	var self = this;
	window.clearTimeout(self.timedDropDown);
	this.menu = getElementsByAttributeValue("class", "navigation-menu", navItem)[0];
	if(this.menuAnimation) {
		this.menuAnimation.stop();
	}

	if(this.menu) {
		// initiate animation
		this.menu.style.paddingTop = "6px";
		this.menuAnimation = new Animator(12, 16, this.method(this.animateMenu));
		this.menuAnimation.setType(self.menuAnimation.EASEINOUT);
		this.menuAnimation.start();
	}
	addClass(navItem, "open");	
	if(this.menu) {
		// check for menu horizontally overlapping the right edge of the canvas
		var overlap = calculateLeft(this.menu) + this.menu.offsetWidth - (965 - 32 + 3);
		if(overlap > 0) this.menu.style.left = (-overlap) + "px";
	}
	if(this.frm && this.menu) {
		this.frm.style.left = calculateLeft(this.menu) + "px";
		this.frm.style.top = calculateTop(this.menu) + "px";
		this.frm.style.width = (this.menu.offsetWidth - 5) + "px";
		this.frm.style.height = (this.menu.offsetHeight - 3) + "px";
		this.frm.style.marginTop = 0;
		this.frm.style.display = "block";
	}
}

DropDownMenu.prototype.animateMenu = function(y) {
	if(this.menu) this.menu.style.paddingTop = y + "px";
	if(this.frm) this.frm.style.marginTop = y + "px";
}

DropDownMenu.prototype.closeDropDown = function() {
	for(var i = 0; i < this.navItems.length; i++) {
		removeClass(this.navItems[i], "over");
		removeClass(this.navItems[i], "open");
	}
	this.fullyOpened = false;
	if(this.frm) this.frm.style.display = "none";
}

DropDownMenu.prototype.bodyClosing = function() {
	var self = this;
	window.clearTimeout(self.timedDropDown);
	this.closeDropDown();
	EventListener.removeEvent(this.bodyClosingEvent);
	EventListener.removeEvent(this.bodyClosingEventKeyboard1);
	EventListener.removeEvent(this.bodyClosingEventKeyboard2);
	this.bodyClosingEvent = this.bodyClosingEventKeyboard1 = this.bodyClosingEventKeyboard2 = null;
}

/* Meta navigation */

function MetaNavigation() {
	this.container = document.getElementById("navigation-primary");
	EventListener.addEvent(this.container, 'mouseover', this.openMenu, this);

	if(/msie (5|6)/i.test(navigator.userAgent)) {
		this.frm = document.createElement("iframe");
		this.frm.className = "cover-frm";
		this.frm.frameBorder = 0;
		document.getElementById("canvas").appendChild(this.frm);
	}
}

MetaNavigation.prototype = {
	openMenu:function(e) {
		var item = EventListener.getTarget(e, 'li');
		if(item && item.parentNode == this.container) {
			this.setCurrent(item);
		}

		if(!this.closeEvent) {
			this.closeEvent = EventListener.addEvent(
				document.body, 'mouseover', this.attemptClose, this);
		}
	},

	setCurrent:function(item) {
		if(item && item == this.currentItem) return;
		if(this.currentItem) {
			ClassName.remove(this.currentItem, 'open');
			this.currentItem = null;
			if(this.frm) {
				this.frm.style.display = 'none';
			}
		}
		if(item) {
			var sub = item.getElementsByTagName("div")[0];
			
			if(sub){
				var padding = 0;
				ClassName.add((this.currentItem = item), 'open');
			
				sub.style.paddingTop = padding;
				var timer = setInterval(function(){
					sub.style.paddingTop = (++padding)+'px';
					if(padding >= 3) clearInterval(timer);
				}, 30);

				if(this.frm) {
					this.positionFrame(item, sub);
				}
			}
		}
	},

	attemptClose:function(e) {
		var node = EventListener.getTarget(e);
		while(node) {
			if(node == this.container) return;
			node = node.parentNode;
		}

		this.setCurrent(null);
		EventListener.removeEvent(this.closeEvent);
		this.closeEvent = null;

		if(this.frm) {
			this.frm.style.display = 'none';
		}
	},

	positionFrame:function(item, sub) {
		item.appendChild(this.frm);
		var css = this.frm.style;
		css.width = '220px';
		css.height = (sub.offsetHeight || 10)+ 'px';
		css.left = 0;
		css.top = '2.5em';
		css.display = 'block';
		css.zIndex = 1;
	}
}

/* font scale tool */

FontScaler = function() {
	var self = this;
	
	this.cookie = new Cookie("ns-fontsize", "", 14);
	this.currentFlag = this.cookie.get() || "text-small";
	
	var root  = document.getElementById("navigation-tools");
	this.container = document.createElement("li");
	this.container.id = "navigation-fontscaler";
	root.appendChild(this.container);
	var flags = new Array("text-small", "text-medium", "text-large");
	var titles = new Array("Kleine lettergrootte", "Medium lettergrootte", "Grote lettergrootte");
	for(var i = 0; i < flags.length; i++) {
		var a = document.createElement("a");
		a.href = "#";
		a.className = a.flag = flags[i];
		a.innerHTML = "A";
		a.title = titles[i];
		this.container.appendChild(a);
		if(flags[i] == this.currentFlag) addClass(a, "active");
	}
	EventListener.addEvent(this.container, "click", function(e) {
		var target = EventListener.getTarget(e);
		self.scale(target.flag);	
		self.resetActive();	
		addClass(target, "active");
		return EventListener.preventDefault(e);							
	});
}

FontScaler.prototype.scale = function(flag) {
	var b = document.getElementsByTagName("body")[0];
	removeClass(b, this.currentFlag);
	addClass(b, flag);
	this.currentFlag = flag;
	this.cookie.value = flag;
	this.cookie.set();	
}

FontScaler.prototype.resetActive = function() {
	var els = this.container.getElementsByTagName("a");
	for(var i = 0; i < els.length; i++) {
		removeClass(els[i], "active");	
	}
}

/* high contrast tool */

HighContrast = function() {
	var self = this;
	var root  = document.getElementById("navigation-tools");
	this.cookie = new Cookie("ns-contrast", "", 14)
	this.alternate = (this.cookie.get() == "true") ? true : false;
	this.container = document.createElement("li");
	this.container.id = "navigation-contrast";
	root.appendChild(this.container);
	var a = document.createElement("a");
	a.href = "#";
	a.title = "Wissel tussen normale en hoog contrast weergave";
	a.innerHTML = "Contrast";
	this.container.appendChild(a);
	EventListener.addEvent(this.container, "click", function(e) {
		return self.switchStyles(e);												
	});
}

HighContrast.prototype.switchStyles = function(e) {
	var els = getElementsByAttributeValue("rel", "stylesheet", document.getElementsByTagName("head")[0]);
	for(var i = 0; i < els.length; i++) {
		if(els[i].media.match("screen")) els[i].disabled = !this.alternate;
		if(els[i].rel.match("alterna")) els[i].disabled = this.alternate;
	}
	this.alternate = !this.alternate;
	this.cookie.value = this.alternate;
	this.cookie.set();
	return EventListener.preventDefault(e);
}

/* search bar */

SearchBar = function() {
	this.root = document.getElementById("search");
	if(!this.root) return;
	this.query = document.getElementById("FilterSearchTerm");
	if(!this.query.value) {
		this.query.value = this.query.title;
		this.query.style.color = "#7F7FB2";
	}
	EventListener.addEvent(this.query, "focus", function(e) {
		if(this.value == this.title) {
			this.value = "";
			this.style.color = "#000066";
		}
	} );
	EventListener.addEvent(this.query, "blur", function(e) {
		if(this.value == "") {
			this.value = this.title;
			this.style.color = "#7F7FB2";
		}
	} );
}


EventListener.addEvent(window, "load", function() {
	window.dropDownMenu = new DropDownMenu();
	window.metaNavigation = new MetaNavigation();
	window.fontScaler = new FontScaler();
	window.highContrast = new HighContrast();
	window.searchBar =  new SearchBar();
} );

gimme = function(obj) {
	var r = "";
	for(var i in obj) r = r + i + " / ";
	alert(r);
}