// site object
	var site = {};

	// md5
	var MD5 = function (string) { function RotateLeft(lValue, iShiftBits) {  return (lValue<<iShiftBits) | (lValue>>>(32-iShiftBits));  }  function AddUnsigned(lX,lY) {  var lX4,lY4,lX8,lY8,lResult;  lX8 = (lX & 0x80000000);  lY8 = (lY & 0x80000000);  lX4 = (lX & 0x40000000);  lY4 = (lY & 0x40000000);  lResult = (lX & 0x3FFFFFFF)+(lY & 0x3FFFFFFF);  if (lX4 & lY4) {  return (lResult ^ 0x80000000 ^ lX8 ^ lY8);  }  if (lX4 | lY4) {  if (lResult & 0x40000000) {  return (lResult ^ 0xC0000000 ^ lX8 ^ lY8);  } else {  return (lResult ^ 0x40000000 ^ lX8 ^ lY8);  }  } else {  return (lResult ^ lX8 ^ lY8);  }  }  function F(x,y,z) { return (x & y) | ((~x) & z); }  function G(x,y,z) { return (x & z) | (y & (~z)); }  function H(x,y,z) { return (x ^ y ^ z); }  function I(x,y,z) { return (y ^ (x | (~z))); }  function FF(a,b,c,d,x,s,ac) {  a = AddUnsigned(a, AddUnsigned(AddUnsigned(F(b, c, d), x), ac));  return AddUnsigned(RotateLeft(a, s), b);  };  function GG(a,b,c,d,x,s,ac) {  a = AddUnsigned(a, AddUnsigned(AddUnsigned(G(b, c, d), x), ac));  return AddUnsigned(RotateLeft(a, s), b);  };  function HH(a,b,c,d,x,s,ac) {  a = AddUnsigned(a, AddUnsigned(AddUnsigned(H(b, c, d), x), ac));  return AddUnsigned(RotateLeft(a, s), b);  };  function II(a,b,c,d,x,s,ac) {  a = AddUnsigned(a, AddUnsigned(AddUnsigned(I(b, c, d), x), ac));  return AddUnsigned(RotateLeft(a, s), b);  };  function ConvertToWordArray(string) {  var lWordCount;  var lMessageLength = string.length;  var lNumberOfWords_temp1=lMessageLength + 8;  var lNumberOfWords_temp2=(lNumberOfWords_temp1-(lNumberOfWords_temp1 % 64))/64;  var lNumberOfWords = (lNumberOfWords_temp2+1)*16;  var lWordArray=Array(lNumberOfWords-1);  var lBytePosition = 0;  var lByteCount = 0;  while ( lByteCount < lMessageLength ) {  lWordCount = (lByteCount-(lByteCount % 4))/4;  lBytePosition = (lByteCount % 4)*8;  lWordArray[lWordCount] = (lWordArray[lWordCount] | (string.charCodeAt(lByteCount)<<lBytePosition));  lByteCount++;  }  lWordCount = (lByteCount-(lByteCount % 4))/4;  lBytePosition = (lByteCount % 4)*8;  lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80<<lBytePosition);  lWordArray[lNumberOfWords-2] = lMessageLength<<3;  lWordArray[lNumberOfWords-1] = lMessageLength>>>29;  return lWordArray;  };  function WordToHex(lValue) {  var WordToHexValue="",WordToHexValue_temp="",lByte,lCount;  for (lCount = 0;lCount<=3;lCount++) {  lByte = (lValue>>>(lCount*8)) & 255;  WordToHexValue_temp = "0" + lByte.toString(16);  WordToHexValue = WordToHexValue + WordToHexValue_temp.substr(WordToHexValue_temp.length-2,2);  }  return WordToHexValue;  };  function Utf8Encode(string) {  string = string.replace(/\r\n/g,"\n");  var utftext = "";  for (var n = 0; n < string.length; n++) {  var c = string.charCodeAt(n);  if (c < 128) {  utftext += String.fromCharCode(c);  }  else if((c > 127) && (c < 2048)) {  utftext += String.fromCharCode((c >> 6) | 192);  utftext += String.fromCharCode((c & 63) | 128);  }  else {  utftext += String.fromCharCode((c >> 12) | 224);  utftext += String.fromCharCode(((c >> 6) & 63) | 128);  utftext += String.fromCharCode((c & 63) | 128);  }  }  return utftext;  };  var x=Array();  var k,AA,BB,CC,DD,a,b,c,d;  var S11=7, S12=12, S13=17, S14=22;  var S21=5, S22=9 , S23=14, S24=20;  var S31=4, S32=11, S33=16, S34=23;  var S41=6, S42=10, S43=15, S44=21;  string = Utf8Encode(string);  x = ConvertToWordArray(string);  a = 0x67452301; b = 0xEFCDAB89; c = 0x98BADCFE; d = 0x10325476;  for (k=0;k<x.length;k+=16) {  AA=a; BB=b; CC=c; DD=d;  a=FF(a,b,c,d,x[k+0], S11,0xD76AA478);  d=FF(d,a,b,c,x[k+1], S12,0xE8C7B756);  c=FF(c,d,a,b,x[k+2], S13,0x242070DB);  b=FF(b,c,d,a,x[k+3], S14,0xC1BDCEEE);  a=FF(a,b,c,d,x[k+4], S11,0xF57C0FAF);  d=FF(d,a,b,c,x[k+5], S12,0x4787C62A);  c=FF(c,d,a,b,x[k+6], S13,0xA8304613);  b=FF(b,c,d,a,x[k+7], S14,0xFD469501);  a=FF(a,b,c,d,x[k+8], S11,0x698098D8);  d=FF(d,a,b,c,x[k+9], S12,0x8B44F7AF);  c=FF(c,d,a,b,x[k+10],S13,0xFFFF5BB1);  b=FF(b,c,d,a,x[k+11],S14,0x895CD7BE);  a=FF(a,b,c,d,x[k+12],S11,0x6B901122);  d=FF(d,a,b,c,x[k+13],S12,0xFD987193);  c=FF(c,d,a,b,x[k+14],S13,0xA679438E);  b=FF(b,c,d,a,x[k+15],S14,0x49B40821);  a=GG(a,b,c,d,x[k+1], S21,0xF61E2562);  d=GG(d,a,b,c,x[k+6], S22,0xC040B340);  c=GG(c,d,a,b,x[k+11],S23,0x265E5A51);  b=GG(b,c,d,a,x[k+0], S24,0xE9B6C7AA);  a=GG(a,b,c,d,x[k+5], S21,0xD62F105D);  d=GG(d,a,b,c,x[k+10],S22,0x2441453);  c=GG(c,d,a,b,x[k+15],S23,0xD8A1E681);  b=GG(b,c,d,a,x[k+4], S24,0xE7D3FBC8);  a=GG(a,b,c,d,x[k+9], S21,0x21E1CDE6);  d=GG(d,a,b,c,x[k+14],S22,0xC33707D6);  c=GG(c,d,a,b,x[k+3], S23,0xF4D50D87);  b=GG(b,c,d,a,x[k+8], S24,0x455A14ED);  a=GG(a,b,c,d,x[k+13],S21,0xA9E3E905);  d=GG(d,a,b,c,x[k+2], S22,0xFCEFA3F8);  c=GG(c,d,a,b,x[k+7], S23,0x676F02D9);  b=GG(b,c,d,a,x[k+12],S24,0x8D2A4C8A);  a=HH(a,b,c,d,x[k+5], S31,0xFFFA3942);  d=HH(d,a,b,c,x[k+8], S32,0x8771F681);  c=HH(c,d,a,b,x[k+11],S33,0x6D9D6122);  b=HH(b,c,d,a,x[k+14],S34,0xFDE5380C);  a=HH(a,b,c,d,x[k+1], S31,0xA4BEEA44);  d=HH(d,a,b,c,x[k+4], S32,0x4BDECFA9);  c=HH(c,d,a,b,x[k+7], S33,0xF6BB4B60);  b=HH(b,c,d,a,x[k+10],S34,0xBEBFBC70);  a=HH(a,b,c,d,x[k+13],S31,0x289B7EC6);  d=HH(d,a,b,c,x[k+0], S32,0xEAA127FA);  c=HH(c,d,a,b,x[k+3], S33,0xD4EF3085);  b=HH(b,c,d,a,x[k+6], S34,0x4881D05);  a=HH(a,b,c,d,x[k+9], S31,0xD9D4D039);  d=HH(d,a,b,c,x[k+12],S32,0xE6DB99E5);  c=HH(c,d,a,b,x[k+15],S33,0x1FA27CF8);  b=HH(b,c,d,a,x[k+2], S34,0xC4AC5665);  a=II(a,b,c,d,x[k+0], S41,0xF4292244);  d=II(d,a,b,c,x[k+7], S42,0x432AFF97);  c=II(c,d,a,b,x[k+14],S43,0xAB9423A7);  b=II(b,c,d,a,x[k+5], S44,0xFC93A039);  a=II(a,b,c,d,x[k+12],S41,0x655B59C3);  d=II(d,a,b,c,x[k+3], S42,0x8F0CCC92);  c=II(c,d,a,b,x[k+10],S43,0xFFEFF47D);  b=II(b,c,d,a,x[k+1], S44,0x85845DD1);  a=II(a,b,c,d,x[k+8], S41,0x6FA87E4F);  d=II(d,a,b,c,x[k+15],S42,0xFE2CE6E0);  c=II(c,d,a,b,x[k+6], S43,0xA3014314);  b=II(b,c,d,a,x[k+13],S44,0x4E0811A1);  a=II(a,b,c,d,x[k+4], S41,0xF7537E82);  d=II(d,a,b,c,x[k+11],S42,0xBD3AF235);  c=II(c,d,a,b,x[k+2], S43,0x2AD7D2BB);  b=II(b,c,d,a,x[k+9], S44,0xEB86D391);  a=AddUnsigned(a,AA);  b=AddUnsigned(b,BB);  c=AddUnsigned(c,CC);  d=AddUnsigned(d,DD);  }  var temp = WordToHex(a)+WordToHex(b)+WordToHex(c)+WordToHex(d);  return temp.toLowerCase();  }  
	
	// request function
	function request(plugin,parameters,handler){
		var pars = {};
		pars[plugin] = parameters;
		new Ajax.Request('/json.php',{
		    method:'post',
			parameters: {json: $H(pars).toJSON()},
		    onSuccess: function(transport,json){
				handler(transport,json[plugin],json)
			}
		});
	}
	
	// d
	function d(m){console.log(m)}
	function dd(m){console.dir(m)}
	
	/* protoload 0.1 beta by Andreas Kalsch
	 * last change: 09.07.2007
	 *
	 * This simple piece of code automates the creating of Ajax loading symbols.
	 * The loading symbol covers an HTML element with correct position and size - example:
	 * $('myElement').startWaiting() and $('myElement').stopWaiting()
	 */
	 
	Protoload = {
		// the script to wait this amount of msecs until it shows the loading element
		timeUntilShow: 250,
		
		// opacity of loading element
		opacity: 0.8,
	
		// Start waiting status - show loading element
		startWaiting: function(element, className, timeUntilShow) {
			if (typeof element == 'string')
				element = document.getElementById(element);
			if (className == undefined)
				className = 'waiting';
			if (timeUntilShow == undefined)
				timeUntilShow = Protoload.timeUntilShow;
			
			element._waiting = true;
			if (!element._loading) {
				var e = document.createElement('div');
				(element.offsetParent || document.body).appendChild(element._loading = e);
				e.style.position = 'absolute';
				try {e.style.opacity = Protoload.opacity;} catch(e) {}
				try {e.style.MozOpacity = Protoload.opacity;} catch(e) {}
				try {e.style.filter = 'alpha(opacity='+Math.round(Protoload.opacity * 100)+')';} catch(e) {}
				try {e.style.KhtmlOpacity = Protoload.opacity;} catch(e) {}
				
				/*var zIndex = 0;
				if (window.UI)
					if (UI.zIndex)
						zIndex = ++UI.zIndex;
				if (!zIndex)
					zIndex = ++Protoload._zIndex;
				e.style.zIndex = zIndex;*/
			}
			element._loading.className = className;
			window.setTimeout((function() {
				if (this._waiting) {
					var left = this.offsetLeft, 
						top = this.offsetTop,
						width = this.offsetWidth,
						height = this.offsetHeight,
						l = this._loading;
						
					l.style.left = left+'px';
					l.style.top = top+'px';
					l.style.width = width+'px';
					l.style.height = height+'px';
					l.style.display = 'inline';
				}
			}).bind(element), timeUntilShow);
		},
		
		// Stop waiting status - hide loading element
		stopWaiting: function(element) {
			if (element._waiting) {
				element._waiting = false;
				element._loading.parentNode.removeChild(element._loading);
				element._loading = null;
			}
		}/*,
		
		_zIndex: 1000000*/
	};
	
	if (Prototype) {
		Element.addMethods(Protoload);
		Object.extend(Element, Protoload);
	}
	/* */	
	Event.observe(window, 'load', function(){
		
		$$('a.open-in-new-window').each(function(a){
			a.target = '_blank';
		});
		
		if ($$('.next')[0]) {
			$$('.next')[0].show();
		}
		
	});



