var ROCMenu = {
	SV: {
		leftnav: {
			init: function () {
				$ES('#leftnav h3').each(function (li) {
					toggle = new Element('a', {'class': 'toggle down', 'href': '#' }).setHTML('open/sluit');
					toggle.injectBefore(li);
				});
				var accordion = new MultiOpenAccordion('#leftnav li a.toggle', '#leftnav ul ul', {
					opacity: false,
					alwaysHide: true,
					show: [0,1],
					onActive: function(toggler, element){
						toggler.addClass('up').removeClass('down');
					},
					onBackground: function(toggler, element){
						toggler.addClass('down').removeClass('up');
					}
				});
				$ES('#leftnav a.toggle').each(function (a) {
					a.addEvent('click', function(e){new Event(e).stop();})
				});
			}
		},
		rightnav: {
			init: function () {
				$ES('#rightnav ul.menu h3').each(function (li) {
					if (li.getNext().nodeName == 'UL')
					{
						toggle = new Element('a', {'class': 'toggle down', 'href': '#'}).setHTML('open/sluit');
						toggle.injectBefore(li);
					}
				});
				var accordion = new Accordion('#rightnav ul.harmonica a.toggle', '#rightnav ul.harmonica ul', {
					opacity: false,
					alwaysHide: true,
					show: 0,
					onActive: function(toggler, element){
						toggler.addClass('up').removeClass('down');
					},
					onBackground: function(toggler, element){
						toggler.addClass('down').removeClass('up');
					}
				});
				var accordion2 = new Accordion('#rightnav ul.top a.toggle', '#rightnav ul.top ul', {
					opacity: false,
					alwaysHide: true,
					show: 0,
					onActive: function(toggler, element){
						toggler.addClass('up').removeClass('down');
					},
					onBackground: function(toggler, element){
						toggler.addClass('down').removeClass('up');
					}
				});
				$ES('#rightnav a.toggle').each(function (a) {
					a.addEvent('click', function(e){new Event(e).stop();})
				});
			}
		}
	}
};


var ROCAction = {
	SV: {
		opleidingen: {
			init: function()
			{
				list = $E('.opleidingen');
				if (!list) return;
				children = list.getChildren();
				n = children.length;
				if (n <= 10) return;
				
				this.currSet = 0;
				this.opleidingenIndex = new Array(n);
				this.sets = Math.ceil(n / 10);
				
				this.opleidingen = new Element('ul');
				children.each(function(el,i){
					el.injectInside(this.opleidingen);
					this.opleidingenIndex[i] = el;
				}.bind(this));
				this.li = new Element('li', {'class':'nav'});
				a = new Element('a', {'href':'#'}).setText('Meer');
				this.liTop = this.li.clone();
				aTop = a.clone().setText('Vorige');
				a.addClass('down').addEvent('click', this.nextSet.bindAsEventListener(this)).injectInside(this.li);
				aTop.addClass('up').addEvent('click', this.prevSet.bindAsEventListener(this)).injectInside(this.liTop);
				this.liTop.injectTop(list);
				this.li.injectInside(list);
				this.replaceSet(0);
			},
			nextSet: function(e)
			{
				new Event(e).stop();
				this.replaceSet(this.currSet + 1);
			},
			prevSet: function(e)
			{
				new Event(e).stop();
				this.replaceSet(this.currSet - 1);
			},
			replaceSet: function(newSet)
			{
				if (this.currSet == -1 || newSet < 0) return;
				this.currSet = newSet;
				if (newSet == 0) this.liTop.setStyle('display','none');
				else this.liTop.setStyle('display','');
				if ((newSet + 1) == this.sets) this.li.setStyle('display','none');
				else this.li.setStyle('display','');
				$$('.opleidingen li').each(function(el){
					if (!el.hasClass('nav')) el.injectInside(this.opleidingen);
				}.bind(this));
				for (i = newSet * 10; i < Math.min(this.opleidingenIndex.length, ((newSet + 1) * 10)); i++)
				{
					this.opleidingenIndex[i].injectBefore(this.li);
				}
				this.li.parentNode.effect('height').start(this.li.parentNode.getSize().scrollSize.y);
			},
			currSet: -1
		},
		Home: {
			tooltips: {
				init: function () {
					vt = new Element('div', {'id':'visible_tooltip'}).setStyle('display','none').injectInside(document.body);
					vtc = new Element('div').injectInside(vt);
					vt._active = false;
					$$('#tooltips div').each(function(tip){
						tip.addEvent('mouseleave', function(e){
							vt.setStyle('display','none');
							this.injectInside($('tooltips'));
							vt._active = false;
						}.bindAsEventListener(tip));
					})
					$$('.themablocks a').each(function(a){
						a.addEvent('mouseenter', function(e, a){
							tip = $E('#tooltips .' + a.parentNode.className);
							if (!tip || vt._active == true) return;
							vt.setStyle('top', a.getTop() - 184);
							vt.setStyle('left', a.getLeft() - 4);
							tip.injectInside(vtc);
							vt._active = true;
							vt.setStyle('display','');
						}.bindAsEventListener(this, a));
					});
				}
			}
		},
		Sector: {
			richtingtips: {
				init: function() {
					if (!$E('#pagecontent .richtingen')) return;
					contPosition = $E('#pagecontent .richtingen').getCoordinates();
					tipWidth = 145;
					$$('.richtingen a').each(function(el){
						elPosition = el.getCoordinates();
						position = {};
						if (elPosition.left + tipWidth > contPosition.right)
							position.textAlign = 'right';
						
						tip = new Element('li',{'class':'richtingnaam'})
							.setText(el.getText())
							.setStyles(position)
							.injectAfter(el.parentNode);
						
						el.addEvent('mouseenter', function(e,el) {
							if (this._active) return;
							this._active = true;
							contPosition = $E('#pagecontent .richtingen').getCoordinates();
							elPosition = el.getCoordinates();
							position = {'top':elPosition.bottom - contPosition.top,'display':''};
							if (elPosition.left + tipWidth > contPosition.right)
								position.left = elPosition.right - contPosition.left - tipWidth;
							else
								position.left = elPosition.left - contPosition.left;
							this.setStyles(position);
						}.bindAsEventListener(tip, el));
						el.addEvent('mouseleave', function() {
							if (!this._active) return;
							this._active = false;
							this.setStyle('display','none');
						}.bindAsEventListener(tip));
					});
				},
				sIFRfix: function()	{
					$$('.richtingen .richtingnaam').each(function(el,i){
						el.setStyle('display','none');
					});
				}
			}
		}
	}
};

