var sep = "[::]";

/* EVENTS */
function newEventListener(element,event,func,capture) {
	event = event.replace(/^on/i,"");
	if (element.addEventListener) element.addEventListener(event,func,capture); else 
	if (element.attachEvent) element.attachEvent('on'+event,func);
}
function getTargetElement(event) {
	if (event.originalTarget) return event.originalTarget;
	if (event.srcElement) return event.srcElement;
}
function getRelatedElement(event) {
	if (event.relatedTarget) return event.relatedTarget;
	if (event.toElement) return event.toElement;
}

/* BINDS */
function bind(func,object,args) {
	return function() { return func.apply(object,args); }
}
function bindAsEventListener(func,object,args) {
	return function(event) { return func.apply(object, [event].concat(args)); }
}

/* FILTERS */
function filterGroup(element) {
	this.element      = element;

	this.animDuration = 300;
	this.animFrames   = 15;
	this.animFrame    = 0;
	this.anim         = false;

	this.bHeight      = 0;
	this.eHeight      = 0;
	this.state        = 0;
}

filterGroup.prototype.slide = function(obj) {
	return function(){
		obj.animFrame++;
		var distance  = (obj.eHeight-obj.bHeight)/obj.animFrames;
		var newHeight = obj.bHeight+Math.floor((obj.animFrames-(15-obj.animFrame))*distance);
		obj.element.style.height = newHeight+"px";
		if (obj.animFrame == obj.animFrames) { clearInterval(obj.anim); obj.anim = false; }
	}
}

filterGroup.prototype.openclose = function() {
	// check if there's a filter animation in progress...
	var aip=false; for (i=0;i<fg.length;i++) if (fg[i].anim!==false) aip=true;
	if (!aip) {
		// close all groups
		for (i=0;i<fg.length;i++) if ((fg[i].state==1)&&(fg[i]!=this)) fg[i].openclose();
		// check for childs
		if (this.element.getElementsByTagName("li").length==0) return true;
		// if element has childs, animate & cancel default anchor action
		this.bHeight   = this.state==0?24:30+(this.element.getElementsByTagName("li").length * 20);
		this.eHeight   = this.state==1?24:30+(this.element.getElementsByTagName("li").length * 20);
		this.state     = 1-this.state;
		this.element.firstChild.style.background = this.state==0?"url(/siteimg/filters_bullet.gif) no-repeat 4px 11px":"url(/siteimg/filters_bullet_down.gif) no-repeat 6px 8px";
		this.animFrame = 0;
		this.anim      = setInterval(this.slide(this),this.animDuration/this.animFrames);
	}
	return false;
}

/* PRODUCTEN */
function ajax_getEnlargement(event,pid) {
	event=event?event:window.event;
	var request = new Ajax();
	request.request("/ajax/product_getenlargement.php","post",ajax_receiveEnlargement,{id:pid});
}
function ajax_receiveEnlargement(response) {
	blurOn();
	var pId  = response.split(sep)[0];
	var pkId = response.split(sep)[1];
	var html = response.split(sep)[2];
	var product     = document.getElementById("p"+pId);
	var enlargement = document.getElementById("enlargement");
	var productpage = document.getElementById("producten");
	enlargement.style.left = productpage.offsetLeft + product.offsetLeft+"px";
	enlargement.style.top  = productpage.offsetTop  + product.offsetTop+"px";
	enlargement.innerHTML  = html;
	enlargement.style.display = "block";
}
function hideEnlargement() {
	document.getElementById("enlargement").style.display = "none";
	blurOff();
}

function ajax_getColor(event,pid) {
	event=event?event:window.event;
	var request = new Ajax();
	request.request("/ajax/product_getcolor.php","post",ajax_receiveColor,{id:pid});
}
function ajax_receiveColor(response) {
	var pId  = response.split(sep)[0];
	var pkId = response.split(sep)[1];
	var html = response.split(sep)[2];
	var product = document.getElementById("p"+pId);
	product.innerHTML = html;
}

function basketAdd(pid) {
	var request = new Ajax();
	request.request("/ajax/stalenmand_add.php","post",finalizeBasket,{id:pid,sid:sessid});
}
function basketDel(pid) {
	var request = new Ajax();
	request.request("/ajax/stalenmand_del.php","post",finalizeBasket,{id:pid,sid:sessid});
}	
function finalizeBasket(response) {
	window.location="/bestellen/stalenmand";
}
function doNothing() {
}