/* aform */


    var fields = {};

    document.observe('dom:loaded', function() {

        // only go on with an aform present
        if($$('.aform').length == 0)
            return;

        // shorthand, one form for starters
        var form = $$('.aform')[0];
        var form_id = form.select('input[name=form_id]')[0].value;

        // make the submit validate
        form.observe('submit',function(event){
            event.stop();
            form.fire('aform:validate');
        });

        // make enter validate
        form.select('input[type=text]').invoke('observe','keypress',function(event){
            form.fire('submit');
//          if(event.keyCode == Event.KEY_RETURN)
//              form.fire('aform:validate');
        });

        // single validates
        form.select('input').invoke('observe','focus',function(event){

            // skip perhaps?
            if(!this.hasClassName('instant_validation'))
                return;

            // otherwise validate it
            request('aform',{
                action: 'validate-single',
                name: this.name,
                value: this.value,
                form_id: form_id
            },function(json,errors){
                validationResults(this.name,errors);
            }.bind(this));
        });

        // on prev or next, handle the verification, ajax style
        form.observe('aform:validate',function(event){

            // send the reuqest to validate and the values over
            request('aform',{
                action: 'validate',
                values: form.serialize(true)
            },function(request,json){

                // error flag
                var has_errors = false;

                // go markup!
                json.fields.each(function(field){
                    if(validationResults(field.name,field.errors))
                        has_errors = true;
                });

                // go through?
                if (!has_errors)
                    form.submit();
            });
        });

        function validationResults(fieldname,errors){

            // container and error flag
            // remove the error class
            var container = $$('tbody.'+fieldname)[0];
            container.removeClassName('error');
            var has_errors = false;

            // get the feedback div, make it emtpy
            var feedback = container.select('.feedback')[0];
            feedback.childElements().invoke('remove');

            // are there errors? add the errors to the feedback container
            errors.each(function(error){

                // update the flag
                has_errors = true;

                // add the error div
                var line = new Element('div');
                feedback.insert(line);
                line.update(error);

                // mark the input
                container.addClassName('error');
            });

            return has_errors;
        }


    });

