/*** input element focus/ help box object **/

(function()
{

/***
 * Constructor
 *
 * @param wrapperId id of div wrapping question (has class question)
 * @param helpText help text to be shown when focused on question
 * @param errorText error text to be shown when user inputted errorneous value
 */

    Comoditas.ElementEx = function(wrapperId, text)
    {

        this.init(wrapperId, text);
     
    };
    
    // shortcuts
    var     ColorAnim = YAHOO.util.ColorAnim,
            Dom = YAHOO.util.Dom,
            Event = YAHOO.util.Event,
            Lang = YAHOO.lang,
            Selector = YAHOO.util.Selector,
            Widget = YAHOO.widget,
            ElementEx = Comoditas.ElementEx,
            ElementExCollection = Comoditas.ElementExCollection,
            Balloon = Comoditas.Balloon;
            
    
    // constants
    ElementEx.CLR_HOVER  = "#bed6fb";
    ElementEx.CLR_NORMAL = "#fcfcfc";

    
    ElementEx.prototype =
    {
        // members
        /**
         * properties of elements
         * @type object
         */
        cfg : null,
        
        /**
         * div wrapping question (has class question)
         * @type DOM object
         */
        wrapper : null,
        
        /**
         * if one of the form elements is errorneous (implied by setting errorText in constructor), valid = false
         * @type boolean
         */
        valid : null,
        
        /**
         * if there are form elements inside the wrapper
         * @type boolean
         */
        hasFormElement : null,
        
        /**
         *@var boolean whether the element has help
         **/        
        hasHelp : null,
        
        /**
         *@var user clicked on inputelement, when set to true do not focus on first element after wrapper click
         **/
        hasClickedOnInput : false,
        
        /**
         *the form elements
         *@type array
         */
        formElements:[],
        
        /***
         *@var custom event when element is focused
         *@type YUI custom event object
         **/
        eventFocus : null,
        
        /***
         *@var custom event when element is blurred
         *@type YUI custom event object
         **/
        eventBlur : null,
        
        init : function(wrapperId, text)
        {
            this.cfg = {};
            this.cfg.wrapperId = wrapperId;
            
            this.valid=false;
            this.hasFormElement = true;
            
            if(Lang.isUndefined(text.help) || text.help === null)
            {
                this.hasHelp = false;
            }
            else
            {
                this.cfg.helpText = text.help;    
                this.hasHelp = true;
            }
            
            if(!Lang.isUndefined(text.error) && text.error !== null ) //this.valid initially set to false
               this.cfg.errorText = text.error;
            else
               this.valid = true;
            
            this.wrapper = Dom.get(wrapperId);
            this.findFormElements();
            
            //init custom events
            this.eventFocus = new YAHOO.util.CustomEvent("elementEx_focus", this);
            this.eventBlur = new YAHOO.util.CustomEvent("elementEx_blur", this);
            
        },
        
        // methods
        findFormElements : function()
        {          
            var aInputs = Selector.query('input', this.wrapper);
            var aSelects = Selector.query('select', this.wrapper);
            var aTextareas = Selector.query('textarea', this.wrapper);

            this.formElements = aInputs.concat(aSelects).concat(aTextareas);
            
            this.hasFormElements = this.formElements.length > 0;
            
            this.cfg.initialValues = {};
            this.cfg.formElementsIds = [];
            for(var i = 0; i < this.formElements.length; i++)
            {
                if(this.formElements[i].type === "radio") //value is useless for radio buttons. use checked value
                {
                    this.cfg.initialValues[ this.formElements[i].id ]  = this.formElements[i].checked;
                }
                else
                {
                    this.cfg.initialValues[ this.formElements[i].id ] = this.formElements[i].value;
                }
                
                this.cfg.formElementsIds.push(this.formElements[i].id);
            }

        },
        
        focus : function()
        {
            var bFocused = false;

            for(i = 0, j = this.formElements.length; i < j; i++)
            {
                if(typeof this.formElements[i].type == "undefined")
                    this.formElements[i].type = "select";
                    
                if(this.formElements[i].type != "radio" || this.formElements[i].type == "radio" && this.formElements[i].checked == true)
                {
                    this.formElements[i].focus();  // should fire onFocus event
                    bFocused = true;
                    break;
                }
            }
            
            if(!bFocused && this.formElements.length > 0)
                this.formElements[0].focus();

        },
        
        getInitialValueById : function( id )
        {
          return this.cfg.initialValues[id];  
        },
        
        getId : function() {
            
            return this.wrapper.id;    
        },        
        
        getWrapper : function()
        {
            return this.wrapper;
        },
        
        getHelpText : function()
        {
            return this.cfg.helpText;
        },
        
        getErrorText : function()
        {
            return this.cfg.errorText;
        },
        
        getFormElements : function()
        {
            return this.formElements;
        },
        
        getNumOfElements : function()
        {
            return this.formElements.length;
        },
        
        hasHelpText : function()
        {
            return this.hasHelp;
        },
        
        isValid : function()
        {
            // error message shown, but the value of the input element has changed; thus, show no more warning msg
            var bChangedValue = false;
            for(var i = 0; i < this.formElements.length; i++)
            {
                if(this.formElements[i].value != this.cfg.initialValues[this.formElements[i].id])
                {
                    bChangedValue = true;
                    break;
                }
            }
            
            if(bChangedValue )
            {
                //stop listening
                for(var i = 0; i < this.formElements.length; i++)
                {
                    if(this.formElements[i].tagName === "select" || this.formElements[i].type === "radio")
                    {
                        Event.removeListener(this.formElements[i], 'change', this.onChange);
                    }
                    else if (this.formElements[i].type === "text")
                    {
                        Event.removeListener(this.formElements[i], 'keypress', this.onChange);
                    }
                }     
                return true;
            }
            else
            {
                return this.valid;            
            }
        },
        
        
        addListeners : function()
        {
            if(!this.hasFormElements)
                return;
            
            Event.addListener( this.getWrapper(), 'click', this.onWrapperClick, this );
            Event.addFocusListener( this.formElements, this.onFocus, this );
            Event.addBlurListener( this.formElements, this.onBlur, this );
            
            for(var i = 0; i < this.formElements.length; i++)
            {                
                if(this.valid === false && this.formElements[i].tagName === "SELECT" )
                {        
                    Event.addListener(this.formElements[i], 'change', this.onChange, this);
                }
                else if(this.valid === false && this.formElements[i].type === "text" )
                {            
                    Event.addListener(this.formElements[i], 'keypress', this.onChange, this);
                }
                else if (this.valid === false && this.formElements[i].type === "radio")
                {
                    Event.addListener(this.formElements[i], 'click', this.onChange, this);
                }
            }           
        },
        
        removeListeners : function() {
            
            if(!this.hasFormElements) {
                return;
            }
            
            Event.removeListener(this.getWrapper, 'click', this.onWrapperClick);
            Event.removeFocusListener(this.formElements, this.onFocus);
            Event.removeBlurListener(this.formElements, this.onBlur);
            
            for(var i = 0; i < this.formElements.length; i++) {
                
                if(this.formElements[i].tagName === "SELECT" )
                {        
                    Event.removeListener(this.formElements[i], 'change', this.onChange);
                }
                else if(this.formElements[i].type === "text" )
                {            
                    Event.removeListener(this.formElements[i], 'keypress', this.onChange);
                }
                else if (this.formElements[i].type === "radio")
                {
                    Event.removeListener(this.formElements[i], 'click', this.onChange);
                }
            }
            
        },
        
        // Event handlers
        onChange : function(e, o)
        {
            if(Lang.isUndefined(this.checked))
                this.checked =null;
                
            if(this.value != o.getInitialValueById(this.id) && this.checked !=  o.getInitialValueById(this.id))
            {
                Balloon.unsetWarningMessage();
                
                if(this.tagName === "SELECT")
                    Event.removeListener(this, 'change', this.onChange);
                else if(this.type === "text")
                    Event.removeListener(this, 'keypress', this.onChange);
                else if(this.type === "radio")
                {
                    Event.removeListener(this, 'click', this.onChange);
                    var table = Selector.query('table', o.getWrapper(), true);
                    Dom.removeClass(table, 'error');
                }
                
                var elements = o.getFormElements();
                for(var i = 0; i < elements.length; i++)
                {
                    if(elements[i].tagName === "SELECT" || elements.type === "text")
                        Dom.setStyle(elements[i], "background", "transparent url(/sites/geencentteveel/images/select_bg.gif) no-repeat");
                    
                }
            }            
        },
        
        onFocus : function(e, o)
        {
            this.focused = true; // flag focus
            
            var attr =
            {
              backgroundColor: { to:ElementEx.CLR_HOVER }
            };
            var anim = new ColorAnim( o.getWrapper(), attr, 0.3);
            anim.animate();
            
            if(!Balloon.isInitialized())
            {
                Balloon.init(Balloon.POINT_LEFT);
            }
            
            Balloon.clearText();
            
            var bShow = false;
            if(!o.isValid(this))
            {
                Balloon.setWarningMessage(o.getErrorText());
                bShow = true;
            }
            if(o.hasHelpText())
            {
                Balloon.setInformationMessage(o.getHelpText());
                bShow = true;
            }
            
            if(bShow)
                Balloon.point(this, { wrapper:o.getWrapper() });
                
            o.eventFocus.fire(this.cfg);
        },
        
        onBlur : function(e, o)
        {
            this.focused = false; // flag focus off
            
            var attr =
            {
              backgroundColor: { to:ElementEx.CLR_NORMAL }
            };
            var anim = new ColorAnim( o.getWrapper(), attr, 0.3);
            anim.animate();
            
            if(Balloon.isVisible())
                Balloon.hide();
                
            o.eventBlur.fire(this.cfg);
        },
        
        onWrapperClick : function(e, o)
        {
            // only focus when  no other child element isn't focused in the wrapper
            // and do not focus when user clicked on an input element
            var alreadyFocused = false;
            var clickedOnInput = false;
            var clickedInput = null;
            var xy = Event.getXY(e);
            
            for(var i = 0; i < o.getFormElements().length; i++)
            {
                var region = Dom.getRegion(o.formElements[i]);
                if(o.formElements[i].focused == true)
                {
                    alreadyFocused = true;
                }
                if(xy[1] > region.top && xy[1] < region.bottom && xy[0] > region.left && xy[0] < region.right )
                {
                    clickedOnInput = true;
                    clickedInput = o.formElements[i];
                }                
            }
            
            if(clickedOnInput && clickedInput.id != this.id && clickedOnInput.focused == false)
            {
                clickedInput.focus();
            }
            else if(!alreadyFocused && !clickedOnInput)
            {
                o.focus();
            }
        }
    };
})();