var ROCLayout = {
	SV: {
		Resize: {
			init: function() {
				this.options.heightPage = 766;
				this.options.widthPage = 0; $('content').getCoordinates().right;
				window.addEvent('resize',function(){this.updateLayout.bind(this)()}.bindAsEventListener(this));
				this.updateLayout();
			},
			updateLayout: function() {
				compact = (window.getHeight() < this.options.heightPage || window.getWidth() < this.options.widthPage);
				if (!compact && !this.options.compact) return;
				if (!compact && this.options.compact)
				{
					//$E('h1').injectTop($('container'));
					$(document.body).removeClass('size1024')
					this.options.compact = false;
				}
				else if (!this.options.compact)
				{
					//$E('h1').injectInside($('rightnav'));
					$(document.body).addClass('size1024');
					this.options.compact = true;
				}
			},
			options : {
				compact: false,
				heightPage: 0,
				widthPage: 0
			}
		},
		TopNav: {
			search: {
				init: function () {
					searchField = $E('#topnav .search input');
					searchField.value = 'Zoek in deze website';
					searchField.addEvent('focus', function(){
						if (!this._changed) 
						{
							this.value = ''; 
							this._changed = true;
						}
					});
				}
			}
		},
		Select: {
			init: function ()
			{
				$$('.niceSelect').each(function(select){
					new comboBoo(select);
				});
			}
		},
		Submit: {
			init: function() {
				$$('form input.submit').each(function(submit){
					form = submit;
					while (form.nodeName.toUpperCase() != 'FORM') form = form.parentNode;
					var link = new Element('a', {'class':'submit','href':'#'}).setText(submit.value).addEvent('click', function(e){
						new Event(e).stop();
						if ($defined(ROCForm))
						{
							this.onsubmit();
							if (ROCForm.Validate.errorFound) return false;
						}
						this.submit();
					}.bindAsEventListener(form));
					submit.replaceWith(link);
				})
			}
		},
		Landing: {
			init: function() {
				setTimeout(function() {
					new Fx.Style($('landingbalk'), 'opacity', {duration: 1000} ).start(0);
				}, 5000);
			}
		},
		Home: {
			search: {
				init: function () {
					$('sector_select').addEvent('change', function(){
						this.changeSector($('sector_select').getValue());
					}.bind(this));
					$('sector_select').fireEvent('change');
					if (!$E('#pagecontent .search .trefwoord')) return;
					searchField = $E('#pagecontent .search .trefwoord');
					searchField.value = 'trefwoord';
					searchField.addEvent('focus', function(){
						if (!this._changed) 
						{
							this.value = ''; 
							this._changed = true;
						}
					});
				},
				changeSector: function(sid) {
					richtingen = {
						1: [1],
						2: [2,3],
						3: [19,30,31,32,7,33,34,35,36,20,37,38,39,40,41,42,43],
						4: [9],
						5: [10,12,13,48,49,50,51,52,53],
						6: [22,16,17,23],
						7: [18],
						8: [45,46],
						9: [4]
					};
					if (sid != 0) ar = richtingen[sid];
					v = $('richting_select').getValue();

					if (!this.opts) {
						this.opts = new Array($('richting_select').options.length);
						for(i = 0; i < $('richting_select').options.length; i++) {
							this.opts[i] = $($('richting_select').options[i]).clone();
						};
					}
					
					while ($('richting_select').options.length > 0)
						$($('richting_select').options[0]).remove();
					
					for(i = 0; i < this.opts.length; i++) {
						if (sid == 0 || this.opts[i].value == "" || ar.contains(this.opts[i].value * 1)) {
							$('richting_select').adopt(this.opts[i].clone());
							if (this.opts[i].value == v) $('richting_select').selectedIndex = $('richting_select').length - 1;
						}
					};
					new comboBoo('richting_select');
				}
			},
			resize: {
				init: function() {
					pc = $('pagecontent');
					this.options.maxPaddingPC = pc.getStyle('paddingTop').toInt();
					//this.options.heightPage = $('content').getCoordinates().bottom;
					this.options.heightPage = 750;
					this.options.widthPage = $('content').getCoordinates().right;
					window.addEvent('resize',function(){this.updateLayout.bind(this)()}.bindAsEventListener(this));
					this.updateLayout();
				},
				updateLayout: function() {
					//alert(window.getHeight());
					compact = (window.getHeight() < this.options.heightPage || window.getWidth() < this.options.widthPage);
					if (!compact && !this.options.compact) return;
					if (!compact && this.options.compact)
					{
						$E('h1').injectTop($('container'));
						$(document.body).removeClass('size1024')
						this.options.compact = false;
					}
					else if (!this.options.compact)
					{
						$E('h1').injectInside($('rightnav'));
						$(document.body).addClass('size1024');
						this.options.compact = true;
					}
				},
				options : {
					compact: false,
					maxPaddingPC: 0,
					heightPage: 0,
					widthPage: 0,
					normalSizeThemablocks: 756,
					smallSizeThemablocks: 567
				}
			}
		}
	}
};