/* cart */


    document.observe('dom:loaded', function() {

        /* related to session lifetime */

        // insert a hidden div into the document
        document.body.appendChild(new Element('div',{id:'cart-keep-session-alive',style:'display:none'}));

        // add a periodical updater that updates that div
        new Ajax.PeriodicalUpdater('cart-keep-session-alive', '/json.php', {frequency: 60});

    /* related to navigation */

        // on the overview page (step 1) make sure that the cart is not empty and that the payment method is chosen
        if ($('order')) {
            $$('.cart-prev-next-button.next')[0].observe('click',function(event){

                // stop the event
                event.stop();

                var nextLocation = this.href;

                // is cart empty?
                if($('order-empty').visible()){
                    alert('U winkelwagen is leeg.')
                }

                // define payment method
                var paymentMethodChosen = false;

                // order-payment-method
                $$('.order-payment-method').each(function(select){

                    if (select.checked) {
                        paymentMethodChosen = true;

                        request('cart',{
                            action: 'order-change-payment-method',
                            method: select.value
                        },function(request,json){

                            if (json.feedback == 'success') {

                               window.location.href = nextLocation;
                            }
                        });
                    }
                });

                // no payment method?
                if (paymentMethodChosen === false) {
                    alert('U moet nog een betaalmethode selecteren.');
                }
            });
        }

        // on the personal data page (step 2) make sure the navigation doesnt deliver untill the form is properly filled out
        // make sure to overwrite the form action with the proper location the naviagtion button points to
        if($('cart-personal')){

            $$('.cart-prev-next-button').invoke('observe','click',function(event){

                // stop the event, let the form javascript handle submission
                // only stop on 'next'
                if (this.hasClassName('next')) {
                    event.stop();

                    // take the link href as new action for the form and then trigger a validation
                    var form = $$('.aform')[0];
                    form.action = event.element().href;
                    form.fire('aform:validate');
                }
            });
        }

    /* related to order overview */

        // remove whole lines
        $$('.order-remove-line').each(function(a){
            a.observe('click',function(event){

                // cancel the event
                event.stop();

                // display a waiting message
                a.update('moment...');

                // send the change
                request('cart',{
                    action:     'order-remove-line',
                    line:       a.readAttribute('line')
                },function(request,json){

                    // this was the last line? or is our session expired for whatever reason?
                    if(json.feedback == 'empty'){
                        cart_display_empty_message();
                        return;
                    }
                    if(json.feedback == 'expired'){
                        cart_display_expired_message();
                        return;
                    }

                    // remove the row
                    a.up('tbody').remove();
                    update_totals(json);
             });
        });
        });

        // change quantities
        $$('.order-change-quantity').each(function(s){
            s.observe('change',function(event){

                // send the change
                request('cart',{
                    action:     'order-change-quantity',
                    line:       s.readAttribute('line'),
                    quantity:   s.getValue()
                },function(request,json){

                    // is our session expired for whatever reason?
                    if(json.feedback == 'expired'){
                        cart_display_expired_message();
                    }

                    //alert(s.getValue());
                    
                    // get the table row body
                    var tbody = s.up('tbody');

                    //alert(make_price(json.price));

                    // update
                    //tbody.highlight(); //REMOVED BECAUSE IT BREAKS THE SCRIPT
                    //tbody.select('.price')[0].update(make_price(json.price)); //REMOVED BECAUSE IT DOES NOTHING
                    tbody.select('.total')[0].update(make_price(json.total));
                    update_totals(json);
                });
            });
        });

        $$('.order-payment-method').each(function(s){
            //s.observe('cart:payment-method-change',function(event){
        	
        	// positionize price on load
        	if (s.checked == true){
        		positionizePaymentPrice(s.value);
        	}
        	
        	s.observe('mousedown',function(event){
                // send the change
                request('cart',{
                    action: 'order-change-payment-method',
                    method: s.value
                },function(request,json){

                    // is our session expired for whatever reason?
                    if(json.feedback == 'expired')
                        cart_display_expired_message();

                    // get the table row body
                    var tbody = s.up('tbody');

                    // update
                    //tbody.highlight();
                    update_totals(json);
                      
                });
                positionizePaymentPrice(s.value);  
        		
            });
            
        });
        
        

/*
        // replace selectbox with something more stylable
        // also remove the null option after a something is selected
        $$('select.replace').each(function(select){

            // hide original
            select.hide();

            // create
            var container = new Element('div', {
                'class': 'replaced-select-container'
            });
            var trigger = new Element('div', {
                'class': 'replaced-select-trigger'
            });
            var options = new Element('div', {
                'class': 'replaced-select-options',
                style: 'display:none'
            });

            // insert
            $(select.parentNode).insert(container);
            container.insert(trigger);
            container.insert(options);

            // trigger
            trigger.update('kies');
            trigger.observe('click',function(event){
                options.toggle();
            });

            // for all the options of the original select
            select.select('option').each(function(oldOption){

                // create an element to represent the original option,
                // put in the proper text and insert it
                var option = new Element('div',{'class':'replaced-select-option'});
                option.value = oldOption.value;
                option.update(oldOption.readAttribute('description') !== null ? oldOption.readAttribute('description') : oldOption.innerHTML);
                options.insert(option);

                // was it selected? if so, add the proper class to the new option, remove the null option and update the trigger
                if (oldOption.selected) {
                    option.addClassName('selected');
                    trigger.update(option.innerHTML);
                    options.select('.replaced-select-option')[0].hide();
                }

                // on click set the trigger text to the option text
                // and update the value of the old select as well
                option.observe('click',function(event){

                    // selected
                    options.select('.replaced-select-option').invoke('removeClassName','selected');
                    option.addClassName('selected');

                    // update the trigger and the original field
                    trigger.update(option.innerHTML);
                    select.value = option.value;
                    select.fire('cart:payment-method-change')
                    options.hide();
                });
            });
        });
    });
    */
   });


    function positionizePaymentPrice(method){
    	if (method == 'contant-magazijn'){
			paddingtop = '37px';
		}else if (method == 'transfer'){
			paddingtop = '77px';
		}else if (method == 'rembours'){
			paddingtop = '125px';
		}else if (method == 'ideal'){
			paddingtop = '176px';
		}
		$('payment-method-price').setStyle({
			 paddingTop: paddingtop
		});
    }
    
    function update_totals(json){

        // delivery costs
        $('payment-method-price').update(make_price(json.payment_method_costs));

        // grand total
        $$('.total-grand')[0].update(make_price(json.total_grand));

        // vats
        for(percentage in json.total_vats){
            if($$('.vat'+percentage)[0]){
                $$('.vat'+percentage)[0].update(make_price(json.total_vats[percentage]));
            }
        }

    }

    function make_price(price){
        return '&euro;&nbsp;'+price.toFixed(2).replace('.',',');
    }


    function cart_display_empty_message(){
        $('order').hide();
        $('order-empty').show();
    }

    function cart_display_expired_message(){
        $('order').hide();
        $('order-expired').show();
    }

    // d
    function d(m){console.log(m)}
    function dd(m){console.dir(m)}

