// JavaScript Document

function checkForm(f) {
	var formStatus = true;
	var firstErrorFormField = new Object();
	for(i=0;i<f.elements.length;i++) {
		if(f.elements[i].className.length>0) {
			// check an emailadres
			if(f.elements[i].className.indexOf('email')>-1) {
				if (!eval(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/.test(f.elements[i].value))) {
					if (formStatus==true) firstErrorFormField = f.elements[i];
					formStatus = false;
				}
			} else {
				if (f.elements[i].value.length<2) {
					if (formStatus==true) firstErrorFormField = f.elements[i];
					formStatus = false;
				}
			}
			
		}
	}
	if (formStatus==false) {
		firstErrorFormField.focus();
		alert('Het formulier kon nog niet worden verzonden omdat nog niet alle velden met een sterretje (*) correct zijn ingevuld.');
	}
	return formStatus;
}


function initToolbar() {
	document.getElementById('savebutton').style.display='inline';
}

function emailThisPage() {
	openPopupWindow('/site/logic/mail2friend.jsp?pageurl='+encodeURI(location.href)+'&pagetitle='+encodeURI(document.title));
}


function addToBasket() {
	openPopupWindow('/site/logic/favorites.jsp?mode=add&pageurl='+encodeURI(location.href)+'&pagetitle='+encodeURI(document.title));
}


function showBasket() {
	openPopupWindow('/site/logic/favorites.jsp');
}


function openPopupWindow(url) {
	if(document.all) {
		var w = 767;
	} else {
		var w = 769;
	}

	var x = (screen.width / 2) - (w / 2);
	var y = (screen.height / 2) - (750 / 2); // 550 was orgineel

	var new_win = window.open(url, "mbowijzer", "menubar=0, toolbar=0, scrollbars=1, resizable=1, scale=1, status=0, width=434 , height=500, left=" + x + ", top=" + y);
	new_win.focus();
	//new_win.moveTo(x, y);
}

var Filmpje = {};
Filmpje.toggle = function(code) {
	var button = document.getElementById("filmpje_button");
	var filmpje = document.getElementById("filmpje");
	button.className = (button.className == "bekijk_filmpje" ? "sluit_filmpje" : "bekijk_filmpje");
	if (button.className == "bekijk_filmpje") {
		filmpje.style.display = "";
		filmpje.src = "/leeg.html";
	}
	else {
		filmpje.style.display = "block";
        var url = "http://www2.yourfuture.tv/includes/Player.swf?canvasWidth=380&canvasHeight=305&dataid=" + escape(code) + "&siteUrl=http://www.mbowijzer.nl&partnerId=&partnerName=Shared";
		filmpje.src = url;
	}
};

// constructor
var BoekjeForm = function() {
	var form = document.getElementById("boekje_form");
	if (form) {
		BoekjeForm.customCheckBoxes(form);
	}
};

BoekjeForm.customCheckBoxes = function(form) {
	var inputs = form.getElementsByTagName("input");
	for (var i = inputs.length; i--;) {
		if (inputs[i].type == "checkbox") {
			BoekjeForm.customCheckBox(inputs[i]);
		}
	}
};

BoekjeForm.customCheckBox = function (input) {
	var replaceBox = document.createElement("a");
	replaceBox.className = "customCheckBox";
	BoekjeForm.changeHandler(input, replaceBox);
	
	replaceBox.onclick = function() { BoekjeForm.clickHandler(replaceBox, input); };
	input.parentNode.appendChild(replaceBox);
	
	input.className = "replacedCheckBox";
	input.onclick = function() { BoekjeForm.changeHandler(input, replaceBox); };
}

BoekjeForm.clickHandler = function(src, target) {
	target.checked = !target.checked;
	src.style.backgroundPosition = 	(target.checked ? "0 -30px" : "0 0");
	return false;
};

BoekjeForm.changeHandler = function(src, target) {
	// minimal timeout for IE
	window.setTimeout(function() {
		target.style.backgroundPosition = (src.checked ? "0 -30px" : "0 0");
	}, 0);
};

BoekjeForm.submit = function() {
	if (BoekjeForm.validate()) {
		document.getElementById("reciever").onload = function() {
			window.scrollTo(0,0);
			document.getElementById("bedankt").style.display = "block";
		}
		document.getElementById("reciever").onreadystatechange = function() {
			if (this.readyState == "complete") {
				window.scrollTo(0,0);
				document.getElementById("bedankt").style.display = "block";
			}
		}	
	}
	else return false;
};

BoekjeForm.validate = function() {
	var form = document.getElementById("boekje_form");
	var element, warningText;
	var boekjesCount = 0;
	
	var boekjeSelected = false;
	for (var i = 0; i < form.elements.length; i++) {
		element = form.elements[i];
		if (warningText) break;
		if (element.name == "boekje") {
			if (form.elements[i].checked) {
				boekjeSelected = true;
				boekjesCount++;
			}
			if (boekjesCount > 3) {
				warningText = "Je kunt per persoon maximaal 3 boekjes bestellen."
			}
		}
		switch (element.id) {
			case "naam":
			case "straat":
			case "huisnummer":
			case "plaats":
				if (element.value.replace(/^\s+|\s+$/, "") == "") {
					warningText = "Je bent vergeten je " + element.id + " in te vullen.";
				}
				break;
			case "postcode":
				if (!/^[0-9]{4} *[A-z]{2}$/.test(element.value)) {
					warningText = "Je hebt nog geen geldige postcode ingevuld.";
				}
				break;
			case "emailadres":
				if (!/^[^@]+@[^@]+\.[^@.]+$/.test(element.value)) {
					warningText = "Je hebt nog geen geldige e-mailadres ingevuld.";
				}
				break;
		}
	}
	if (!boekjeSelected) { warningText = "Je bent vergeten een boekje te selecteren."; }
	
	if (warningText) {
		BoekjeForm.showWarning(warningText);
		return false;
	}
	
	return true;
};

BoekjeForm.showWarning = function(warningText) {
	var warning = document.getElementById("warning");
	var offsetNode = document.getElementById("boekje_gegevens");
	var offset = 0;
	do {
		offset += offsetNode.offsetTop;
		offsetNode = offsetNode.offsetParent;
	} while (offsetNode);
	warning.style.top = offset - 40 + "px";
	warning.style.display = "block";
	
	warning.getElementsByTagName("p")[0].innerHTML = warningText;
};

(function() {
	var addEvent;
	var eventName = "load";
	if (window.addEventListener) {
		addEvent = function(eventName, handler) {
			window.addEventListener(eventName, handler, false);
		}
	}
	else {
		addEvent = window.attachEvent;
		eventName = "on" + eventName;
	}
	
	addEvent(eventName, function() {
		new BoekjeForm();
	});
})();