(function()
{
    // shortcuts
    var     ColorAnim = YAHOO.util.ColorAnim,
            Dom = YAHOO.util.Dom,
            Event = YAHOO.util.Event,
            Lang = YAHOO.lang,
            Selector = YAHOO.util.Selector,
            Widget = YAHOO.widget,
            ElementEx = Comoditas.ElementEx,
            ElementExCollection = Comoditas.ElementExCollection,
            Balloon = Comoditas.Balloon;
    
    Comoditas.ElementExCollection = function ( elements )
    {
        this.elements = elements;
    }
    
    Comoditas.ElementExCollection.prototype =
    {
        
        elements:[],
        
        focusedElement:null,
        
        addListeners : function()
        {
            for(var i = 0; i < this.elements.length; i++)
            {
                this.elements[i].addListeners();
            }
                
        },        
        
        focus : function()
        {
            this.focusedElement = this.elements[0];
            for(var i = 0; i < this.elements.length; i++) 
            {
                if(!this.elements[i].isValid())
                {
                    this.focusedElement = this.elements[i];
                    break;
                }
            }
            this.focusedElement.focus();
         
        },
        
        getElementExById : function(id) {
            
            for(var i = 0; i < this.elements.length; i++) {
                
                if(this.elements[i].getId() == id) {
                    
                    return this.elements[i];    
                }    
            }
            
            return null;        
        }
    };
    
})();