/* CALCULATOR */
function Calculator() {
}
Calculator.prototype.on = function() {
	this.reset();
	var element = document.getElementById("calculator");
	element.style.display = "block";
	blurOn();
}
Calculator.prototype.off = function() {
	var element = document.getElementById("calculator");
	element.style.display = "none";
	blurOff();
}
Calculator.prototype.calculate = function() {
	this.w = parseFloat(document.getElementById("mwidth").value.replace(/[^0-9,\.]+/,"").replace(/,/,"."));
	this.l = parseFloat(document.getElementById("mlength").value.replace(/[^0-9,\.]+/,"").replace(/,/,"."));
	if (isNaN(this.w)) { alert("Ongeldige invoer"); return false; }
	if (isNaN(this.l)) { alert("Ongeldige invoer"); return false; }
	this.msquare      = this.w*this.l;
	this.msquare10p   = this.msquare/10;
	this.msquaretotal = this.msquare+this.msquare10p;
	document.getElementById("msquare").innerHTML      = this.msquare.toFixed(2)+" m&sup2;";
	document.getElementById("msquare10p").innerHTML   = this.msquare10p.toFixed(2)+" m&sup2;";
	document.getElementById("msquaretotal").innerHTML = this.msquaretotal.toFixed(2)+" m&sup2;";
}
Calculator.prototype.updateProduct = function() {
	if (this.element) {
		this.element.value = this.msquaretotal.toFixed(2);
		if (this.element.onchange) this.element.onchange();
	}
	this.off();
}
Calculator.prototype.cancel = function() {
	this.off();
}
Calculator.prototype.reset = function() {
	this.referenceId  = 0;
	this.w            = 0.00;
	this.l            = 0.00;
	this.msquare      = 0.00;
	this.msquare10p   = 0.00;
	this.msquaretotal = 0.00;
	document.getElementById("msquare").innerHTML = "0.00 m&sup2;";
	document.getElementById("msquare10p").innerHTML = "0.00 m&sup2;";
	document.getElementById("msquaretotal").innerHTML = "0.00 m&sup2;";
	document.getElementById("mwidth").value = "";
	document.getElementById("mlength").value = "";
}
Calculator.prototype.bindToInput = function(el) {
	this.element = el;
}
function saveM2(el,pid) {
	var request = new Ajax();
	request.request("/ajax/stalenmand_m2.php","post",doNothing,{id:pid,m2:el.value,sid:sessid});
}
function checkM2() {
	var inputs = document.getElementById("smitems").getElementsByTagName("input");
	for (var i=0; i<inputs.length; i++) if (!/[0-9\.,]+/.test(inputs[i].value)) { alert("U dient per tegel het aantal vierkante meters nog in te vullen"); return false; }
	return true;
}

/* FORMULIERVERZENDING */
function saveFormData() {	// werkt niet met google toolbar??
	var smform = new Array();
	smform['bedrijfsnaam']  = document.getElementById("bedrijfsnaam").value;
	smform['particulier']   = document.getElementById("particulier").checked;
	smform['aanhef']        = document.getElementById("aanhef").value;
	smform['voorletters']   = document.getElementById("voorletters").value;
	smform['tussenvoegsel'] = document.getElementById("tussenvoegsel").value;
	smform['achternaam']    = document.getElementById("achternaam").value;
	smform['straatnaam']    = document.getElementById("straatnaam").value;
	smform['huisnummer']    = document.getElementById("huisnummer").value;
	smform['toevoeging']    = document.getElementById("toevoeging").value;
	smform['postcode']      = document.getElementById("postcode").value;
	smform['woonplaats']    = document.getElementById("woonplaats").value;
	smform['telefoon']      = document.getElementById("telefoon").value;
	smform['email']         = document.getElementById("email").value;
	smform['opmerking']     = document.getElementById("opmerking").value;
	smform['sid']           = sessid;
	var request = new Sjax();
	request.request("/ajax/order_savenaw.php","post",doNothing,smform);
}

function ajax_sendOrder() {
	var request = new Ajax();
	request.request("/ajax/order_verzend.php","post",doNothing,{id:pid,m2:el.value,sid:sessid});
}

/* BLUR PANE */
function blurOn() {
	var blurpane = document.getElementById("blur");
	blurpane.style.display = "block";
	blurpane.style.height  = document.getElementById("wrapper").offsetHeight+"px";
}
function blurOff() {
	var blurpane = document.getElementById("blur");
	blurpane.style.display = "none";
}

/* GOOGLE MAPS */
var gm_dest = "Takkebijsters 70, 4817 BL, Breda";

function gm_placeMarker(point) {
	gm_map = new GMap2(document.getElementById("routedisplay"));
	gm_map.setCenter(new GLatLng(51.594735,4.825766),15);
	//if (!point) gm_map.setCenter(new GLatLng(51.594735,4.825766),15); else gm_map.setCenter(point,15);
	gm_map.addControl(new GMapTypeControl());
	gm_map.addControl(new GSmallMapControl());
	var gm_marker=new GMarker(point);
	gm_map.addOverlay(gm_marker);
	gm_marker.openInfoWindowHtml('<center><img src="/siteimg/gm_logo.gif" width="79" height="79" alt="TapijtTegelCentrale Nederland B.V." /></center>');
	gm_dir = new GDirections(gm_map, document.getElementById("routedescription"));
}

function gm_initialize() {
	if (GBrowserIsCompatible()) {
		gm_loc = new GClientGeocoder();
		gm_loc.getLatLng(gm_dest,gm_placeMarker);
	}
}

function gm_getRoute(fromAddress) {
	gm_dir.load("from: "+fromAddress+" to: "+gm_dest,{"locale":"nl_NL"});
}

/* INITIALIZE */
window.onload = function(){
	fg = new Array();
	var filterList = document.getElementById("filters").getElementsByTagName("ul")[0];
	var filterListItems = new Array(); for (i=0;i<filterList.childNodes.length;i++) if ((filterList.childNodes[i].tagName)&&(filterList.childNodes[i].tagName.toLowerCase()=="li")) filterListItems.push(filterList.childNodes[i]);
	for (i=0;i<filterListItems.length;i++) {
		fg[i] = new filterGroup(filterListItems[i]);
		filterListItems[i].firstChild.onclick = bind(fg[i].openclose,fg[i],[]);
	}
	if (document.getElementById("routedisplay")) gm_initialize();
}

var myCalc = new Calculator();