/* Landing */

Event.observe(window, 'load', function(){
        
        
    /* landing page caluclations */
    
        if (!$('landing-offer2')) 
            return
        
        
            [$('unit-meters'), $('unit-rolls')].invoke('observe', 'keyup', calc);
            function calc(){
                $('unit-feedback').update('');
                
                ///////////////////////////////////////////////////var c = $('color-choice').getValue();
                
                var r = ($('type').getValue() == 'rollo') ? ($('unit-meters').getValue() * 6.9 + $('unit-rolls').getValue() * 6 * 50) : ($('unit-meters').getValue() * 8 + $('unit-rolls').getValue() * 6.8 * 30);

                // min 5 meters
                if (($('unit-meters').getValue() || $('unit-rolls').getValue()) && $('unit-meters').getValue() < 5 && $('unit-rolls').getValue() < 1) {
                    r = ($('type').getValue() == 'rollo') ? (5 * 6.9) : (5 * 8);
          $('unit-feedback').update('De minimale afname bedraagt 5 meter');
          //$('unit-meters').value = 5;
                }
                                                
                $('calculation-result').update(r.toFixed(2).replace('.', ','));
                
                // incl. vat (value added taxes) and perhaps delivery
                
                var r2 = (r * 1.19) + (($F('paytype') == 'rembours' || $F('paytype') == 'vooruit_en_bezorgen') ? 53.55 : 0);
                $('calculation-result-steptwo').update(r2.toFixed(2).replace('.', ','));
                $('calculation-result-total').value = (r2.toFixed(2).replace('.', ','));
            }
            calc();
            
            /* landing page conditionals 
     
     $('type').observe('change',function(){
     if($F('type') == 'Rollo'){
     $('color-rollo').show();
     $('color-podium').hide();
     }
     else{
     $('color-rollo').hide();
     $('color-podium').show();
     }
     });
     */
            //Kleurselectie
            $('b3001').observe('click', function(){
                $('color-result').update('Ral #3001 (rood)');
                $('color-choice').value = ('Ral #3001 (rood)');
            })
            
            $('b5002').observe('click', function(){
                $('color-result').update('Ral #5002 (blauw)');
                $('color-choice').value = ('Ral #5002 (blauw)');
            })
            
            $('b4003').observe('click', function(){
                $('color-result').update('Ral #4003 (roze)');
                $('color-choice').value = ('Ral #4003 (roze)');
            })
            
            $('b9011').observe('click', function(){
                $('color-result').update('Ral #9011 (zwart)');
                $('color-choice').value = ('Ral #9011 (zwart)');
            })
            
            $('b2099').observe('click', function(){
                $('color-result').update('Ral #2099 (oranje)');
                $('color-choice').value = ('Ral #2099 (oranje)');
            })

            $('b2603').observe('click', function(){
                $('color-result').update('Pms #2603 (paars)');
                $('color-choice').value = ('Pms #2603 (paars)');
            })
            
            $('b6029').observe('click', function(){
                $('color-result').update('Ral #6029 (groen)');
                $('color-choice').value = ('Ral #6029 (groen)');
            })

            $('a3001').observe('click', function(){
                $('color-result').update('Ral #3001 (rood)');
                $('color-choice').value = ('Ral #3001 (rood)');
            })
            
            $('a5002').observe('click', function(){
                $('color-result').update('Ral #5002 (blauw)');
                $('color-choice').value = ('Ral #5002 (blauw)');
            })
            
            $('a9011').observe('click', function(){
                $('color-result').update('Ral #9011 (zwart)');
                $('color-choice').value = ('Ral #9011 (zwart)');
            })

            $('a6029').observe('click', function(){
                $('color-result').update('Ral #6029 (groen)');
                $('color-choice').value = ('Ral #6029 (groen)');
            })
            
            
            // Display correct colors
            $('type').observe('change', calc_1);
            function calc_1(){
                if ($F('type')) {
                    if ($F('type') == 'rollo') {
                        $('color-rollo').show();
                        $('color-podium').hide();
                        $('color-result').update('');
                        $$('tr.partone_color').invoke('show');
                    }
                    else {
                        $('color-rollo').hide();
                        $('color-podium').show();
                        $('color-result').update('');
                    }
                    $$('tr.partone').invoke('show');
                    $('container_parttwo').show();
                    
                }
                else {
                    //$$('tr.partone').invoke('hide');
                    //$('container_parttwo').hide();
                    //$$('tr.partone_color').invoke('hide');
                    $('color-podium').hide();
                    $('color-rollo').hide();
                }
                calc();
            }
            calc_1();
            
            
            //Weergeven juiste bestelopties
            $('paytype').observe('change', function(){
                
                if (!$('unit-meters').getValue() && !$('unit-rolls').getValue()){
                    alert('U heeft nog geen afname hoeveelheid geselecteerd! De minimale afname hoeveelheid is 5 meter.');
                    $('paytype').value = 0;
                }
                
                if ($F('paytype') == 'rembours' || $F('paytype') == 'vooruit_en_bezorgen') {
                    $('location').show();
                    $('date').show();
                    $('pickup').hide();
                    $('remarks').update('Prijs incl. verzendkosten en incl. BTW.');
                    $('remarkvalue').value = ('Prijs incl. verzendkosten en incl. BTW.');
                }
                
                else 
                    if ($F('paytype') == 'contant') {
                        $('pickup').show();
                        $('location').hide();
                        $('date').hide();
                    }
                calc();
            });
            
            
            
            $('paytype').observe('change', function(){
                if ($F('paytype') == 'rembours') {
                    $('remarks2').update('Graag gepast betalen bij afleveren aan de chauffeur');
                    $('remarkvalue2').value = ('Graag gepast betalen bij afleveren aan de chauffeur');
                }
                else 
                    if ($F('paytype') == 'vooruit_en_bezorgen') {
                        $('remarks2').update('Levering vind plaats na bijschrijving van uw betaling op rekeningnummer 65.47.64.352 ten name van Tanja Verhuur - ING Zuidlaren.');
                        $('remarkvalue2').value = ('Levering vind plaats na bijschrijving van uw betaling op rekeningnummer 65.47.64.352 ten name van Tanja Verhuur - ING Zuidlaren.');
                    }
                    else {
                        $('remarks2').update('');
                        $('remarkvalue2').value = ('');
                        $('remarks').update('Prijs incl. BTW.');
                        $('remarkvalue').value = ('Prijs incl. BTW.');
                    }
            });
            
            
            // display order form
            if ($('place-order-landing')) {
                $('place-order-landing').observe('click', function(){
                    $('container_part_three').show();
                })
            }
            
        
        $('landing-offer2').observe('submit',function(event){
                        
            if($('paytype').value == '0')
                event.stop();
            
            if (($('unit-meters').getValue() || $('unit-rolls').getValue()) && $('unit-meters').getValue() < 5 && $('unit-rolls').getValue() < 1) {
                event.stop();
                r = ($('type').getValue() == 'rollo') ? (5 * 6.9) : (5 * 8);
                $('unit-feedback').update('De minimale afname bedraagt 5 meter');
            }
        });
        





        //Flash op landing page
//      var so = new SWFObject('/files/layout/champagne2.swf', 'abracadabra', '240', '220', '6', '#EEEEEE');
//      so.write('champagne');

    });

