var FORM_STYLING = new Class({
	Implements:Options,
 
	options:{
		myops:0.9 
	},
 
	initialize: function(){ 
		
    },
    
    parse:function(){
    	var s = $(document.body).getElements('select[class*=styling]');
		s.each(function(e,i){
			this._replaceSelect(e);
		}.bind(this));
		
		var s = $(document.body).getElements('input[class*=stylingKeywords][type=text]');
		s.each(function(e,i){
			this._replaceKeywords(e);
		}.bind(this));
    },
    
    _replaceKeywords:function(e){
    	var t		 = $(e).getProperty('title');
    	var v		 = $(e).getProperty('value');
    	$(e).removeProperty('title');
    	var datas	 = t.parseQueryString();
    	datas.dest=datas.dest?datas.dest:$(datas.form).get('action');
    	/*
    	 * datas.default
    	 * datas.form
    	 */

    	$(e)
    	.setProperty('autocomplete','off')
    	.store('datas',datas);
    	
    	
    	$(e).addEvents({
     		'focus':function(){
    			var datas = this.retrieve('datas');
    			
    			var val = (this.value == datas.Default) ? '' : this.value;
     			this.set('value',val)
     			.removeClass('desabled');
     		},
     		'blur':function(){
     			var datas = this.retrieve('datas');
     			var val = this.value==''?datas.Default:this.value;
     			var Class = val==datas.Default? 'desabled' : 'noclass';
     			this
     			.removeClass('desabled')
     			.addClass(Class)
     			.set('value',val);
     		}
     	}).fireEvent('blur');
    	 
    	$(datas.form).addEvents({
     		'submit':function(){ 
    		 
    			var e = this.retrieve('e');
    			var datas = this.retrieve('datas');
    			$(e).set('value',$(e).get('value').replace(datas.Default,''));
    			$(e).set('value',$(e).get('value').replace('.',''));
    			
     			var val =$(e).get('value');
     			if(val==datas.Default || val == '' ){
     				if(!datas.empty)return false;
     			}
     			var RegSplit = new RegExp("[, ]", "g" ) ;
     			var RegClean = new RegExp("[^a-zA-Z0-9_ ]", "g" ) ;
     			
 
     			var req =  $(e).get('value');
     			
     			req = 	
     			req
     			/*.replace(RegClean, "")*/ 
     			.stripScripts()
     			.stripTags()
     			.tidy()
     			.trim()
     			.split(RegSplit)
     			.erase(' ')
     			.erase('')
     			.join('+')
     			;
     	 
     			this.set('action',datas.dest+'?r='+req);
     			/*return false;*/
     		}
     	})
     	.store('e',e) 
     	.store('datas',datas);    	
    },
 
 
    _refreshOption:function(e){
    	var c=$(e).getElements('option');
    	var s=$(e).getElements('option:selected')[0];
    	var selProps = $(e).getProperties('id', 'class');
    	var container = selProps.id+'styling_list';
    	var select = selProps.id+'styling';
    	$(e).set('value','all').store('value','all');
    	$(container).empty();
 
    	c.each(function(o,i){
    		this._replaceSelectAddOptions(e,container,o);
    	}.bind(this));

    	var s=$(e).getElements('option:selected')[0];
    	$(container).slide('out');
    	$(select).fireEvent('addHTML').fireEvent('desabled'); 
    },
    
    
    
    
    _replaceSelectAddOptions:function(e,l,o){ 
    	var current=o.get('value')==$(e).retrieve('value')?true:false;
    	var selected = current?'selected':'';
		var opts =new Element('div',{
			'styles':{ 
				'cursor':'pointer'
			}
			,'class':'options '+$(o).getProperty('class')+' '+selected
			,'html':$(o).get('html')
			,'events':{
				'click':function(){
					var s = this.retrieve('Select');
					var b = this.getParent().getElements('option');
					var h = this.getParent().retrieve('h'); 
					this.getParent().getChildren().removeClass('selected');
					this.addClass('selected');
 
					$(this.getParent()).slide('out');
				 
					$(s)
					.store('value',this.retrieve('value'))
					.set('value',this.retrieve('value'))
					.fireEvent('change');
					var desabled=$(e).retrieve('value')=='all'?'desabled':'';
					$(h)
					/*.getChildren(1)*/
					.set('html','<div>'+this.get('html')+'</div>')
					.fireEvent('addHTML')
					.fireEvent('desabled')
					.removeClass('desabled') 
					.addClass(desabled);
				}
				,'mouseover':function(){
					var s = this.retrieve('Select');
					this.removeClass('out').addClass('over');
					$(s).fireEvent('mouseover');
				}
				,'mouseout':function(){
					var s = this.retrieve('Select'); 
					this.removeClass('over').addClass('out');
					$(s).fireEvent('mouseout');
				}
			}
		});
		opts
		.store('Select',e) 
		.store('value',o.get('value'));
 
		$(l).grab(opts);
 
    },
    
    
    
	_replaceSelect:function(e){ 
    	
    	var c=$(e).getElements('option');
    	var s=$(e).getElements('option:selected')[0];
    	var p		 = $(e).getParent();
    	var selProps = $(e).getProperties('id', 'class');
    	$(e)
    	.hide()
    	.store('value',$(s).get('value'))
    	.setProperty('value',$(s).get('value'));
 
    	
    	var l=new Element('div',{
    		 'id'	:selProps.id+'styling_list'
    		,'class':'options_container' 
    	});
 
    	c.each(function(o,i){
    		this._replaceSelectAddOptions(e,l,o);
    	}.bind(this));
    	
    	
    	
    	var lc=new Element('div',{ 
    		'styles':{ 
    				'border':'0px solid black'
    				,'position'	:'absolute'
    		    	,'z-index'	:'1'
    		} 
    	})
    	.store('list',l); 
    	
 
    	var h=new Element('div',{
    		'styles':{
    			'cursor'	:'pointer'    	    				 
    		}
    		,'id'	:selProps.id+'styling'
    		,'class':$(e).getProperty('class').replace('styling','')+' cbes_select_custom '
    		,'events':{
    			'click':function(){
    				var l = this.retrieve('list');
    				$$('.options_container').slide('out');
    				$(l).slide('toggle');
    			},
    			'desabled':function(){
    				this.removeClass('desabled');
    				if($(this.retrieve('e')).get('value')=='all'){
    					this.addClass('desabled')
    				}
    			},
    			'addHTML':function(){
    				var s = $(this.retrieve('list').getElement('div[class*=selected]'));
    				if(s){
    					this.set('html','<div>'+$(s).get('html')+'</div>')
    				}
    			}
    		}
    	})
    	.store('list',l)
    	.store('e',e)
    	
    	; 
 
    	l.store('h',h);
    	p.grab(h).grab(lc.grab(l));
    	l.slide('out');
    	h
    	.fireEvent('desabled')
    	.fireEvent('addHTML')
 
	}
});

 
window.addEvent('domready', function() {
	var f =new FORM_STYLING();
	f.parse();
});