function onLoad() {
	var img1 = new Image();
	var img2 = new Image();
	var img3 = new Image();
	var img4 = new Image();
	var img5 = new Image();
	var img6 = new Image();
	var img7 = new Image();
	var img8 = new Image();
	img1.src = "assets/images/menu_welkom_a.gif";
	img2.src = "assets/images/menu_historie_a.gif";
	img3.src = "assets/images/menu_offerte_a.gif";
	img4.src = "assets/images/menu_nieuwsbrief_a.gif";
	img5.src = "assets/images/menu_actueel_a.gif";
	img6.src = "assets/images/menu_rechtsgebieden_a.gif";
	img7.src = "assets/images/menu_links_a.gif";	
	img7.src = "assets/images/menu_contact_a.gif";
	
	loadTabAndChecksElements();
	loadRadioInputs();
}

function loadRadioInputs() {
	var radios = $A($('content_inner').getElementsByTagName('input')).findAll( function (p) { return p.type == 'radio'; });
	radios.each( function (r) {
		replaceRadio(r);
	});
}

function replaceRadio(r) {
	var labels = $A($('content_inner').getElementsByTagName('label')).findAll( function (l) { return l.htmlFor == r.id; });
	
	var img = $(document.createElement('img'));
	var par = r.up();
	if(r.checked) {
		img.src = "assets/images/radio_sel.gif";
	} else {
		img.src = "assets/images/radio.gif";
	}
	img.setStyle({cursor:'pointer', verticalAlign:'middle', display:'inline', border:'0', margin:'0 2px 0 2px'});
	img.radio = r;
	r.img	  = img;
	
	r.changed = function() {
		if(!this.checked) {
			this.img.src = "assets/images/radio.gif";
		} else {
			this.img.src = "assets/images/radio_sel.gif";
		}
	};
	img.onclick = function() {
		if(!this.radio.checked) {
			this.src = "assets/images/radio_sel.gif";
			this.radio.checked = !this.radio.checked;
		}
		
		var brs = $A(document.getElementsByName(this.radio.name)).findAll( function (p) { return p.type == 'radio'; });
		brs.each(function(r) {r.changed()});
	};
	
	labels.each( function(l) {
		l.onclick = function() {
			$(this.htmlFor).img.onclick();
		}
	});
	
	par.insertBefore(img, r);
	r.hide();
}

function loadTabAndChecksElements() {
	var elements = $('content_inner').getElementsByClassName('tab_panel');
	elements.each( function(element) {
		loadTabElement(element);
	});
	
	elements = $('content_inner').getElementsByClassName('checks_panel');
	elements.each( function(element) {
		loadChecksElement(element);
	});
}

function loadTabElement(element) {
	element = $(element);
	var tabs = element.down().immediateDescendants();
	
	tabs.each( function(tab, i) {
		tab.down().onclick = tabElementOnClick(i);
	});
}

function loadChecksElement(element) {
	element = $(element);
	checks = $A(element.getElementsByTagName('input')).findAll( function (p) { return p.type == 'checkbox'; });
	var tabs = element.down().immediateDescendants();
	
	tabs.each( function(tab, i) {
		tab.down().onclick = checksElementOnClick(i);
	});
	
	//hide checkboxes and style the selected "tabs"
	checks.each( function(c) {
		c.hide();
		if(c.checked) {
			c.checked = false;
			c.up().onclick();
		}
	});
}

function tabElementOnClick(n) {
	function inner_function() {
		var ts = this.up().up().immediateDescendants();
		var cp = this.up().up().up().getElementsByClassName('tab_content_panel')[0];
		var ps = cp.immediateDescendants();
		
		//give all tabs the default style
		ts.each( function(t, i) {
			if(i) {
				t.className = "tab";
			} else { 
				//first element
				t.className = "tab none";
			}
		});
		
		//give this tab the right style
		if(n) {
			this.up().className = "tab act";
		} else { 
			//first element
			this.up().className = "tab act top";
		}
		
		//hide all content
		ps.each( function(p) {
			if(p.hasClassName('tab_content')) {
				p.hide();
			}
		});
		//show the right content
		ps[n].show();
		ps[n].setStyle({display:"block"});
		
		// refresh tab_content_shadow for IE (sucks)
		var sh = cp.getElementsByClassName("tab_content_shadow")[0];
		var par = sh.up();
		sh.remove();
		par.appendChild(sh);
	}
	
	return inner_function;
}

function checksElementOnClick(n) {
	function inner_function() {
		var ts = this.up().up().immediateDescendants();
		var cp = this.up().up().up().getElementsByClassName('tab_content_panel')[0];
		var ps = cp.immediateDescendants();
		
		//alert(this.up().hasClassName('sel'));
		
		//give this tab the right style
		if(!this.up().hasClassName('sel')) {
			if(n) {
				this.up().className = "tab sel";
			} else { 
				//first element
				this.up().className = "tab sel top";
			}
		} else {
			if(n) {
				this.up().className = "tab";
			} else { 
				//first element
				this.up().className = "tab none";
			}
		}
		
		cb = this.up().getElementsByTagName('input')[0];
		cb.checked = !cb.checked;
		
		
		//content stays the same
	}
	
	return inner_function;
}