/* Protoload */

/* protoload 0.1 beta by Andreas Kalsch
 * last change: 09.07.2007
 *
 * This simple piece of code automates the creating of Ajax loading symbols.
 * The loading symbol covers an HTML element with correct position and size - example:
 * $('myElement').startWaiting() and $('myElement').stopWaiting()
 */
 
Protoload = {
	// the script to wait this amount of msecs until it shows the loading element
	timeUntilShow: 250,
	
	// opacity of loading element
	opacity: 0.8,

	// Start waiting status - show loading element
	startWaiting: function(element, className, timeUntilShow) {
		if (typeof element == 'string')
			element = document.getElementById(element);
		if (className == undefined)
			className = 'waiting';
		if (timeUntilShow == undefined)
			timeUntilShow = Protoload.timeUntilShow;
		
		element._waiting = true;
		if (!element._loading) {
			var e = document.createElement('div');
			(element.offsetParent || document.body).appendChild(element._loading = e);
			e.style.position = 'absolute';
			try {e.style.opacity = Protoload.opacity;} catch(e) {}
			try {e.style.MozOpacity = Protoload.opacity;} catch(e) {}
			try {e.style.filter = 'alpha(opacity='+Math.round(Protoload.opacity * 100)+')';} catch(e) {}
			try {e.style.KhtmlOpacity = Protoload.opacity;} catch(e) {}
			
			/*var zIndex = 0;
			if (window.UI)
				if (UI.zIndex)
					zIndex = ++UI.zIndex;
			if (!zIndex)
				zIndex = ++Protoload._zIndex;
			e.style.zIndex = zIndex;*/
		}
		element._loading.className = className;
		window.setTimeout((function() {
			if (this._waiting) {
				var left = this.offsetLeft, 
					top = this.offsetTop,
					width = this.offsetWidth,
					height = this.offsetHeight,
					l = this._loading;
					
				l.style.left = left+'px';
				l.style.top = top+'px';
				l.style.width = width+'px';
				l.style.height = height+'px';
				l.style.display = 'inline';
			}
		}).bind(element), timeUntilShow);
	},
	
	// Stop waiting status - hide loading element
	stopWaiting: function(element) {
		if (element._waiting) {
			element._waiting = false;
			element._loading.parentNode.removeChild(element._loading);
			element._loading = null;
		}
	}/*,
	
	_zIndex: 1000000*/
};

if (Prototype) {
	Element.addMethods(Protoload);
	Object.extend(Element, Protoload);
}
/* */

