var formV3 = new Class({
	
	Implements: [Options, Events],
	options: {
		debug: true
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.forms={};
		this.IE6 = (Browser.Engine.trident && Browser.Engine.version <= 4 ? true : false);
		
		if(this.IE6!=true) {
			$$('form.formV2').each(function(formEl,index) {
				if(!formEl.hasClass('fancyFormEnabled')) {
					this.formId = "formV2"+index;
					this.forms[index] = formEl;
					this.buildInput(index);
					this.buildTextarea(index);
					this.buildRadio(index);
					this.buildCheckBox(index);
					(this.IE6!=true ? this.buidSelect(index) : '' );
					this.buildSubmitBtn(index);
					formEl.addClass('fancyFormEnabled');
					formEl.setStyles({'position':'relative','z-index': (9998-index)});
				}
			},this);
		}
		
	},
	
	buildInput: function(index) {
		
		this.forms[index].getElements('input[type="text"][class!="hide"][class!="search"]').each(function(inputEl) {
			var inputText = new Element('div', {'class': 'inputText'}).wraps(inputEl);
			new Element('span', {'class': 'leftBrd'}).inject(inputText,'top');
			new Element('span', {'class': 'center'}).wraps(inputEl);
			new Element('span', {'class': 'rightBrd'}).inject(inputText);
		},this);
		
		this.forms[index].getElements('input[type="text"][class="search"]').each(function(inputEl) {
			var searchText = inputEl.get('value');
			var inputText = new Element('div', {'class': 'inputText searchFeild'}).wraps(inputEl);
			var leftBrd = new Element('span', {'class': 'leftBrd'}).inject(inputText,'top');
			new Element('span', {'class': 'loop'}).inject(leftBrd);
			new Element('span', {'class': 'center'}).wraps(inputEl);
			new Element('span', {'class': 'rightBrd'}).inject(inputText);
			inputEl.addEvents({
				'focus':function() {
					this.set('value','')
				},
				'blur':function() {
					this.set('value',searchText)
				}
			});
		},this);
		
		this.forms[index].getElements('input[type="password"][class!="hide"]').each(function(inputEl) {
			var inputText = new Element('div', {'class': 'inputText'}).wraps(inputEl);
			new Element('span', {'class': 'leftBrd'}).inject(inputText,'top');
			new Element('span', {'class': 'center'}).wraps(inputEl);
			new Element('span', {'class': 'rightBrd'}).inject(inputText);
		},this);
		
	},
	
	buildTextarea: function(index) {
		
		this.forms[index].getElements('textarea[class!="hide"]').each(function(inputEl) {
			var textarea = new Element('div', {'class': 'textarea'}).wraps(inputEl);
			new Element('div', {'class': 'innerArea'}).wraps(inputEl);
			new Element('div',{'class':'tl shadow'}).inject(textarea,'top');
			new Element('div',{'class':'dd_top shadow'}).inject(textarea,'top');
			new Element('div',{'class':'tr shadow'}).inject(textarea,'top');
			new Element('div',{'class':'right shadow'}).inject(textarea,'top');
			new Element('div',{'class':'br shadow'}).inject(textarea,'top');
			new Element('div',{'class':'dd_bottom shadow'}).inject(textarea,'top');
			new Element('div',{'class':'bl shadow'}).inject(textarea,'top');
			new Element('div',{'class':'left shadow'}).inject(textarea,'top');
		},this);
		
	},
	
	buildRadio: function(index) {
		
		var formId = this.formId;
		this.forms[index].getElements('input[type="radio"]').each(function(radioEl) {
			var radioItem = radioEl.getParent();
			var radioBtn = new Element('div', {'class': 'radio radio'+formId}).inject(radioItem,'top');
			radioEl.setStyles({
				'position': 'absolute',
				'visibility': 'hidden'
			});
			radioBtn.addEvent('click',function() {
				$$('.radio'+formId).each(function(el) {
					el.setStyle('background-position','left -902px');
				});
				this.setStyle('background-position','left -883px');
				this.getNext('input["radio"]').setProperty('checked','checked');
			});
			radioBtn.getNext('span').addEvent('click',function() {
				$$('.radio'+formId).each(function(el) {
					el.setStyle('background-position','left -902px');
				});
				this.getPrevious('div').setStyle('background-position','left -883px');
				this.getPrevious('input["radio"]').setProperty('checked','checked');
			});
			if(radioEl.getProperty('checked')) {
				radioBtn.setStyle('background-position','left -883px');
			}
			
		},this);
		
	},
	
	buildCheckBox: function(index) {
		
		var formId = this.formId;
		this.forms[index].getElements('input[type="checkbox"]').each(function(checkboxEl) {
			var checkboxItem = checkboxEl.getParent();
			var checkboxBtn = new Element('div', {'class': 'checkbox checkbox'+formId}).inject(checkboxItem,'top');
			checkboxEl.setStyles({
				'position': 'absolute',
				'visibility': 'hidden'
			});
			checkboxBtn.addEvent('click',function() {
				this.toggleClass('selected');
				if(this.hasClass('selected')) {
					this.setStyle('background-position','left -859px');
					this.getNext('input["checkbox"]').setProperty('checked','checked');
				} else {
					this.setStyle('background-position','left -838px');
					this.getNext('input["checkbox"]').removeProperty('checked');
				}
			});
			checkboxBtn.getNext('span').addEvent('click',function() {
				this.getPrevious('div').toggleClass('selected');
				if(this.getPrevious('div').hasClass('selected')) {
					this.getPrevious('div').setStyle('background-position','left -859px');
					this.getPrevious('input["checkbox"]').setProperty('checked','checked');
				} else {
					this.getPrevious('div').setStyle('background-position','left -838px');
					this.getPrevious('input["checkbox"]').removeProperty('checked');
				}
			});
			if(checkboxEl.getProperty('checked')) {
				checkboxBtn.toggleClass('selected');
				checkboxBtn.setStyle('background-position','left -859px');
			}
		},this);
		
	},
	
	buidSelect: function(index) {
		var formEl = this.forms[index];
		this.forms[index].getElements('select').each(function(selectEl,index) {
			
			var selectWrap = new Element('div',{'class':'selectWrap','style':'z-index: 9999'+(100-index)+';'}).wraps(selectEl);
			new Element('span', {'class': 'leftBrd'}).inject(selectWrap,'top');
			var initText = null;
			if(selectEl.selectedIndex) {
				initText = selectEl.options[selectEl.selectedIndex].innerHTML;
			} else {
				initText = selectEl.getElement('option').getProperty('html');
			}
			var center = new Element('span', {'class': 'center','html':initText}).inject(selectWrap,'top');
			var rightBrd = new Element('span', {'class': 'rightBrd'}).inject(selectWrap,'top');
			
			if(selectEl.getSize().x < selectWrap.getSize().x) {
				var ddWidth = Math.round(selectWrap.getSize().x-16);
			} else {
				var ddWidth = Math.round(selectEl.getSize().x+5);
			}
			var dropDown = new Element('div', {'class': 'dropDown','style':'position:absolute; width:'+(ddWidth+10)+'px;'}).inject(selectWrap,'top');
			new Element('div',{'class':'tl shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'dd_top shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'tr shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'right shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'br shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'dd_bottom shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'bl shadow'}).inject(dropDown,'top');
			new Element('div',{'class':'left shadow'}).inject(dropDown,'top');
			
			dropDown.set('tween',{duration:200});
			
			var formId = this.formId;
			var ul = new Element('ul').inject(dropDown);
			selectEl.getElements('option').each(function(el,index) {
				var li = new Element('li').inject(ul);
				var a = new Element('a',{
					'href':'javascript:void(0);',
					'html':el.get('html'),
					'class': 'dd_a_'+formId,
					'events': {
						'click': function() {
							$$('.dd_a_'+formId).each(function(el) {
								el.removeClass('selected');
							});
							this.toggleClass('selected');
							//this.setProperty('selected','selected');
							selectEl.options[index].selected = 'selected';
							center.set('html',this.get('html'));
							center.setStyle('width',(this.get('html').length*5.3));
							dropDown.fade('toggle');
							if(selectEl.getProperty('onchange')!=null) {
								if(selectEl.getProperty('target')!=null) {
									window.open(selectEl.options[index].value, (selectEl.getProperty('target')!=null) ? selectEl.getProperty('target'):'');
								} else {
									window.location = selectEl.options[index].value;
								}
								//formEl.submit();
							}
						}
					}
				}).inject(li);
				if(el.getProperty('selected')) {
					a.addClass('selected');
				}
			},this);
			selectEl.setStyles({'visibility':'hidden','width':10});
			dropDown.fade('hide');
			center.setStyle('width',center.getStyle('width'));
			center.addEvent('click', function() {
				dropDown.fade('toggle');
			});
			rightBrd.addEvent('click', function() {
				dropDown.fade('toggle');
			});
			
			$$('body').addEvent('click',function() {
				if(dropDown.getStyle('opacity').toInt()>0) {
					dropDown.fade('out');
				}
			});
			
		},this);
		
	},
	
	buildSubmitBtn: function(index) {
		
		this.forms[index].getElements('input[type="submit"]').each(function(formBtnEl) {
			if(formBtnEl.getProperty('disabled')) {
				var formBtn = new Element('span', {
					'class':'formBtn disabled',
					'style': 'cursor:normal;'
				}).wraps(formBtnEl);
			} else {
				var formBtn = new Element('a', {
					'class':'formBtn',
					'events': {
						'click': function(e) {
							if(this.forms[index].hasEvent('submit'))
								this.forms[index].fireEvent('submit');
							else
								this.forms[index].submit();
							
						}.bind(this)
					}
				}).wraps(formBtnEl);
				formBtn.addClass(formBtnEl.getProperty('class'));
			}
			new Element('span', {'class': 'leftBrd'}).inject(formBtn,'top');
			var center = new Element('span', {'class': 'center'}).wraps(formBtnEl);
			new Element('span', {'class': 'rightBrd'}).inject(formBtn);
			new Element('span', {'html':formBtnEl.getProperty('value')}).inject(center,'top');
			
			formBtnEl.removeClass('formBtn');
			formBtnEl.setStyles({'visibility':'hidden','position':'absolute'});
		},this);
		
	},
	
	log: function(text) {
		if (this.options.debug && window.console) console.log(text);
	}
	
});

var formV2 = formV3;