/* accepteerd ook een array als 'display' option, werkt enkel goed met alwaysHide aan */
var MultiStartAccordion = Accordion.extend({
	display: function(index)
	{
		index = ($type(index) == 'element') ? this.elements.indexOf(index) : index;
		if ((this.timer && this.options.wait) || (index === this.previous && !this.options.alwaysHide)) return this;
		var obj = {};
		this.elements.each(function(el, i){
			obj[i] = {};
			var hide = ($type(index) == 'array' ? !index.contains(i) : (i != index))  
				|| (this.options.alwaysHide && (el.offsetHeight > 0));
			if (hide 
				&& $type(this.previous) == 'array' 
				&& i != index 
				&& this.previous.contains(index)
				&& this.previous.contains(i)) hide = false;
			this.fireEvent(hide ? 'onBackground' : 'onActive', [this.togglers[i], el]);
			for (var fx in this.effects) obj[i][fx] = hide ? 0 : el[this.effects[fx]];
		}, this);
		this.previous = index;
		return this.start(obj);
	}
});

/* accepteerd ook een array als 'display' en 'start' option, werkt mogelijk enkel goed met alwaysHide aan */
var MultiOpenAccordion = Fx.Elements.extend({


	options: {
		onActive: Class.empty,
		onBackground: Class.empty,
		display: 0,
		show: false,
		height: true,
		width: false,
		opacity: true,
		fixedHeight: false,
		fixedWidth: false,
		wait: false,
		alwaysHide: true
	},

	initialize: function(){
		var options, togglers, elements, container;
		$each(arguments, function(argument, i){
			switch($type(argument)){
				case 'object': options = argument; break;
				case 'element': container = $(argument); break;
				default:
					var temp = $$(argument);
					if (!togglers) togglers = temp;
					else elements = temp;
			}
		});
		this.togglers = togglers || [];
		this.elements = elements || [];
		this.container = $(container);
		this.setOptions(options);
		this.previous = -1;
		if (this.options.alwaysHide) this.options.wait = true;
		if ($chk(this.options.show)){
			this.options.display = false;
			this.previous = this.options.show;
		}
		if (this.options.start){
			this.options.display = false;
			this.options.show = false;
		}
		this.effects = {};
		if (this.options.opacity) this.effects.opacity = 'fullOpacity';
		if (this.options.width) this.effects.width = this.options.fixedWidth ? 'fullWidth' : 'offsetWidth';
		if (this.options.height) this.effects.height = this.options.fixedHeight ? 'fullHeight' : 'scrollHeight';
		for (var i = 0, l = this.togglers.length; i < l; i++) this.addSection(this.togglers[i], this.elements[i]);
		this.elements.each(function(el, i){
			if (this.options.show === i  || ($type(this.options.show) == 'array' && this.options.show.contains(i))){
				this.fireEvent('onActive', [this.togglers[i], el]);
			} else {
				for (var fx in this.effects) el.setStyle(fx, 0);
			}
		}, this);
		this.parent(this.elements);
		if ($chk(this.options.display)) this.display(this.options.display);
	},



	addSection: function(toggler, element, pos){
		toggler = $(toggler);
		element = $(element);
		var test = this.togglers.contains(toggler);
		var len = this.togglers.length;
		this.togglers.include(toggler);
		this.elements.include(element);
		if (len && (!test || pos)){
			pos = $pick(pos, len - 1);
			toggler.injectBefore(this.togglers[pos]);
			element.injectAfter(toggler);
		} else if (this.container && !test){
			toggler.inject(this.container);
			element.inject(this.container);
		}
		var idx = this.togglers.indexOf(toggler);
		toggler.addEvent('click', this.display.bind(this, idx));
		if (this.options.height) element.setStyles({'padding-top': 0, 'border-top': 'none', 'padding-bottom': 0, 'border-bottom': 'none'});
		if (this.options.width) element.setStyles({'padding-left': 0, 'border-left': 'none', 'padding-right': 0, 'border-right': 'none'});
		element.fullOpacity = 1;
		if (this.options.fixedWidth) element.fullWidth = this.options.fixedWidth;
		if (this.options.fixedHeight) element.fullHeight = this.options.fixedHeight;
		element.setStyle('overflow', 'hidden');
		if (!test){
			for (var fx in this.effects) element.setStyle(fx, 0);
		}
		return this;
	},



	display: function(index)
	{
		index = ($type(index) == 'element') ? this.elements.indexOf(index) : index;
		if ((this.timer && this.options.wait) || (index === this.previous && !this.options.alwaysHide)) return this;
		var obj = {};
		this.elements.each(function(el, i){
			obj[i] = {};
			var hide = ($type(index) == 'array' ? !index.contains(i) : (i != index))  
				|| (this.options.alwaysHide && (el.offsetHeight > 0));
			if (hide 
				&& $type(this.previous) == 'array' 
				&& i != index 
				&& this.previous.contains(index)
				&& this.previous.contains(i)) hide = false;
			this.fireEvent(hide ? 'onBackground' : 'onActive', [this.togglers[i], el]);
			for (var fx in this.effects) obj[i][fx] = hide ? 0 : el[this.effects[fx]];
		}, this);
		this.previous = index;
		return this.start(obj);
	},

	showThisHideOpen: function(index){return this.display(index);}

});