/*** laat een DOM element oplichten (gebruikt voor inboedelwaardemeter als de waarde is veranderd **/
Comoditas.knipperen = function(id, color) {
    
    var duration = 0.2;
    
    color = color || "#ffffcc";
    var origColor = YAHOO.util.Dom.getStyle(id, 'backgroundColor') || "#FCFCFC";
    if(origColor === "transparent") {
        origColor = "#FCFCFC";
    }
    
    if(typeof(id) === undefined)
        return;
    
    var attr = {
        backgroundColor: {
            to: color
        }
    };
    var attr2 = {
        backgroundColor: {
            to: origColor
        }
    };

    var toYellow = new YAHOO.util.ColorAnim(id, attr, duration);
    var toWhite = new YAHOO.util.ColorAnim(id, attr2, duration);
    var toYellow2 = new YAHOO.util.ColorAnim(id, attr, duration);
    var toWhite2 = new YAHOO.util.ColorAnim(id, attr2, duration+0.5);
    
    toYellow.onComplete.subscribe(function() {
            toWhite.animate();    
        });
    toWhite.onComplete.subscribe(function() {
            toYellow2.animate();
    });
    toYellow2.onComplete.subscribe(function() {
            toWhite2.animate();
    });
    
    toYellow.animate();
    
    delete toYellow;
    delete toWhite;
    delete toYellow2;
    delete toWhite2;
    
}

/*** kleine singleton class voor dynamisch vertonen van de inboedelwaarde onder de 'gefocuste' vraag***/
    
