function CustomF(cform){
  this.cForm_id  = cform;
  this.cForm = null;
  this.arrSelect = new Array();
  this.arrInput = new Array();
  this.selectClass = 'cust_select';
  this.curLi = null;
  this.preload = true;
}

CustomF.prototype.init = function(){
			this.cForm = ById(this.cForm_id);
			if(!this.cForm) return;
			this.arrSelect = ByTag(this.cForm, 'select');
			for(var i=0; i<this.arrSelect.length;i++){
				if(this.arrSelect[i].className == this.selectClass){
				this.TransformSelect(this.arrSelect[i],i);
				}
			}
			this.arrInput = ByTag(this.cForm, 'input');
			for(var i=0; i<this.arrInput.length;i++){
				if(this.arrInput[i].className == this.selectClass && (this.arrInput[i].type == 'checkbox' || this.arrInput[i].type == 'radio')){
				this.TransformCheckbox(this.arrInput[i],i);
				}
			}


		if(this.preload){
			var images = new Array();
			for(var i =0; i<3;i++){
				images[i] = new Image();
				}
			images[0].src = '/images/custom_ch_n.gif';
			images[1].src = '/images/custom_ch_s.gif';
			images[2].src = '/images/custom_sel_bg.gif';
		}
	}


CustomF.prototype.ShowSelect = function(){
		var ul = ByTag(this.parentNode, 'ul')[0];
		var arrUl =  ByTag(CustForm.cForm, 'ul');
		var curUldisp = ul.style.display;
		for(var i=0;i<arrUl.length;i++)
			{
				arrUl[i].style.display = 'none';
			}
		ul.style.display  = (curUldisp == 'none') ? 'block' : 'none';

			var index = CustForm.ReturnSelectIndex(this.id);
			var arrLi = new Array();
			arrLi  = ByTag(ul, 'li');
			for(var i=0;i<arrLi.length;i++){
				if(i==index){
						arrLi[i].className = 'select';}
				else arrLi[i].className = '';
			}
		}

CustomF.prototype.ReturnSelectIndex = function(id){
		var id_ = id.replace(/^([a-zA-Z]*)_/,'');
		var select_ = ById(id_);
		return select_.selectedIndex;
		}

CustomF.prototype.ResetForm = function(){
	CustForm.cForm.reset();
			for(var i=0; i<CustForm.arrSelect.length;i++){
				if(CustForm.arrSelect[i].className == CustForm.selectClass){
				var el_sp = ById('sp_'+CustForm.arrSelect[i].id);
				el_sp.innerHTML = CustForm.arrSelect[i].value;
				}
			}
			for(var i=0; i<CustForm.arrInput.length;i++){
				if(CustForm.arrInput[i].className == CustForm.selectClass && CustForm.arrInput[i].type == 'checkbox'){
				var el_sp = ById('sp_'+CustForm.arrInput[i].id);
				el_sp.className = (CustForm.arrInput[i].checked==true) ? 'custform_ch_box_s' : 'custform_ch_box_n';
				}
			}
	}



CustomF.prototype.SelectHover = function(){
		var arrLi =  ByTag(this.parentNode, 'li');
		var curLiClass = this.className;
		for(var i=0;i<arrLi.length;i++){
				arrLi[i].className = '';
			}
		this.className = 'select';
		}

CustomF.prototype.SelectClick = function(){
		var reg  = new RegExp("([^_]+)_([0-9]{1,5})",'i');
		var res = reg.exec(this.id);
		var span_ = ById('sp_'+res[1]);
		span_.innerHTML = this.innerHTML;
		var select_ = ById(res[1]);
		select_.selectedIndex = res[2];
		this.parentNode.style.display = 'none';
		}

CustomF.prototype.ChangeCheckBoxState = function(el,span){
	    if(el.checked==true){
				el.checked = false;
				span.className = 'custform_ch_box_n';
			}
		else{
				el.checked = true;
				span.className = 'custform_ch_box_s';
			}
		 if(el.onclick){
		  el.onclick();
		  }
		}

CustomF.prototype.CheckBoxClick = function(){
		var el_id = this.id.replace(/^([a-zA-Z]*)_/,'');
		var el = ById(el_id);
		CustForm.ChangeCheckBoxState(el,this);
		}

CustomF.prototype.UnSelectRadioGroup = function(name){
     for (var i=0; i< this.arrInput.length; i++) {
    		 if (this.arrInput[i].name == name) {
              	 this.arrInput[i].checked = false;
              	 var span = ById('sp_'+this.arrInput[i].id);
              	 span.className = 'custform_ch_box_n';
			 }
      		}
	}

CustomF.prototype.RadioClick = function(){
		var el_id = this.id.replace(/^([a-zA-Z]*)_/,'');
		var el = ById(el_id);
        CustForm.UnSelectRadioGroup(el.name);
        CustForm.ChangeCheckBoxState(el,this);
		}

CustomF.prototype.TransformSelect = function(el,index){
			el.style.display = 'none';
			var div_= document.createElement("span");
			var span_= document.createElement("span");
			ul_= document.createElement("ul");
			span_.id = 'sp_'+el.id;
			span_.style.zIndex = 0;
			div_.id = 'cust_s'+el.id;
			div_.style.zIndex  = 100- index;
			ul_.style.zIndex = 100 - index;
			ul_.style.display = 'none';

			var option = new Array();
			for(var i=0;i<el.length;i++){
				option[i] = document.createElement("li");
				option[i].appendChild(document.createTextNode(el.options[i].text));
				option[i].id = ''+el.id+'_'+i;

				if(el.options[i].selected)
					{
					span_.appendChild(document.createTextNode(el.options[i].text))
					option[i].className = 'select';
					}
				ul_.appendChild(option[i]);
				option[i].onmouseover = this.SelectHover;
				option[i].onclick = this.SelectClick;
			}
			div_.appendChild(span_);
			div_.appendChild(ul_);
			el.parentNode.insertBefore(div_, el);
			ul_.className = 'custform_ul';
			div_.className = 'custform_sel_box';
			span_.onclick = this.ShowSelect;
		}


CustomF.prototype.TransformCheckbox = function(el,index){
			el.style.display = 'none';
			var span_= document.createElement("span");
			if(el.checked == true){
				span_.className = 'custform_ch_box_s';
			}
			else {span_.className = 'custform_ch_box_n';}
			span_.style.zIndex = index  + 10;
			el.id = (el.id) ? el.id  : 'checkboxNew'+index;
			span_.id = 'sp_'+el.id;
			el.parentNode.insertBefore(span_, el);
			span_.onclick = (el.type == 'checkbox') ? this.CheckBoxClick : this.RadioClick;
	}
CustomF.prototype.SetFileHandle = function(){
 if(this.cForm && this.cForm.attach)
	 {this.cForm.attach.onchange  = this.FileHandle;}
}

CustomF.prototype.FileHandle = function(){
 var file_name = ById('attach_box');
 if(CustForm.cForm.attach){
     file_name.innerHTML = CustForm.cForm.attach.value;
 }
}


var  CustForm = new CustomF('order_form');
arrEvents.push('CustForm.init()');
arrEvents.push('CustForm.SetFileHandle()');