/* Users */


	// config
	var CONTAINER_FOR_LOGIN = 'dealer-login';
	
	// some variables from php
	site.user = {};
	site.user.id = 0;
	site.user.name = '';
	site.user.login_challenge = 'e3a9563697143adb9f63e98a1f963377';

	// reset password page
	document.observe("dom:loaded", function(){
				
		// actual password resetting form
		if($('users-reset-password')){
			
			// create the form
			var users_reset_password = $('users-reset-password');
			users_reset_password.update(
				'<form>'+
				'	<p>Voer hieronder uw nieuwe wachtwoord twee keer in. Zorg ervoor dat uw nieuwe wachtwoord tussen de 6 en 15 karakters bevat.</p>'+
				'	<p class="feedback"></p>'+
				'	<p><input type="password" class="input-password" /><br />'+
				'	<input type="password" class="input-password" /></p>'+
				'	<input type="submit" value="verander" class="input-button" />'+
				'</form>'			
			);
			
			// various references
			var password1 = users_reset_password.select('input')[0];
			var password2 = users_reset_password.select('input')[1];
			var users_reset_password_form = users_reset_password.select('form')[0];
			
			// focus on first field
			password1.focus();		
			
			// submit	
			users_reset_password_form.observe('submit',function(event){
				event.stop();
				users_reset_password.startWaiting();
				request('users',{
					action: 'reset-password',
					hash: location.href.split('/').last(),
					password1: password1.value,
					password2: password2.value
				},function(transport,json){
					var users_reset_password_feedback = users_reset_password.select('.feedback')[0];
					users_reset_password.stopWaiting();
					password1.clear();
					password2.clear();						
					password1.focus();					
					users_reset_password_feedback.addClassName('error');					

					if (json.feedback == 'hash-format-invalid')
						users_reset_password_feedback.update('Er is iets mis met het adres van deze pagina. Heeft u het volledige adres ingetypt?');						
					else if (json.feedback == 'hash-invalid')
						users_reset_password_feedback.update('Deze pagina is niet meer geldig, u heeft deze reeds een keer gebruikt voor het veranderen van uw wachtwoord.');												
					else if (json.feedback == 'password-format-invalid')
						users_reset_password_feedback.update('De opgegeven wachtwoorden bevatten ongeldige karakters of zijn niet tussen de 6 en 15 karakters lang. Gebruik alleen letters en cijfers.');
					else if(json.feedback == 'passwords-do-not-match')
						users_reset_password_feedback.update('De opgegeven wachtwoorden zijn niet gelijk. Voert u ze nogmaals in.');
					else if(json.feedback == 'success'){
						users_reset_password_feedback.update('Wachtwoord successvol veranderd. U kunt uw nieuwe wachtwoord nu gebruiken om in te loggen. Over enkele seconden gaat u automatisch naar de homepage. Wilt u niet wachten, klik dan <a href="/">hier</a>.');
						users_reset_password_feedback.addClassName('success');
						users_reset_password_feedback.removeClassName('error');
						users_reset_password_form.disable();
						window.setTimeout(function(){window.location.href = '/'},6000);
					}

				});				
			});
			
		}
		
	});
	
	// normal login
	document.observe("dom:loaded", function(){

		if (!$('dealer-login')) 
			return
		
		// login container, will be the host for the login and password reset forms
		var login_container = new Element('div',{'class':'login'});
		$(CONTAINER_FOR_LOGIN).insert(login_container);

		// is there someone logged in?
		if(site.user.id){

			// logout form
			login_container.update('Ingelogd als '+site.user.name+' | <a href="#">uitloggen</a><form method="post" style="display: none;"><input name="user[login][logout]" value="1" type="hidden" /></form><div style="display: none;"></div>');
			
			// logout link, will logout via ajax call, then refresh the page
			login_container.select('a')[0].observe('click',function(e){
				e.stop();
				request('users',{action: 'logout'}, function(transport,json){window.location.href = '/';});
			});
			
			// keep the session alive
			// new Ajax.PeriodicalUpdater($('user-login').select('.keep-alive')[0], '/json.php', {parameters:{json:$H({request:'keep-alive'}).toJSON()},frequency: 60});

		}
		else{

			// create the trigger that will show the loginform
			var login_trigger = new Element('div',{'class':'login-trigger'}).update('Dealer login');
			login_trigger.observe('click',function(event){
				if (login_form.visible()) {
					login_form.fade();
					this.removeClassName('unfolded');
				}
				else if (!login_password_reset.visible()) {
					login_form.appear({afterFinish: function(){login_form_email.focus()}});
					this.addClassName('unfolded');					
				}
			});
			login_container.insert(login_trigger);
			
			// create the login form and put it in the container
			var login_form = new Element('form',{'class':'login-form'}).hide().update(
				'	<p class="feedback">Om in te loggen voert u hieronder uw emailadres en wachtwoord in.</p>'+
				'	<p>gebruikersnaam:<br />'+
				'	<input type="text" class="input-text" /></p>'+
				'	<p>wachtwoord:<br />'+					
				'	<input type="password" class="input-password" /></p>'+
				'	<p><input type="submit" value="inloggen" class="input-button" /></p>'+
				'	<p><a href="#">wachtwoord vergeten?</a></p>'
			);
			login_container.insert(login_form);
			
			// various references
			var login_form_feedback 	= login_form.select('.feedback')[0];
			var login_form_email 		= login_form.select('.input-text')[0];
			var login_form_password 	= login_form.select('.input-password')[0];

			// catch submit
			login_form.observe('submit',function(event){
				event.stop();
				login_form.startWaiting();
				request('users',{
					action: 'login',
					email: login_form_email.value,
					password: MD5(MD5(login_form_password.value)+site.user.login_challenge)
				},function(transport,json){
					login_form.stopWaiting();	
					if (json.feedback == 'success') {
						window.location.href = '/dealers.html';
					}else if (json.feedback == 'invalid-format' || json.feedback == 'invalid-combination') {
						login_form_feedback.addClassName('error');
						login_form_feedback.update('U heeft een ongeldige combinatie ingevoerd. Probeert u het nog een keer.');
						login_form_password.select();
					}		
				})	
			});
			
			// forgot password link
			login_form.select('a')[0].observe('click',function(event){
				event.stop();
				login_form.fade({
					afterFinish: function(){
						login_password_reset.appear({
							afterFinish: function(){login_password_reset_email.focus()}
						});
					}
				});
			});			
			
			// password reset
			var login_password_reset = new Element('form',{'class':'login-password-reset'}).hide().update(
				'<p class="feedback">Geef hier uw emailadres op en wij sturen u een nieuw wachtwoord:</p>'+
				'<p>email adres:<br />'+
				'<input type="text" class="input-text" id="user-login-name" name="user[login][name]" /></p>'+
				'<p><input type="submit" value="verstuur" class="input-button" /></p>'+
				'<p><a href="#">(annuleren)</a></p>'
			);	
			login_container.insert(login_password_reset);
			
			// various references
			var login_password_reset_feedback = login_password_reset.select('.feedback')[0];
			var login_password_reset_email = login_password_reset.select('input')[0];
			
			// submit
			login_password_reset.select('a')[0].observe('click',function(event){
				event.stop();
				login_password_reset.fade();
				login_trigger.removeClassName('unfolded');
			});	
			
			// reset link clicked
			login_password_reset.observe('submit',function(event){
				event.stop();
				login_password_reset.startWaiting();
				request('users',{
					action: 'reset-password-request',
					email: login_password_reset_email.value
				},function(transport,json){
					login_password_reset.stopWaiting();
					if (json.feedback == 'no-such-user') {
						login_password_reset_feedback.update('Geen gebruiker met dit email adres gevonden.');
						login_password_reset_feedback.addClassName('error');
						login_password_reset_feedback.removeClassName('success');
						login_password_reset_email.select();
					}else if(json.feedback == 'password-mailed'){
						login_password_reset_feedback.update('Mail verstuurd naar <em>'+login_password_reset_email.value+'</em>. Deze komt waarschijnlijk binnen &eacute;&eacute;n minuut aan en bevat verdere instructies.');
						login_password_reset_feedback.removeClassName('error');
						login_password_reset_feedback.addClassName('success');						
					}
					
				})
			});						
		}

	});


