function newImage(src)
{
	if (!document.createElement) return false;
	var img = document.createElement('img');
	img.setAttribute('src', src);
	return img;
}

function swap()
{
	if (this.getAttribute('src') != this.mouseover.getAttribute('src')) {
		this.oldsrc = this.getAttribute('src');
		this.setAttribute('src', this.mouseover.getAttribute('src'));
	}
	else {
		this.setAttribute('src', this.oldsrc);
	}
}

function popitup(url, w, h, scrolling, wtitle)
{
	var winl = (screen.width - w) / 2;
	var wint = (screen.height - h) / 2;

    newwindow=window.open(url, wtitle,'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scrolling);
    if (window.focus) {newwindow.focus()}
    return false;
}

function showHelpText()
{
	var span = this.lastChild;
	span.style.display = "inline";
}
	
function hideHelpText()
{
	var span = this.lastChild;
	span.style.display = "none";
}

/* old

function createTooltip(text, fromtop, fromleft) {
	var span = document.createElement('span');
	span.style.top = fromtop + "px";
	
	if (fromleft == undefined) fromleft = 0;

	span.style.left = fromleft + "px";
	span.style.width = "200px";
	span.style.position = "absolute";
	span.innerHTML = text;
	
	return span;
}
*/

function createTooltip(text, fromtop, fromleft) {
	var span = document.createElement('span');
	span.style.top = fromtop + "px";
	
	if (fromleft == undefined) fromleft = 0;

	span.style.left = fromleft + "px";
	span.style.width = "200px";
	span.style.position = "absolute";
	span.style.display = "none";
	span.innerHTML = text;
	
	return span;
}

function init()
{
	if (!document.createElement) return;
	if (!document.getElementById) return;
	if (!document.getElementsByTagName) return;
	
	var container = document.getElementById('rollovers-container');
	
	if (container) {

		var items = container.getElementsByTagName('img');
		
		for (var i = 0; i < items.length; i++)
		{
			// find image
			var img = items[i];
			
			// skip active
			if (img.src.indexOf('-over.jpg') != -1) continue;
			
			// get filename
			var filename = img.src;
			
			var suffix = filename.substring(filename.lastIndexOf('.'));
			var preFilename = filename.substring(0,filename.lastIndexOf('.')) + "-over" + suffix;
			
			// create preload rollover property
			img.mouseover = newImage(preFilename);
			
			// attach mouse over events
			img.onmouseover = swap;
			img.onmouseout = swap;
		}
	}
	
	var colofon = document.getElementById('colofon');
	if (colofon) {
		colofon.onclick = function() {
			window.open('pdf/colofon.pdf');
		}	
	}
	
	var ibegeleiders = document.getElementById('instructie-begeleiders');
	if (ibegeleiders) {
		ibegeleiders.onclick = function() {
			window.open('pdf/Instructie-groepsleiding.pdf');
		}	
	}
	
	var ivraagstellen = document.getElementById('button-vraagstellen');
	if (ivraagstellen) {
		ivraagstellen.onclick = function() {
			window.location.href = 'index.php?p=contact-vraag';
		}	
	}
	
	var ifaq = document.getElementById('button-faq');
	if (ifaq) {
		ifaq.onclick = function() {
			window.open('pdf/faq.pdf');
		}	
	}
	
	var iverhaal = document.getElementById('button-verhaal');
	if (iverhaal) {
		iverhaal.onclick = function() {
			window.location.href = 'index.php?p=verhaal-lezen';
		}	
	}
	
	var ifilm = document.getElementById('button-film');
	if (ifilm) {
		ifilm.onclick = function() {
			popitup("film.html", 640, 495, "no", "film");
		}	
	}
	
	var hut = document.getElementById('ufo-hut');
	if (hut) {
		hut.appendChild(createTooltip("Bouw een hut", hut.firstChild.height));	

		hut.onmouseover = showHelpText;
		hut.onmouseout = hideHelpText;
	}
	
	var vogel = document.getElementById('ufo-vogel');
	if (vogel) {
		
		var fromtop = vogel.firstChild.height;
		fromtop -= 28;
		vogel.appendChild(createTooltip("Communicatie", fromtop, 20));	
		
		vogel.onmouseover = showHelpText;
		vogel.onmouseout = hideHelpText;
	}
	
	
	var veer = document.getElementById('ufo-veer');
	if (veer) {
		
		veer.appendChild(createTooltip("Het verhaal", veer.firstChild.height));	
		
		veer.onmouseover = showHelpText;
		veer.onmouseout = hideHelpText;
	
		veer.onmousedown = function() {
			window.location.href = "index.php?p=verhaal";	
		}
	}
	
	var vlot = document.getElementById('ufo-vlot');
	if (vlot) {
		
		var fromtop = vlot.firstChild.height;
		fromtop -= 25;
		vlot.appendChild(createTooltip("Bouw een vlot", fromtop, 2));	
		
		vlot.onmouseover = showHelpText;
		vlot.onmouseout = hideHelpText;
	}
	
	var schip = document.getElementById('ufo-schip');
	if (schip) {
		
		var fromtop = schip.firstChild.height;
		schip.appendChild(createTooltip("Opdrachten", fromtop, 2));	
		
		schip.onmouseover = showHelpText;
		schip.onmouseout = hideHelpText;
	}
}

window.onload = init;

//var FO = { movie:"swf/hut.swf", width:"200", height:"150", majorversion:"8", build:"0", xi:"true", wmode:"transparent"};
//UFO.create(FO, "ufo-hut");



//var FO = { movie:"swf/schip.swf", width:"300", height:"200", majorversion:"8", build:"0", xi:"true", wmode:"transparent"};
//UFO.create(FO, "ufo-schip");

//var FO = { movie:"swf/veer.swf", width:"177", height:"275", majorversion:"8", build:"0", xi:"true", wmode:"transparent"};
//UFO.create(FO, "ufo-veer");

//var FO = { movie:"swf/vlot.swf", width:"265", height:"200", majorversion:"8", build:"0", xi:"true", wmode:"transparent"};
//UFO.create(FO, "ufo-vlot");

//var FO = { movie:"swf/vogel.swf", width:"200", height:"200", majorversion:"8", build:"0", xi:"true", wmode:"transparent"};
//UFO.create(FO, "ufo-vogel");