Comoditas.InboedelWaardeBox = function(options) {

    // shortcuts
    var     ColorAnim = YAHOO.util.ColorAnim,
            Dom = YAHOO.util.Dom,
            Event = YAHOO.util.Event,
            Element = YAHOO.util.Element,
            Lang = YAHOO.lang,
            Selector = YAHOO.util.Selector,
            Widget = YAHOO.widget;
    
    //constants
    DEFAULT_ID = "inboedel_waarde_box";
    
    
    //members
    
    /***
     * @var config object naar goed YUI gebruik
     * @type literal object
     ***/
    var cfg = {};
    
    /****
     *@var question elemented in which the box is nested
     *@type DOM element object
     **/
    var question = null;
    
    /***
     *@var exacte waarde van de inboedelwaardemeter
     *@type int
     **/
    var waardemeter_value = 0;
    
    /**
     *@var dom element object of the div container of the box
     *@type DOM object
     **/
    var container = null;
    
    /**
     *@var ElementEx object for the focused question element
     *@type ElementEx
     *@used for custom events
     ***/
    var elementEx = null;
    
    
        // number_format function
    function number_format(number, decimals, dec_point, thousands_sep) {
        // Formats a number with grouped thousands  
        // 
        // version: 1001.2911
        // discuss at: http://phpjs.org/functions/number_format    // +   original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
   
        var n = !isFinite(+number) ? 0 : +number, 
            prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
            sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
            s = '',
            toFixedFix = function (n, prec) {
                var k = Math.pow(10, prec);
                return '' + Math.round(n * k) / k;        };
        // Fix for IE parseFloat(0.55).toFixed(0) = 0;
        s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
        if (s[0].length > 3) {
            s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);    }
        if ((s[1] || '').length < prec) {
            s[1] = s[1] || '';
            s[1] += new Array(prec - s[1].length + 1).join('0');
        }    return s.join(dec);
    }
    
    //public
    return {
      
      /**
       *@desc append the box below a question
       *@param id, id of question DOM element
       **/
      
      append : function(id, waardemeter_value) {
        
        if(!Lang.isString(id) || Lang.isUndefined(id) || !Lang.isNumber(waardemeter_value)) {
            return;
        }
        
        // remove old box
        if(null !== container) {
            this.remove();
        }
            
        //init vars
        question = Dom.get(id);
        cfg.question_id = id;
        
        //build box in html
        container = document.createElement('div');
        container.id=DEFAULT_ID;
        container.innerHTML = "Uw inboedelwaarde is nu: &euro " +number_format(waardemeter_value, 0, ",", ".");
        
        //append box element after question
        Dom.insertAfter(container, question);
    
        Comoditas.knipperen(container.id);
       
        //add Listeners
        this.addListeners();
        
        
      },
      
      remove : function() {
        
        question.parentNode.removeChild(container);
        
        this.removeListeners();
        
        elementEx = null;
        question = null;
        
      },
      
      addListeners : function() {
        
        // if elementEx is set, it means that there are old Listeners active -> remove them
        if(null !== elementEx) {
            this.removeListeners();    
        }
        
        elementEx = Comoditas.formGegevensCollection.focusedElement;
        elementEx.eventBlur.subscribe(this.onQuestionBlur, this);
        
      },
      
      removeListeners : function() {
        
        elementEx.eventBlur.unsubscribe(this.onQuestionBlur, this);
      },
      
      onQuestionBlur : function(e, o) {

        o.remove();
      }
    
    };
    
}();

/** Auto- en motorverzekering  **/