/* xintranet */

	
		document.observe('dom:loaded', function() {
						
			$$('.dealer-product').each(function(s){
							
				if(!s.select('.dealer-product-add')[0])
					return
					
				s.select('.dealer-product-add')[0].observe('click',function(event){
				
					// extract product id
					var id = s.readAttribute('class').match(/\b\w+\-\d+\b/)[0].split('-')[1];

					// send the change
					request('xintranet',{
						action:	'toggle',
						method: id
					},function(request,json){
			
						if (json.feedback == 'added') {
							s.select('.dealer-product-add')[0].update('<span class="remove">verwijderen</span>');
							s.select('img')[0].removeClassName('not-selected');	
						}
						
						if (json.feedback == 'removed') {
							s.select('.dealer-product-add')[0].update('<span class="select">selecteren</span>');
							s.select('img')[0].addClassName('not-selected');
						}
					});
				})
			});
			
			$$('.product-features').each(function(s){
																			
				// User ??
				if(!s.select('#orig-description')[0])
					return
				
				// store original settings
				var orig_description 	= s.select('.contents')[0].innerHTML;
				var orig_price 			= s.select('.contents')[1].innerHTML;					
				var id = s.readAttribute('class').match(/product-\d+\b/)[0].split('-')[1];
								
				// Tooltips
				new Tip('orig-price', 'Klik hier om de prijs terug te zetten naar de originele prijs: <br />' +
					' <i> ' + orig_price + ' <i>'	, {
				  title: 'Originele prijs',
				  style: 'default',
				  stem: 'topLeft',
				  hook: { tip: 'topLeft', mouse: true },
				  offset: { x: 2, y: 2 }
				});
				
				new Tip('orig-description', 
					'Klik hier om de omschrijving terug te zetten naar de originele omschrijving: <br />' +
					'<i>' + orig_description + ' </i>' , {
				  title: 'Originele omschrijving',
				  style: 'default',
				  stem: 'topLeft',
				  hook: { tip: 'topLeft', mouse: true },
				  offset: { x: 2, y: 2 }
				});	
											
				// check if dealer has alternative price / description
				request('xintranet',{
					action:	'check_dealer_settings',
					method: id
				},function(request,json){
					
					if(json.price){
						s.select('.contents')[1].update('&euro;' + json.price);
						$('orig-price').show();
					}
					if(json.description){
						s.select('.contents')[0].update(json.description);
						$('orig-description').show();
					}						
				});		
					
				s.select('#orig-description')[0].observe('click',function(event){
					
					// send the change
					request('xintranet',{
						action:	'restore_description',
						method: id
					},function(request,json){
						
						// action
						$('orig-description').hide();
						s.select('.contents')[0].update(orig_description);

					});			
				});
					
				// change price back to orig
				s.select('#orig-price')[0].observe('click',function(event){
					
					// send the change
					request('xintranet',{
						action:	'restore_price',
						method: id
					},function(request,json){
						
						// action
						$('orig-price').hide();
						s.select('.contents')[1].update(orig_price);
					});			
				});					
					
				s.select('.dealer-edit')[0].observe('click',function(event){
					
					s.select('.dealer-edit')[0].hide();	
					
					// create the form
					s.select('.contents')[0].update(
						'<form class="dealer-edit-description">'+
						'	<p>Pas omschrijving aan</p>'+
						'	<textarea class="edit-description" cols="" rows=""></textarea>'+
						'	<input type="submit" value="verander" class="input-button" />'+
						'	<a href="" class="cancel-update">annuleren</a>' +
						'</form>'			
					);
																								
					var edit_form = s.select('.dealer-edit-description')[0];
					
					edit_form.observe('submit',function(event){
						event.stop();
						
						var contents = edit_form.select('.edit-description')[0].value;
						
						// send the change
						request('xintranet',{
							action:	'edit_description',
							input: 	edit_form.select('.edit-description')[0].value,
							method: id
						},function(request,json){
								
							if(json.feedback == 'edit_description'){
								
								edit_form.hide();
								s.select('.contents')[0].show().update(contents);
								s.select('.dealer-edit')[0].show()
								$('orig-description').show();
							}
						});		
					});				
				});
					
				s.select('.dealer-edit')[1].observe('click',function(event){
						
					// create the form
					s.select('.contents')[1].update(
						'<form class="dealer-edit-price">'+
						'	<p>Pas prijs aan</p>'+
						'	<input class="edit-price" />'+
						'	<input type="submit" value="verander" class="input-button" />'+
						'	<a href="" class="cancel-update">annuleren</a>' +
						'</form>'			
					);
					
					s.select('.dealer-edit')[1].hide();
														
					var edit_form = s.select('.dealer-edit-price')[0];
					
					edit_form.observe('submit',function(event){
						event.stop();
						
						var contents = edit_form.select('.edit-price')[0].value;
						
						// send the change
						request('xintranet',{
							action:	'edit_price',
							input: 	edit_form.select('.edit-price')[0].value,
							method: id
						},function(request,json){
							
							if(json.feedback == 'edit_price'){
																	
								edit_form.hide();
								//d(s.select('.contents'));
								
								s.select('.contents')[1].show().update(
									'&euro;' + contents
								);
								s.select('.dealer-edit')[1].show()
								$('orig-price').show();
								
							}
						});		
					});				
				});		
			});
		});

/* xRow */


var row_img_loading = '/plugins/xrow/files/row_loading.gif';
var row_img_error = '/plugins/xrow/files/row_error.gif';
var row_img_ok = '/plugins/xrow/files/row_ok.gif';

document.observe("dom:loaded", function(){
	// only go on with a rowForm present
	if($$('form.row').length == 0)
		return;
	
	// observe elements
	var form = $$('form.row')[0];
	var elements = form.getElements();
	
	elements.each(function(element) {
		if (element.type == 'text') {
			row_observeText(element);
		
		} else if (element.type == 'textarea') {
			row_observeText(element);
		
		} else if (element.type == 'select-one') {
			row_observeText(element);
			
		} else if (element.type == 'password') {
			row_observePassword(element);
		
		} else if (element.type == 'checkbox') {
			row_observeCheckBox(element);
			
		} else if (element.type == 'radio') {
			if (element.id.endsWith('-boolean0') || element.id.endsWith('-boolean1')) {
				row_observeBooleanRadio(element);
			}
		
		}
	});
	
	// make the help buttons show a tooltip
	$$('img.row-help').each(function(element){	
		
		element.observe('mouseover',function(event){
			this.fire('row:show-tooltip');
		});
		
		element.observe('mouseout',function(event){
			this.fire('row:hide-tooltip');
		});
		
		element.observe('row:show-tooltip',function(event){
			// create tooltip element
			if (!$(this.id+'-tooltip')) {
				form.appendChild(
					new Element('div', { 'class': 'row-tooltip', 'id': this.id+'-tooltip' }).update( this.alt )
				).hide();
				
				// remove alt text on image
				this.alt = '';
			}
			
			// show the show tooltip, on the right location
			var newleft = (this.cumulativeOffset().left + 35) + 'px';
			var newtop = (this.cumulativeOffset().top + 5) + 'px';
			$(this.id+'-tooltip').setStyle({
				top: newtop,
				left: newleft
			}).show();
		});
		
		element.observe('row:hide-tooltip',function(event){
			// hide the tooltip
			if ($(this.id+'-tooltip')) {
				$(this.id+'-tooltip').hide();
			}
		});
	});
	
	// make the submit event validate instead
	form.observe('submit',function(event){
		event.stop();
		form.fire('row:validate');
	});

	// try to post data ajax style
	form.observe('row:validate',function(event){
		// mark feedback as loading
		$(this.id+'-feedback-message').update('Gegevens worden verzonden...');
		$(this.id+'-feedback-result').update(
			'<img src="'+ row_img_loading +'" alt="" />'
		);
		
		var rowdata = {};
		elements.each(function(element) {
			if (element.type=='checkbox') {
				if (element.checked) {
					rowdata[ element.id ] = 1;
				} else {
					rowdata[ element.id ] = 0;
				}
			} else if (element.type=='radio') {
				if (element.id.endsWith('-boolean0')) {
					var radio_id = element.id.substr(0,(element.id.length-9));
					if ($(radio_id+'-boolean0').checked) {
						rowdata[ radio_id ] = 0;
					} else if ($(radio_id+'-boolean1').checked) {
						rowdata[ radio_id ] = 1;	   
					} else {
						rowdata[ radio_id ] = '';
					}
				}
			} else {
				rowdata[ element.id ] = element.value;
			}
		});
		
		request('xrow',{
			action: 'save',
			data: rowdata,
			form_id: this.id.substr(4)
		},function(request,json){
			if (json.respondcode==0) {
				// error, mark feedback
				$('row-'+json.form_id+'-feedback-message').update( '<span id="row-'+ json.form_id +'-errormessage" class="errormessage">'+json.message+'</span>');
				$('row-'+json.form_id+'-feedback-result').update(
					'<img src="'+ row_img_error +'" alt="" />'
				);
				
				// update all elements' errorchecks
				var elements = $('row-'+ json.form_id).getElements();
				elements.each(function(element){
					element.fire('row:validate_field');
				});
				
			} else if (json.respondcode==1) {
				// ok. mark feedback
				$('row-'+json.form_id+'-feedback-message').update( '<span id="row-'+ json.form_id +'-okmessage" class="okmessage">'+json.message+'</span>');
				$('row-'+json.form_id+'-feedback-result').update(
					'<img src="'+ row_img_ok +'" alt="" />'
				);
				
			}
		});
		
	});
	
});

