

var Forms={}
//Custom select control
//--------------------------------
//> INITIALIZE
//  new Forms.Select(select_obj)


Forms.select=new Class({
	init:function(obj, active_classname){
		var _this=this;
		
		this.obj=_(obj);
		this.active_classname=active_classname || "select_active";
		
		this.root=JJ.create("span").classname("select "+obj.classname());
		this.root.event({
			onclick:function(){ if(!_this.renderComlete) _this.showhide(); _this.input.focus(); }, 
			onmousedown:function(){_this.lockBlur=1}, 
			onmouseup:function(){_this.lockBlur=0}
			});
		this.field=this.root.insert("span").classname("field").event({onclick: function(){if(_this.renderComlete) _this.showhide()}});
			
		//create hidden input element for submit
		this.input=this.field.insert("input", {type:"text"});
		this.input.attr({
			value:obj.value,
			name:obj.name
		});
		this.input.attr({
			update:function(){_this.update()},
			reset:function(){_this.set(_this.input.defaultElement)},
			disable:function(b){_this.disable(b)}
		});
		//external events
		this.input.event({
			onchange:obj.onchange,
			onfocus:obj.onfocus,
			onblur:obj.onblur
		});
		this.input.event({
			onfocus:function(){ _this.active(1); },
			onblur:function(){if(!_this.lockBlur) _this.active(0)},
			onkeydown: function(e){ return _this.onkey(e)}
		});
		//copy all inline external attributes from select to input
		for(var i in obj.attributes){
			var item=obj.attributes[i];
			if(!item || !item.specified || (obj[item.name] && typeof obj[item.name]!="string" && typeof obj[item.name]!="boolean")) continue;
			this.input[item.name]=item.value;
		}
		this.holder=this.field.insert("span").classname("holder").attr({classdef:"holder"}).html("&nbsp;");
		this.arrow=this.field.insert("span").classname("arrow");
		this.dropdown=this.root.insert("span").classname("dropdown");
		
		this.root.input=this.input;
		this.input.root=this.root;
		
		this.input.options=[];
		if(obj.options.length)
			for(var i=0; i<obj.options.length; i++) {
				var el=_(obj.options[i]);
				var a=this.dropdown.insert("a")
					.classname(el.classname())
					.attr({value:el.value, i:i})
					.html(el.html()?el.html():"&nbsp;")
					.event({onclick:function(){return _this.set(this)}})
					;
				this.input.options.push(a);
				if(el.selected || obj.value==a.value) this.input.selected=this.input.defaultElement=a;
				if(el.attr("image")) a.insert("img", a.firstChild).attr({src:el.attr("image")});
			}
		
		//rendering ------------------------------------------------------------------------------
		this.obj.css({display:"none"});
		this.inherit={
			width:this.obj.css("width"),
			margin:this.obj.css(["marginTop", "marginRight", "marginBottom", "marginLeft"], true)
		};
		this.obj.parentNode.replaceChild(this.root, this.obj);
		
		if(!this.constructor.array) this.constructor.array=[];
		this.constructor.array.push(this.root); //add to constructor array (Forms.select.array)
		
		if(this.input.options.length) this.set(this.input.selected?this.input.selected:this.input.options[0]); //set default or act
		
		this.preRender(); //css rendering
		
		if(this.input.disabled) this.disable(1);
		this.isCreated=true;
	},
	
	preRender:function(){
		this.root.inherit={
			line:this.root.css("lineHeight"),
			paddingTB:this.root.css("borderTopWidth")+this.root.css("borderBottomWidth"),
			paddingLR:this.root.css("borderLeftWidth")+this.root.css("borderRightWidth")
		};
		
		this.root.inherit.height=this.root.inherit.line+this.root.inherit.paddingTB;
		if(this.root.css("position")=="static") this.root.css({position:"relative"});
		if(this.root.css("display")=="inline") this.root.css({display:"inline-block"});
		this.input.options.css({display:"block"});
		if(BROWSER.ie){
			var ow=this.root.css("width");
			var omw=this.root.css("maxWidth");
			this.root.css({width:"auto", maxWidth:"none"});
			this.root.inherit.dd_width=this.dropdown.offsetWidth;
			this.root.css({width:ow, maxWidth:omw});
		}
		if(this.inherit.width && !isNaN(this.inherit.width)) this.root.css({width:this.inherit.width}); //set inherit width if exist
		this.root.css(this.inherit.margin); //set inherit not empty margins
		if(BROWSER.ie) [this.root, _(this.root, "<")].css({zIndex:100-this.constructor.array.length}); //fix z-index for IE
		this.input.css({position:"absolute", border:0, padding:0/*});*/, width:1, height:1, opacity:0, marginLeft:-2});/**/
		this.field.css({display:"block", whiteSpace:"nowrap", cursor:"default"});
		this.dropdown.css({position:"relative", visibility:"hidden", overflowX:"hidden", overflowY:"auto", zIndex:2});
		this.input.options.css({display:"block", whiteSpace:"nowrap", textDecoration:"none"});
		this.arrow.css({position:"absolute", display:"block", top:this.field.css("borderTopWidth"), right:this.field.css("borderRightWidth"), cursor:"pointer", height:this.root.inherit.line});
		////fix
		if(BROWSER.opera) this.dropdown.css({display:"table-row-group"});
		this.root.css({height:this.root.inherit.height});/**/
		
		if(this.root.offsetWidth) this.postRender(); //render if element is visible
	},
	
	postRender:function(){
		////unfix
		this.root.css({height:"auto"});
		
		this.root.css({width:this.root.offsetWidth-this.root.inherit.paddingLR}); //fix width
		this.field.css({width:this.root.clientWidth-this.field.css("borderLeftWidth")-this.field.css("borderRightWidth")-this.field.css("marginRight")-this.field.css("marginLeft"), overflow:"hidden"});
		this.dropdown.css({position:"absolute"});
		this.dropdown.css({top:this.root.clientHeight, left:-this.root.css("borderLeftWidth"), width:Math.max(this.root.clientWidth, this.root.inherit.dd_width?this.root.inherit.dd_width:this.dropdown.offsetWidth)});
		if(BROWSER.ie6 && this.dropdown.currentStyle["max-height"] && this.dropdown.clientHeight>this.dropdown.currentStyle["max-height"]) this.dropdown.css({height:this.dropdown.currentStyle["max-height"]}); //fix for ie6
		this.renderComlete=true;
	},
	
	showhide:function(d){
		if(this.input.disabled) return false;
		if(d==undefined) d=this.dropdown.css("visibility")!="visible";
		this.dropdown.css({visibility:d?"visible":"hidden"});
		this.isOpen=d;
		return false;
	},
	
	set:function(obj, lock_hide){
		var _this=this;
		this.input.prevValue=this.input.value;
		this.input.value=obj.value;
		this.input.selected=obj;
		
		if(BROWSER.opera) setTimeout(function(){_this.holder.html(obj.html())},0);  //setTimeout for opera inline select
		else _this.holder.html(obj.html());
		this.holder.classname(this.holder.classdef+" "+obj.classname());
		
		if(!lock_hide && this.isCreated) this.showhide(0);
		
		if((this.isCreated && this.input.prevValue!=this.input.value) || (!this.isCreated && this.input.autoload!=undefined)){
			if(this.input.aref) GET(this.input); //call ajax
			if(this.input.onchange) this.input.onchange(); //call onchange event
		}
		
		//act element in dropdown
		if(this.cur) this.cur.classname("-act");
		this.cur=obj;
		this.cur.classname("+act");
		
		return false;
	},
	
	update:function(){
		for(var i=0; i<this.input.options.length; i++) {
			if(this.input.options[i].value==this.input.value){
				this.set(this.input.options[i]);
				break;	
			}				
		}
	},
	
	disable:function(b){
		this.input.disabled=b;
		this.root.css({opacity:b?0.5:1});
	},
	
	active:function(b){
		if(!this.renderComlete) this.postRender();
		this.root.classname((b?"+":"-")+this.active_classname);
		if(!b && this.isOpen) this.showhide(0); //hide dropdown if select blur
	},
	
	onkey:function(e){
		if(Event(e).key("tab") || Event(e).key("ctrl") || Event(e).key("alt") || (Event(e).key()>111 && Event(e).key()<124)) return true;
		if(Event(e).key("up") && this.cur.i) this.set(this.input.options[this.cur.i-1], true);
		if(Event(e).key("down") && this.cur.i<this.input.options.length-1) this.set(this.input.options[this.cur.i+1], true);
		if(Event(e).key("enter") || Event(e).key("space")) this.showhide(this.isOpen?0:1);
		if(Event(e).key("escape") && this.isOpen) this.showhide(0);
		return false;
	}
	
});