(function(){
    
    var Dom = YAHOO.util.Dom;
    var Selector = YAHOO.util.Selector;
    var Event = YAHOO.util.Event;
    
    /********************************************************************/
    /**   Auto form functions                                          **/
    /********************************************************************/
    
    Comoditas.Auto = {};
    
    Comoditas.Auto.addListeners = function( ) {
        
        var merk = Dom.get('auto_merk');
        var bouwmaand = Dom.get("auto_bouwdatum_month");
        var bouwjaar = Dom.get("auto_bouwdatum_year");
        
        var model = Dom.get("auto_model");
        var brandstof = Selector.query("input[type=radio]", Dom.get('auto_brandstof_wrapper'));
        var transmissie = Selector.query("input[type=radio]", Dom.get('auto_transmissie_wrapper'));
        
        var type = Selector.query("input[type=radio]", Dom.get("auto_type_wrapper"));
        
        Event.addListener([merk, bouwmaand, bouwjaar], "change", Comoditas.Auto.retrieveModels);
        Event.addListener([model, brandstof, transmissie], "change", Comoditas.Auto.retrieveTypes);
        Event.addListener(type, "change", Comoditas.Auto.retrieveDetails);
        
        // check if model should be shown or hidden
        if (merk.selectedIndex !== 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0) {
            
            Dom.setStyle("auto_model_wrapper", "display", "block");
            
        } else {
            Dom.setStyle("auto_model_wrapper", "display", "none");
        }
        
        // check if type should be shown or hidden
        if(merk.options[merk.selectedIndex].value.length > 0
        && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
        && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
        && model.options[model.selectedIndex].value.length > 0
        && brandstof !== null
        && transmissie !== null) {
            
            Dom.setStyle("auto_type_wrapper", "display", "block");
        
        } else {
            Dom.setStyle("auto_type_wrapper", "display", "none");
        }
        
    }
    
    /********************************************************************/    

    Comoditas.Auto.retrieveModels = function(e) {
        
        var merk = Dom.get("auto_merk");
        var bouwmaand = Dom.get("auto_bouwdatum_month");
        var bouwjaar = Dom.get("auto_bouwdatum_year");

            
        //  are alle prerequisite data available for model? 
        if (merk.selectedIndex !== 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0) {
            
            xajax_get_auto_modellen(xajax.getFormValues('formGegevens'));
        
        // no, hide model
        } else {
            Dom.setStyle("auto_model_wrapper", "display", "none");
        }
    }
    
    /********************************************************************/
    
    Comoditas.Auto.addModels = function( options ) {
        
        var model = Dom.get("auto_model");
        var wrapper = Dom.get("auto_model_wrapper");
        var merk = Dom.get("auto_merk");
        var bouwmaand = Dom.get("auto_bouwdatum_month");
        var bouwjaar = Dom.get("auto_bouwdatum_year");
        
        // invalid bouwdatum or merk
        if(options.length == 0) {
           
           var msg =    "In onze database staan er geen modellen van "+merk.options[merk.selectedIndex].text +
                        " met als bouwdatum "+bouwmaand.options[bouwmaand.selectedIndex].text +
                        " "+bouwjaar.options[bouwjaar.selectedIndex].text+"; controleer de door u opgegeven gegevens.";
           
           Comoditas.Gegevens.setErrorMessage(wrapper, msg);
           
           model.options[0] = new Option("Geen modellen", "");
        
        // Arrrr.. we got models to show!        
        } else {
            
            // clear errors if they're set
            Comoditas.Gegevens.clearErrorMessage(wrapper.id);
            
            // clear old options
            model.options.length = 0;
            model.options[0] = new Option("Selecteer Model", "");
            
            for(key in options) {            
                model.options[model.options.length] = new Option(options[key], key);
                
            }
        }
        
        // arrange display of elements
        Dom.setStyle("auto_type_wrapper", "display", "none");
        Dom.setStyle(wrapper, "display", "block");
        Comoditas.knipperen(wrapper);
    }
    
    /********************************************************************/    
    
    Comoditas.Auto.retrieveTypes = function(e) {
        
        var merk = Dom.get("auto_merk");
        var bouwmaand = Dom.get("auto_bouwdatum_month");
        var bouwjaar = Dom.get("auto_bouwdatum_year");
        var model = Dom.get("auto_model");
        var brandstof = Selector.query("input[type=radio]:checked", Dom.get('auto_brandstof_wrapper'), true);
        var transmissie = Selector.query("input[type=radio]:checked", Dom.get('auto_transmissie_wrapper'), true);
        
        if(merk.options[merk.selectedIndex].value.length > 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
           && model.options[model.selectedIndex].value.length > 0
           && brandstof !== null
           && transmissie !== null) {
            
            xajax_get_auto_typen(xajax.getFormValues('formGegevens'));        
        }
    }
    
    /********************************************************************/
    
    Comoditas.Auto.addTypes = function( types ) {
        Comoditas.Auto.types = types;        
        
        var wrapper = Dom.get('auto_type_wrapper');
        var tbody = Dom.get('auto_type_table_body');
        var no_types_found = types.length == 0;
        
        // remove listeners (prevent memory leaks)
        Event.removeListener(Selector.query("input[type=radio]", wrapper), "change", Comoditas.Auto.retrieveDetails);
        
        //remove children
        
        if(tbody.hasChildNodes()) {
            while(tbody.childNodes.length >= 1) {
                tbody.removeChild(tbody.firstChild);
            }
        }
        var html = "";
        
        // no car type found with the filled in data
        if(no_types_found) {
            
            html += "<tr>";
            html += '<td valign="top"><input type="radio" id="auto_type_0" name="auto_type" value="" style="display:none" /></td>'; //empty value --> trigger error
            html += '<td><label for="auto_type_0">';
            html += 'Helaas geen auto type gevonden in onze database op basis van de door u opgegeven gegevens (i.e. model, brandstof en transmissie).';
            html += '</label></td>';
            html += '<td></td><td></td><td></td></tr>';
        }
        
        
        for(id in types) {
            html += "<tr>";
            html += '<td valign="top"><input type="radio" id="auto_type_'+id+'" name="auto_type" value="'+id+'" /></td>';
            html += '<td><label for="auto_type_'+id+'">'+types[id].naam+'</label></td>';
            html += '<td>'+types[id].gewicht+'</td>';
            html += '<td>'+types[id].vermogen+'</td>';
            html += '<td>'+types[id].deuren+'</td>';
            html += '</tr>';
        }
        
        tbody.innerHTML = html;
        
        // add listeners
        if(!no_types_found) {
            var input = Selector.query("input[type=radio]", wrapper);
            Event.addListener(input, "change", Comoditas.Auto.retrieveDetails);
        }
        
        //reset detail values
        Dom.get("auto_cataloguswaarde").value   = "";
        Dom.get("auto_dagwaarde").value         = "";
        Dom.get("auto_gewicht").value           = "";
        
        
        Comoditas.Gegevens.clearErrorMessage(['auto_brandstof_wrapper', 'auto_transmissie_wrapper', 'auto_type_wrapper']);
        
        if(no_types_found) {            
            Comoditas.Gegevens.setErrorMessage(wrapper, "Deze vraag is verplicht.", "auto_type_scroll_wrapper");
        }
        
        Dom.setStyle(wrapper, "display", "block");        
        Comoditas.knipperen(wrapper);

    }
    
    /********************************************************************/
    
    Comoditas.Auto.retrieveDetails = function(e) {
        
        if(!Comoditas.Auto.types) {
            return;
        }
        
        var types = Comoditas.Auto.types;
        var type_id = e.target.value;
        
        if(!types[type_id]) {
            return;
        }
        
        var cataloguswaarde = Dom.get("auto_cataloguswaarde");
        var gewicht = Dom.get("auto_gewicht");
        var dagwaarde = Dom.get("auto_dagwaarde");
        
        var cataloguswaarde_wrapper = Dom.get("auto_cataloguswaarde_wrapper");
        var gewicht_wrapper = Dom.get("auto_gewicht_wrapper");
        var dagwaarde_wrapper = Dom.get("auto_dagwaarde_wrapper");
        
        cataloguswaarde.value = types[type_id].nieuwwaarde_incl_btw;
        gewicht.value = types[type_id].gewicht;
        dagwaarde.value = types[type_id].dagwaarde_incl_btw;
        
        Comoditas.Gegevens.clearErrorMessage( [cataloguswaarde_wrapper, gewicht_wrapper, dagwaarde_wrapper] );
        
        Comoditas.knipperen(cataloguswaarde_wrapper);
        Comoditas.knipperen(gewicht_wrapper);
        Comoditas.knipperen(dagwaarde_wrapper);
        
    }
    
    /********************************************************************/
    /**   Motor form functions                                         **/
    /********************************************************************/
    
    Comoditas.Motor = {};
    
    Comoditas.Motor.addListeners = function( ) {
        
        var merk = Dom.get('motor_merk');
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        
        var model = Dom.get("motor_model");
        
        var type = Selector.query("input[type=radio]", Dom.get("motor_type_wrapper"));
        
        Event.addListener([merk, bouwmaand, bouwjaar], "change", Comoditas.Motor.retrieveModels);
        Event.addListener(model, "change", Comoditas.Motor.retrieveTypes);
        Event.addListener(type, "change", Comoditas.Motor.retrieveDetails);
        
        // check if model should be shown or hidden
        if (merk.selectedIndex !== 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0) {
            
            Dom.setStyle("motor_model_wrapper", "display", "block");
            
        } else {
            Dom.setStyle("motor_model_wrapper", "display", "none");
        }
        
        // check if type should be shown or hidden
        if(merk.options[merk.selectedIndex].value.length > 0
        && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
        && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
        && model.options[model.selectedIndex].value.length > 0) {
            
            Dom.setStyle("motor_type_wrapper", "display", "block");
        
        } else {
            Dom.setStyle("motor_type_wrapper", "display", "none");
        }
        
    }
 
    /********************************************************************/
    
    Comoditas.Motor.retrieveModels = function(e) {
        
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");

            
        //  are alle prerequisite data available for model? 
        if (merk.selectedIndex !== 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0) {
            
            xajax_get_motor_modellen(xajax.getFormValues('formGegevens'));
        
        // no, hide model
        } else {
            Dom.setStyle("motor_model_wrapper", "display", "none");
        }
        
    }
    
    /********************************************************************/
    
    Comoditas.Motor.addModels = function (options) {
        
        var model = Dom.get("motor_model");
        var wrapper = Dom.get("motor_model_wrapper");
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        
        // invalid bouwdatum or merk
        if(options.length == 0) {
           
           var msg =    "In onze database staan er geen modellen van "+merk.options[merk.selectedIndex].text +
                        " met als bouwdatum "+bouwmaand.options[bouwmaand.selectedIndex].text +
                        " "+bouwjaar.options[bouwjaar.selectedIndex].text+"; controleer de door u opgegeven gegevens.";
           
           Comoditas.Gegevens.setErrorMessage(wrapper, msg);
           
           // clear old options
           model.options.length = 0;
           
           // set empty value
           model.options[0] = new Option("Geen modellen", "");
        
        // Arrrr.. we got models to show!        
        } else {
            
            // clear errors if they're set
            Comoditas.Gegevens.clearErrorMessage(wrapper.id);
            
            // clear old options
            model.options.length = 0;
            
            // set new options
            model.options[0] = new Option("Selecteer Model", "");
            
            for(key in options) {            
                model.options[model.options.length] = new Option(options[key], key);
                
            }
        }
        
        // arrange display of elements
        Dom.setStyle("motor_type_wrapper", "display", "none");
        Dom.setStyle(wrapper, "display", "block");
        Comoditas.knipperen(wrapper);        
    }
    
    /********************************************************************/
    
    Comoditas.Motor.retrieveTypes = function(e) {
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        var model = Dom.get("motor_model");
        
        if(merk.options[merk.selectedIndex].value.length > 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
           && model.options[model.selectedIndex].value.length > 0) {
            
            xajax_get_motor_typen(xajax.getFormValues('formGegevens'));        
        }
    }
    
    /********************************************************************/
    
    Comoditas.Motor.addTypes = function (types) {
        
        Comoditas.Motor.types = types;        
        
        var wrapper = Dom.get('motor_type_wrapper');
        var tbody = Dom.get('auto_type_table_body'); // despite the phrase 'auto' in the id, it is the correct 
        var no_types_found = types.length == 0;
        
        // remove listeners (prevent memory leaks)
        Event.removeListener(Selector.query("input[type=radio]", wrapper), "change", Comoditas.Motor.retrieveDetails);
        
        //remove children        
        if(tbody.hasChildNodes()) {
            while(tbody.childNodes.length >= 1) {
                tbody.removeChild(tbody.firstChild);
            }
        }
        
        var html = "";
        
        // no car type found with the filled in data
        if(no_types_found) {
            
            html += "<tr>";
            html += '<td valign="top"><input type="radio" id="motor_type_0" name="motor_type" value="" style="display:none" /></td>'; //empty value --> trigger error
            html += '<td><label for="motor_type_0">';
            html += 'Helaas geen motor type gevonden in onze database op basis van de door u opgegeven gegevens (i.e. bouwdatum, merk en model).';
            html += '</label></td>';
            html += '<td></td><td></td><td></td></tr>';
        }
        
        
        for(id in types) {
            html += "<tr>";
            html += '<td valign="top"><input type="radio" id="motor_type_'+id+'" name="motor_type" value="'+id+'" /></td>';
            html += '<td><label for="motor_type_'+id+'">'+types[id].naam+'</label></td>';
            html += '<td>'+types[id].gewicht+'</td>';
            html += '<td>'+types[id].vermogen+'</td>';
            html += '<td>'+types[id].cilinderinhoud+'</td>';
            html += '</tr>';
        }
        
        tbody.innerHTML = html;
        
        // add listeners
        if(!no_types_found) {
            var input = Selector.query("input[type=radio]", wrapper);            
            Event.addListener(input, "change", Comoditas.Motor.retrieveDetails);
        }
        
        //reset detail values
        Dom.get("motor_cataloguswaarde").value   = "";
        Dom.get("motor_dagwaarde").value         = "";
        Dom.get("motor_gewicht").value           = "";
        
        
        Comoditas.Gegevens.clearErrorMessage('motor_type_wrapper');
        
        if(no_types_found) {            
            Comoditas.Gegevens.setErrorMessage(wrapper, "Deze vraag is verplicht.", "auto_type_scroll_wrapper"); // again, this is the right id
        }
        
        Dom.setStyle(wrapper, "display", "block");        
        Comoditas.knipperen(wrapper);        
    }
    
    /********************************************************************/
    
    Comoditas.Motor.retrieveDetails = function(e) {
        if(!Comoditas.Motor.types) {
            return;
        }
        
        var types = Comoditas.Motor.types;
        var type_id = e.target.value;
        
        if(!types[type_id]) {
            return;
        }
        
        var cataloguswaarde = Dom.get("motor_cataloguswaarde");
        var gewicht = Dom.get("motor_gewicht");
        var dagwaarde = Dom.get("motor_dagwaarde");
        
        var cataloguswaarde_wrapper = Dom.get("motor_cataloguswaarde_wrapper");
        var gewicht_wrapper = Dom.get("motor_gewicht_wrapper");
        var dagwaarde_wrapper = Dom.get("motor_dagwaarde_wrapper");
        
        cataloguswaarde.value = types[type_id].nieuwwaarde_incl_btw;
        gewicht.value = types[type_id].gewicht;
        dagwaarde.value = types[type_id].dagwaarde_incl_btw;
        
        Comoditas.Gegevens.clearErrorMessage( [cataloguswaarde_wrapper, gewicht_wrapper, dagwaarde_wrapper] );
        
        Comoditas.knipperen(cataloguswaarde_wrapper);
        Comoditas.knipperen(gewicht_wrapper);
        Comoditas.knipperen(dagwaarde_wrapper);        
    }
    
    /********************************************************************/
    /**   General useful form functions                                **/
    /********************************************************************/

    Comoditas.Gegevens = {};
    
    Comoditas.Gegevens.setErrorMessage = function( wrapper, message, custom_target_id ) {
        
        var div = Selector.query('div.errorExplanation', wrapper, true);
        var div_exists = div !== null;
        custom_target_id = custom_target_id || null;
        
        if(!div_exists) {
            div = document.createElement('div');
            Dom.addClass(div, 'errorExplanation');
            wrapper.insertBefore(div, wrapper.firstChild);
        }
                
        div.innerHTML = message;
        Dom.setStyle(div, "display", "block");
        
        if(YAHOO.lang.isNull(custom_target_id)) {
            var id = wrapper.id.substr(0, (wrapper.id.length-8) );  //strlen(_wrapper) = 8
            
        } else {
            var id = custom_target_id;
        }
        
        Dom.addClass(id, "error");
        
        var dropdown = Selector.query('div.dropdown', wrapper, true);
        
        if(dropdown !== null) {
            Dom.addClass(dropdown, "error");
        }
        
    }
    
    /********************************************************************/
    
    Comoditas.Gegevens.clearErrorMessage = function(wrapper) {
        if(YAHOO.lang.isString(wrapper) ) {
            
            Dom.removeClass(Selector.query(".error", wrapper, true), "error");

             var errorExplanation = Selector.query("div.errorExplanation", wrapper, true);
             
             if(errorExplanation !== null) {
                 Dom.setStyle(errorExplanation, "display", "none");
             }
         // is array ?
         } else if( YAHOO.lang.isArray(wrapper) ) {
             if(wrapper.length) {
                 
                 for(var i = 0; i < wrapper.length; i++) {
                     Dom.removeClass(wrapper, "error");
                     Dom.removeClass( Selector.query(".error", wrapper[i]), "error"); // remove all other error classes on other elements                     
                     
                     var errorExplanation = Selector.query("div.errorExplanation", wrapper[i], true);
                     
                     if(errorExplanation !== null) {
                         Dom.setStyle(errorExplanation, "display", "none");
                     }
     
                 }
             }
         } 
         
    }
    

}());