/**
 * Start observing a text type field
 *
 * @param obj element
 */
function row_observeText( element )
{
	element.observe('blur', function(event){
		Event.element(event).fire('row:validate_field');
	});
	
	element.observe('row:validate_field', function(event){
		row_validateText( this.id );
	});
}

/**
 * Start observing a text type password field combination
 *
 * @param obj element
 */
function row_observePassword( element )
{
	
	if (!element.id.endsWith('-check')) {
		// password original
		element.observe('blur', function(event){
			Event.element(event).fire('row:validate_field');
		});
		element.observe('row:validate_field', function(event){
			this.validate_timeout = window.setTimeout('row_validatePassword(\''+ this.id +'\')', 200);
		});
		element.observe('focus', function(event){
			if (validate_timeout = this.validate_timeout) {
				window.clearTimeout(validate_timeout);
			}
		});
		
	} else {
		// password check
		element.observe('blur', function(event){
			var original_password_id = this.id.substr(0,(this.id.length-6));
			$(original_password_id).validate_timeout = window.setTimeout('row_validatePassword(\''+ original_password_id +'\')', 200);
		});
		element.observe('focus', function(event){
			var original_password_id = this.id.substr(0,(this.id.length-6));
			if (validate_timeout = $(original_password_id).validate_timeout) {
				window.clearTimeout(validate_timeout);
			}
		});
	}
}

/**
 * Start observing a checkbox type field
 *
 * @param obj element
 */
function row_observeCheckBox( element )
{
	element.observe('change', function(event){
		Event.element(event).fire('row:validate_field');
	});
	element.observe('blur', function(event){
		Event.element(event).fire('row:validate_field');
	});
	
	element.observe('row:validate_field', function(event){
		row_validateCheckBox( this.id );
	});
}

/**
 * Start observing a boolean radio type field-combo
 *
 * @param obj element
 */
function row_observeBooleanRadio( element )
{
	element.observe('change', function(event){
		Event.element(event).fire('row:validate_field');
	});
	element.observe('blur', function(event){
		Event.element(event).fire('row:validate_field');
	});
	
	element.observe('row:validate_field', function(event){
		row_validateBooleanRadio( this.id );
	});
}

/**
 * Validate a text type field, ajax style
 *
 * @param string id
 */
function row_validateText( id )
{
	// mark field as loading
	row_markAsLoading( id );
	
	// send the reuqest to validate this field
	request('xrow',{
		action: 'validate_field',
		field_id: id,
		field_value: $(id).value
	},function(request,json){
		// receive field_id, respondcode + errormessage
		// respondcode 0 means error, 1 means ok
		row_markField( json.field_id, json.respondcode, json.errormessage );
	});
}

/**
 * Validate a text type password field combination, ajax style
 *
 * @param string id
 */
function row_validatePassword( id )
{
	// mark field as loading
	row_markAsLoading( id );
	
	// send the reuqest to validate this field
	request('xrow',{
		action: 'validate_password',
		field_id: id,
		field_value: $(id).value,
		field_value_check: $(id+'-check').value
	},function(request,json){
		// receive field_id, respondcode + errormessage
		// respondcode 0 means error, 1 means ok
		row_markField( json.field_id, json.respondcode, json.errormessage );
		
		// class-mark the second password field as well
		if (json.respondcode==0) {
			$(json.field_id+'-check').addClassName('has-error');
		} else if (json.respondcode==1) {
			$(json.field_id+'-check').removeClassName('has-error');
		}
	});
}

/**
 * Validate a checkbox type field
 *
 * @param string id
 */
function row_validateCheckBox( id )
{
	// mark field as loading
	row_markAsLoading( id );
	
	var ischecked = 0;
	if ($(id).checked) {
		ischecked = 1;	
	}
	
	// send the reuqest to validate this field
	request('xrow',{
		action: 'validate_field',
		field_id: id,
		field_value: ischecked
	},function(request,json){
		// receive field_id, respondcode + errormessage
		// respondcode 0 means error, 1 means ok
		row_markField( json.field_id, json.respondcode, json.errormessage );
	});
}

/**
 * Validate a boolean radio type field-combo
 *
 * @param string id
 */
function row_validateBooleanRadio( id )
{
	var radio_id = id.substr(0,(id.length-9));
	
	// mark field as loading
	row_markAsLoading( radio_id );
	
	var radio_value = '';
	if ($(radio_id+'-boolean0').checked) {
		radio_value = 0;
	} else if ($(radio_id+'-boolean1').checked) {
		radio_value = 1;	   
	}
	
	// send the reuqest to validate this field
	request('xrow',{
		action: 'validate_field',
		field_id: radio_id,
		field_value: radio_value
	},function(request,json){
		// receive field_id, respondcode + errormessage
		// respondcode 0 means error, 1 means ok
		var id = json.field_id;
		
		var field_element = $(id+'-boolean0');
		var error_element = $(id+'-errormessage');
		
		// remove errorMessage if it exists
		if (error_element) {
			error_element.remove();
		}
		
		if (json.respondcode==0) {
			// field input contains an error
			field_element.ancestors()[0].insert({
				bottom: '<span id="'+ id +'-errormessage" class="errormessage">'+ json.errormessage +'</span>'
			});
			$(id+'-result').update(
				'<img src="'+ row_img_error +'" alt="" />'
			);
		
		} else if (json.respondcode==1) {
			// field input is fine
			$(id+'-result').update(
				'<img src="'+ row_img_ok +'" alt="" />'
			);
			$(id+'-result').update(
				'<img src="'+ row_img_ok +'" alt="" />'
			);
		}
		
	});
}

/**
 * Mark a field as loading
 * 
 * @param string id element-id
 */
function row_markAsLoading( id )
{
	$(id+'-result').update(
		'<img src="'+ row_img_loading +'" alt="" />'
	);
}

/**
 * mark a field with a checkmark or error
 *
 * @param string id element-id
 * @param int respondcode
 * @param string errormessage (can be empty string)
 */
function row_markField( id, respondcode, errormessage )
{
	var field_element = $(id);
	var error_element = $(id+'-errormessage');
	
	// remove errorMessage if it exists
	if (error_element) {
		error_element.remove();
	}
	
	if (respondcode==0) {
		// field input contains an error
		field_element.addClassName('has-error');
		field_element.ancestors()[0].insert({
			bottom: '<span id="'+ id +'-errormessage" class="errormessage">'+ errormessage +'</span>'
		});
		$(id+'-result').update(
			'<img src="'+ row_img_error +'" alt="" />'
		);
	
	} else if (respondcode==1) {
		// field input is fine
		field_element.removeClassName('has-error');
		$(id+'-result').update(
			'<img src="'+ row_img_ok +'" alt="" />'
		);
		$(id+'-result').update(
			'<img src="'+ row_img_ok +'" alt="" />'
		);
	}
	
}