var ROCPage = {
	SV: 
	{
		init: function ()
		{
			if (!$E('h2')) return;
			this.Home = ($E('h2').getText() == 'Haal er uit wat er in je zit');
			this.Sector = ($E('h2').className == 'sector');
			this.Landing = ($(document.body).hasClass('landing'));
			this.LandingX = ($(document.body).hasClass('landingx'));
		},
		Home: false,
		Sector: false,
		Landing: false,
		LandingX: false
	}
};

var ROCsIFR = {};

window.addEvent('domready', function() {
	ROCPage.SV.init();
	ROCAction.SV.Sector.richtingtips.init();
	ROCAction.SV.opleidingen.init();
	ROCLayout.SV.Select.init();
	ROCLayout.SV.TopNav.search.init();
	ROCLayout.SV.Submit.init();
	/*if (ROCPage.SV.Landing)
	{
		ROCLayout.SV.Landing.init();
	}*/
	if (ROCPage.SV.LandingX)
	{
		ROCLayout.SV.Home.resize.init();
	}
	else if (ROCPage.SV.Home)
	{
		ROCAction.SV.Home.tooltips.init();
		ROCLayout.SV.Home.resize.init();
		ROCLayout.SV.Home.search.init();
	}
	else
	{
		ROCLayout.SV.Resize.init();
	}
	var interval = setInterval(function() {
		if (sIFR.isActive)
		{
			clearInterval(interval);
			sIFR.registerEvents = false;
			sIFR.replace(dinbold, {
				selector: '#pagecontent .richtingnaam'
				,fitExactly: true
				,tuneHeight: -4
				,offsetTop: -4
				,wmode: 'transparent'
				,css: {
					'.sIFR-root': { 'color': '#2e3192','font-size':14}
				}
			});
			setTimeout(function(){
				ROCAction.SV.Sector.richtingtips.sIFRfix();
				ROCMenu.SV.rightnav.init();
				ROCMenu.SV.leftnav.init();
			}, 150);
			sIFR.initialize();
		}
		else if(typeof sIFR != "function")
		{
			clearInterval(interval);
			ROCMenu.SV.rightnav.init();
			ROCMenu.SV.leftnav.init();
		}
	}, 150);
});

var ROCForm;