var tSelect = function(id,skin){
	this.skin={
		topbox:'font:bold 16px/16px AppleGothic,돋움,dotum;letter-spacing:-1px;cursor:pointer;vertical-align:top;color:#495bd7;',
		subbox:'font:12px 굴림,gulim;cursor:pointer;position:absolute;top:6px;left:2px',
		arrow:'<img src="http://fn.daum-img.net/image/finance/plaza/2008/stock/common/btn_arrow02.gif" width="16" height="16" style="vertical-align:top">',
		width:'auto',
		sub_width:139,
		sub_height:24,
		max_option:9,
		scroll_css:'scroll'
	};
	daum.extend(this.skin, skin);
	
	if ( this.skin.width != "auto" ){
		this.skin.width = parseInt( this.skin.width )+"px";
		this.skin.topbox += ';width:'+this.skin.width;
	}
	this.input=$(id);
	this.id=id;
	this.list=[];
	this.isopen=0;
	this.selectedIndex=(this.input.selectedIndex < 0) ? 0 : this.input.selectedIndex;
	this.value='';
	this.print();

};
tSelect.prototype={
	close:function(){
		if(!this.isopen) return;
		$('UISelectSub_'+this.id).style.display='none';
		this.isopen=0;
		//this.focus();
	},
	blur:function(){
		//var topSelectClassName = $('UISelectSel_'+this.id).className.replace("selected_txt","default_txt");
		//$('UISelectSel_'+this.id).className=topSelectClassName;
	},
	focus:function(){
		//var topSelectClassName = $('UISelectSel_'+this.id).className.replace("default_txt","selected_txt");
		//$('UISelectSel_'+this.id).className=topSelectClassName;
	},
	open:function(){
		if(this.isopen) return;	
		var thisObj = $('UISelectSub_'+this.id);
		thisObj.style.display='block';
		//this.blur();
		var thisClassName = thisObj.getElementsByTagName('DIV')[this.selectedIndex].className.replace("default_txt","selected_txt");
		thisObj.getElementsByTagName('DIV')[this.selectedIndex].className=thisClassName;
		this.isopen=1;		
	},
	toogle:function(e){
		if(this.isopen)	this.close();
		else this.open();
		daum.Event.stopEvent(e);
	},
	subOver:function(e){
		this.el=daum.$(e)
		var thisClassName = this.el.className.replace("default_txt","selected_txt");
		var selectedClassName = $('UISelectSub_'+this.id).getElementsByTagName('DIV')[this.selectedIndex].className.replace("selected_txt","default_txt");

		$('UISelectSub_'+this.id).getElementsByTagName('DIV')[this.selectedIndex].className=selectedClassName;
		this.el.className=thisClassName;
	},
	subOut:function(e){
		this.el=daum.$(e);
		var thisClassName = this.el.className.replace("selected_txt","default_txt");
		this.el.className=thisClassName;
	},
	subClick:function(e){
		this.el=daum.$(e);
		var selectedIndex=this.el.index;
		this.value=this.list[selectedIndex].value;
		$('UISelectSel_'+this.id).replaceChild(document.createTextNode(this.list[selectedIndex].text),$('UISelectSel_'+this.id).childNodes[0]);
		//$('UISelectSel_'+this.id).innerHTML=this.list[selectedIndex].text;
		$(this.id).value=this.list[selectedIndex].value;
		if ( this.skin.path == true ){
			var topWidth = $('UISelectTop_'+this.id).offsetWidth;
			var subWidth = $('UISelectSubInner_'+this.id).offsetWidth;
			if ( topWidth>this.autoSize ){
				$('UISelectSubInner_'+this.id).style.width = topWidth + "px";
			} else {
				$('UISelectSubInner_'+this.id).style.width = this.autoSize + "px";
			}
		}
		this.close();

		daum.Event.stopEvent(e);
		if(selectedIndex!=this.selectedIndex) {
			if(this.input.onchange) { this.input.onchange.call(this);}
		}
		this.selectedIndex=selectedIndex;
	},
	print:function(){
		var id=this.id;
		var opt=this.input.options;
		var sb = [];
		var autoWidth = 0;
		for(var i=0,cnt=opt.length; i<cnt; i++)
		{
			var checkAttr = opt[i].getAttribute("checked");
			var checkDiv = "";
			var className = opt[i].className + ' default_txt';
			this.list[i]={text:opt[i].text,value:opt[i].value,check:checkAttr};
			if ( autoWidth < opt[i].text.length ){
				autoWidth = checkDiv+opt[i].text.length ;
			}
			sb.push('<div class="'+className+'" style="line-height:'+this.skin.sub_height+'px;height:'+this.skin.sub_height+'px">'+checkDiv+opt[i].text+'</div>');
		}
		
		/*if ( this.skin.width == "auto" ){
			this.skin.widthAuto = (parseInt(autoWidth)+3)+"em";
		} else {
			this.skin.widthAuto = this.skin.width;
		}*/


		this.value=this.list[0].value;

		/*var s='\
		<div id="UISelectTop_'+id+'" style="position:relative;'+this.skin.topbox+'">\
			<div id="UISelectSel_'+id+'" style="padding:'+this.skin.padding+'px">'+this.list[this.selectedIndex].text+'</div>\
			<div style="position:absolute;right:0;top:0;">'+this.skin.arrow+'</div>\
		</div>\
		<div id="UISelectSub_'+id+'" style="display:none;position:absolute;z-index:2;"><span class="optionBG" style="position:absolute;display:block"></span><span id="UISelectSubInner_'+id+'" style="display:block;width:'+this.skin.sub_width+'px;'+this.skin.subbox+'">'+sb.join("")+'</span></div>';
		*/
		var s='\
		<div id="UISelectTop_'+id+'" style="'+this.skin.topbox+'">\
			<span id="UISelectSel_'+id+'">'+this.list[this.selectedIndex].text+'</span>\
			'+this.skin.arrow+'\
		</div>\
		<div id="UISelectSub_'+id+'" style="display:none;position:absolute;z-index:2;"><span class="optionBG" style="position:absolute;display:block"></span><span id="UISelectSubInner_'+id+'" style="display:block;width:'+this.skin.sub_width+'px;'+this.skin.subbox+'">'+sb.join("")+'</span></div>';

		this.input.style.display='none';
		document.write(s);

		if(cnt>this.skin.max_option) {
			var sub = $('UISelectSubInner_'+this.id);
			sub.style.height = this.skin.max_option * this.skin.sub_height + "px";
			sub.style.overflowY = "auto";
			sub.style.overflowX = "hidden";
			sub.className = this.skin.scroll_css;
		}

		var self=this;
		daum.Event.addEvent($('UISelectTop_'+id), "mousedown", daum.Function.bindAsEventListener(this.toogle, this) );
		daum.Event.addEvent(document, "mousedown", daum.Function.bind(this.close, this));
		daum.Event.addEvent($('UISelectSub_'+id), "mousedown", function(e) { daum.Event.stopEvent(e) } );
		var sub=$('UISelectSub_'+id).getElementsByTagName('div');
		for(var i=0; i<sub.length; i++)
		{	
			sub[i].index=i;
			daum.Event.addEvent(sub[i], "mouseover", daum.Function.bind(this.subOver, this, sub[i] ) );
			daum.Event.addEvent(sub[i], "mouseout",  daum.Function.bind(this.subOut, this, sub[i]) );
			daum.Event.addEvent(sub[i], "mousedown", daum.Function.bind(this.subClick, this, sub[i]) );
		}
		$('UISelectSub_'+id).style.display = "block";
		this.autoSize = $('UISelectSub_'+id).offsetWidth;
		$('UISelectSub_'+id).style.display = "none";
	}
};