/**
* @file elSelect.js
* @downloaded from http://www.cult-f.net/2007/12/14/elselect/
* @author Sergey Korzhov aka elPas0
* @site  http://www.cult-f.net
* @date December 14, 2007
* 
*/
var elSelect = new Class({
	options: {
		container: false,
		baseClass : 'elSelect'
	},
	source : false,
	selected : false,
	_select : false,
	current : false,
	selectedOption : false,
	dropDown : false,
	optionsContainer : false,
	hiddenInput : false,
	/*
	pass the options,
	create html and inject into container
	*/
	initialize: function(options){
		this.setOptions(options)
		
		if ( !this.options.container ) return
		
		this.selected = false
		this.source = $(this.options.container).getElement('select')
		this.buildFrameWork()
		
		$(this.source).getElements('option').each( this.addOption, this )
		//$(this.options.container).setHTML('')
		$(this.options.container).set('html','')
		this._select.injectInside($(this.options.container))
		
		this.bindEvents()
		
	},
	
	buildFrameWork : function() {
		this._select = new Element('div').addClass( this.options.baseClass )
		this.current = new Element('div').addClass('selected').injectInside($(this._select))
		this.selectedOption = new Element('div').addClass('selectedOption').injectInside($(this.current))
		this.dropDown = new Element('div').addClass('dropDown').injectInside($(this.current))
		new Element('div').addClass('clear').injectInside($(this._select))
		this.optionsContainer = new Element('div').addClass('optionsContainer').injectInside($(this._select))
		var t = new Element('div').addClass('optionsContainerTop').injectInside($(this.optionsContainer))
		var o = new Element('div').injectInside($(t))
		var p = new Element('div').injectInside($(o))
		var t = new Element('div').addClass('optionsContainerBottom').injectInside($(this.optionsContainer))
		var o = new Element('div').injectInside($(t))
		var p = new Element('div').injectInside($(o))

                var eltname=this.source.getProperty('name');
                var eltclass=this.source.getProperty('class');
                
                this.hiddenInput = new Element('input',{
			type  : 'text',
			id  : eltname,
			name  : eltname,
                        style : 'width:95%; height:0; visibility: hidden;',
                        events: {
                            change: function(){
                                //On ajoute une class à l'élément séléctionné pour améliorer l'affichage
                                this.getParent().getElements('.selectedOption').removeClass('filtered');
                                if(this.get('value')!=''){ 
                                    this.getParent().getElements('.selectedOption').addClass('filtered');
                                    //alert(this.get('class'));
                                }
                                
                                
                                switch(eltname){
                                    case 'home-block-commande-select':
                                        if(this.get('value')!=''){
                                            this.getParent().submit();
                                        }
                                        break;
                                    case 'filter_edition':
                                        filtres_change('edition');
                                        break;
                                    case 'filter_region':
                                        filtres_change('canton');
                                        break;
                                    case 'filter_region_ville':
                                        filtres_change('ville');
                                        break;
                                    case 'filter_food':
                                        updateMap();
                                        break;
                                    case 'edition':
                                        updateEdition();
                                        break;
                                    case 'region':
                                        updateRegion();
                                        break;
                                    case 'critique_sondage':
                                        updateCritiqueSondage();
                                        break;
                                    case 'country':
                                        updateCountry();
                                        break;
                                    default:
                                }
                                
                                if(eltclass != null && eltclass.split(' ')[0]=='select-quantity'){
                                    checkProduct(this);
                                }
                                else if(eltclass != null && eltclass.split(' ')[0]=='select_sondage'){
                                    calculMoyenne();
                                }
                                else if(eltclass != null && eltclass.split(' ')[0]=='critiquenote'){
                                    calculMoyenne();
                                }
                                else if(eltclass != null && eltclass.split(' ')[1]=='commande-select-quantity'){
                                    countEdition();
                                }
                            }
                        }
		}).injectAfter($(this.options.container))

                if(eltclass != null){ this.hiddenInput.set('class',eltclass);}
	},
	
	bindEvents : function() {
		document.addEvent('click', function() {
				if ( this.optionsContainer.getStyle('display') == 'block') {
					this.onDropDown();
                                }
			}.bind(this));
			
		$(this.options.container).addEvent( 'click', function(e) {
                    new Event(e).stop();
                } )
		this.current.addEvent('click', this.onDropDown.bindWithEvent(this) )
		
	},
	
	//add single option to select
	addOption: function( option ){
    	var o = new Element('div').addClass('option').setProperty('value',option.value)
		if ( option.disabled ) { o.addClass('disabled') } else {
			o.addEvents( {
				'click': this.onOptionClick.bindWithEvent(this),
				'mouseout': this.onOptionMouseout.bindWithEvent(this),
				'mouseover': this.onOptionMouseover.bindWithEvent(this)
			})
		}
		
		if ( $defined(option.getProperty('class')) && $chk(option.getProperty('class')) ) 
			o.addClass(option.getProperty('class'))

	
		if ( option.selected ) {
			if ( this.selected) this.selected.removeClass('selected');
			this.selected = o
			o.addClass('selected')
			//this.selectedOption.setText(option.text);
			this.selectedOption.set('text',option.text);
			this.hiddenInput.setProperty('value',option.value);
		}
		//o.setText(option.text)
		o.set('text',option.text)
		o.injectBefore($(this.optionsContainer).getLast())
	},
	
	onDropDown : function( e ) {

            

			if ( this.optionsContainer.getStyle('display') == 'block') {
				this.optionsContainer.setStyle('display','none')
			} else {
                            $$('.optionsContainer').hide();
				this.optionsContainer.setStyle('display','block')
				this.selected.addClass('selected')
				//needed to fix min-width in ie6
				var width =  this.optionsContainer.getStyle('width').toInt() > this._select.getStyle('width').toInt() ?
															this.optionsContainer.getStyle('width')
															:
															this._select.getStyle('width')

                                var height =  this.optionsContainer.getStyle('height').toInt() > 500 ?
															'500px'
															:
															this.optionsContainer.getStyle('height')
                                this.optionsContainer.setStyle('height', height);
                                if(this.optionsContainer.getStyle('height').toInt() == 500){ this.optionsContainer.setStyle('overflow', 'scroll'); }
                                


				this.optionsContainer.setStyle('width', width)
				this.optionsContainer.getFirst().setStyle('width', width)
				this.optionsContainer.getLast().setStyle('width', width)
			}						
	},
	onOptionClick : function(e) {
		var event = new Event(e)
		if ( this.selected != event.target ) {
			this.selected.removeClass('selected')
			event.target.addClass('selected')
			this.selected = event.target
			//this.selectedOption.setText(this.selected.getText());
			this.selectedOption.set('text',this.selected.get('text'));
			this.hiddenInput.setProperty('value',this.selected.getProperty('value'));
                        this.hiddenInput.fireEvent('change');
		}
		this.onDropDown()
	},
	onOptionMouseover : function(e){
		var event = new Event(e)
		this.selected.removeClass('selected')
		event.target.addClass('selected')
	},
	onOptionMouseout : function(e){
		var event = new Event(e)
		event.target.removeClass('selected')
	}
	
});
elSelect.implement(new Events);
elSelect.implement(new Options);

