/*
 *    Some JS for bike model selection UI beautification...
 */
select_bike_model = {
    // The currently selected bike model
    selected_bike: null,
    
    /*
     * Initializes the form, searching for a selected radio button and marking
     * its container 'td' element as 'selected'.
     */
    setup: function(form_id) {
        var form = $(form_id);
        // Get the radios
        var radios = Form.getInputs(form, 'radio');
        
        // Iterate
        for (var i= 0; i < radios.length; i++) {
            var radio = radios[i];
            if (radio.checked) {
                // Mark as selected and stop searching
                select_bike_model.select(radio);
                return;
            }
        }
    },
    
    /*
     * Selects the given +radio+, marks its container 'td' as 'selected',
     * sets a label with the selected bike info and scrolls down to the
     * year input
     */
    select: function(radio) {
        var td = Element.up(radio, 'td');
        Element.addClassName(td, 'selected');
        select_bike_model.selected_bike = radio;
        var info_div = $('selected_bike_info');
        info_div.innerHTML = js_messages.selected_bike + ' <strong>' + 
            td.innerHTML.stripTags() + '</strong>';
        var provide_a_year = $('provide_a_year');
        Element.scrollTo(provide_a_year);
        
        var bike_model_year = $('bike_model_year');
        bike_model_year.focus();
    },
    
    /*
     * Deselects the last selected radio, unmarking its container 'td'
     */
    deselect_selected: function() {
        if (select_bike_model.selected_bike != null) {
            $(select_bike_model.selected_bike).up('td').removeClassName('selected');
        }
    },
    
    /*
     * Event handlers
     */
    event_handlers: {
        // Radio button click event handler
        radio_click: function(ev) {
            // Deselect the previously selected radio
            select_bike_model.deselect_selected();
            
            // Select the clicked one
            select_bike_model.select(this);
        }
    },
    
    /*
     * Behaviour rules
     */
    behaviours : {
        // Initialize the form
        '#bike_brands_and_models_form' : function(form) {
            select_bike_model.setup(form);
        },
        
        // Link event handlers to radio buttons
        'form input[type=radio]' : function(radio) {
            Event.observe(radio, 'click', 
                select_bike_model.event_handlers.radio_click.
                    bindAsEventListener(radio));
        }
    }
}

// Register custom rules
Behaviour.register(select_bike_model.behaviours);