/*

    
    Comoditas.Motor = {};

    Comoditas.Motor.getModellen = function( data ) {
        
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        
        if(merk.options[merk.selectedIndex].value.length > 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0) {
            
            xajax_get_motor_modellen(data);        
        }
    }
    
    Comoditas.Motor.getTypen = function( data ) {
        
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        var model = Dom.get("motor_model");
        
        if(merk.options[merk.selectedIndex].value.length > 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
           && model.options[model.selectedIndex].value.length > 0) {
            
            xajax_get_motor_typen(data);        
        }
    }
    
    Comoditas.Motor.getDetails = function( data ) {
        
        var merk = Dom.get("motor_merk");
        var bouwmaand = Dom.get("motor_bouwdatum_month");
        var bouwjaar = Dom.get("motor_bouwdatum_year");
        var model = Dom.get("motor_model");        
        var type = Selector.query("input[type=radio]:checked", Dom.get('auto_motor_wrapper'), true);
        
        if(merk.options[merk.selectedIndex].value.length > 0
           && bouwmaand.options[bouwmaand.selectedIndex].value.length > 0
           && bouwjaar.options[bouwjaar.selectedIndex].value.length > 0
           && model.options[model.selectedIndex].value.length > 0
           && type != null) {
            
            xajax_get_motor_details(data);        
        }
    }
*/