// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

document.observe("dom:loaded", function(){
    
    if($('months')){
        element = $('months');
        element.hide();
    	options = [];

    	$A(element.options).each(function(option, index){
    		parts = option.text.split(" ");

    		optionNode = Builder.node('li', { id: "option_"+option.index }, parts.first());

    		$(optionNode).observe('click', clickOption);

    		options.push(optionNode);
    	});
    	list = Builder.node('ul', { id: 'month_selector_list' }, options);
    	element.up().appendChild(list);
    	$('option_'+element.selectedIndex).addClassName('active');
    }
    
})


function clickOption(event){
	element = event.element();
	month_selector = $('months');
	month_selector.selectedIndex = element.id.gsub(/[^0-9]/, "");

	parts = month_selector.options[month_selector.selectedIndex].text.split(" ");
	price = parseFloat(parts[1].gsub(/\(|\)/, "").replace("€", ""));
	if(month_selector.selectedIndex == 0){
		price = price + 0.75;
	}
	months = parts.first();
	months += " maand";
	if(parseInt(parts.first()) > 1)
		months += "en";
	$('total_price').update("&euro; "+price.toFixed(2).toString().replace(".", ",")+" <small>voor "+months+"</small>");

	if(month_selector.selectedIndex == 0){
		$('single_cost').update("&euro; 0,75");
	} else {
		$('single_cost').update("<em>Geen</em>");
	}

	element.up().immediateDescendants().each(function(element){
		element.removeClassName('active');
	})

	element.addClassName('active');

}