var FastestForm = new Class({
    Implements: Options,
    options: {
        form: null
    },
    initialize: function(form,options){
        this.setOptions(options);
        this.form = $(form);
        this.render();
    },
    render: function(){
      this.form.getElements('input[type=text], input[type=password]').each(function(textInput){this.renderInput(textInput)},this);
       this.form.getElements('input[type=checkbox]').each(function(checkbox){this.renderCheckbox(checkbox)},this);
       this.form.getElements('input[type=submit], input[type=button]').each(function(button){this.renderButton(button)},this);
       this.form.getElements('select').each(function(select){this.renderSelect(select)},this);
       this.form.getElements('textarea').each(function(textarea){this.renderTextarea(textarea)},this);

       this.form.addEvent('submit', function(e){
            this.getElements('.remove_thousand').each(function(input){
                input.value = input.value.replace(/ /gi,'');
            })
            return true;
       })
    },
    renderInput: function(input){
		input.addClass('jqtranformdone');

		//var oLabel = jqTransformGetLabel($(this));
		//oLabel && oLabel.bind('click',function(){$input.focus();});

		var inputSize=input.getSize().x.toInt();
		//	if($input.attr('size')){
		//		inputSize = $input.attr('size')*10;
		//		$input.css('width',inputSize);
		//	}

            new Element('div').inject(
                new Element('div',{'class':'jqTransformInputInner'}).inject(
                    new Element('div',{'class':'jqTransformInputWrapper'}).inject(input,'before')
                )
            ).adopt(input)

            var wrapper = input.getParent('.jqTransformInputWrapper');

			input
                .addClass("jqTransformInput")
                .addEvents({
                    'focus' : function(){wrapper.addClass("jqTransformInputWrapper_focus");},
                    'blur'  : function(){wrapper.removeClass("jqTransformInputWrapper_focus");},
                    'hover' : function(){wrapper.addClass("jqTransformInputWrapper_hover");}
                })

            title = input.getProperty('title');
            if (title){
                input.data = JSON.decode(title);
                // nastaveni defaultniho textu, tzn. ten co vidim pokud kliknu, zmizne, pokud opustim a je prazdna hodnota, objevi se
                if (input.data.def_text && input.data.def_text != ''){
                    input.addEvents({
                        'focus': function(){if (this.value == this.data.def_text) this.value = '';},
                        'blur': function(){if (this.value == '') this.value = this.data.def_text;}
                    })
                }

                // nastaveni limitu klaves
                if (input.data.limit && input.data.limit != ''){
                    // moznosti typu vstupu do inputu
                    limits = {
                        int: ['1','2','3','4','5','6','7','8','9','0','backspace','left','right','tab','f5','delete'],
                        float:['1','2','3','4','5','6','7','8','9','0',',','backspace','left','right','tab','delete']
                    };

                    if (limits[input.data.limit]){
                        input.addEvent('keypress', function(e){
                             return (limits[input.data.limit].indexOf(e.key) != -1)?true:false;
                        });
                    }
                }

                // nastaveni masky
                 if (input.data.mask && input.data.mask != ''){
                    if (input.data.mask == 'thousand'){
                        input.addEvent('keyup', function(e){
                            value = this.value;
                            if (value != ''){
                                value = value.replace(/ /gi,'');
				                var x = [], i=0, n=Number(value);
                                while( n > 999 ){
                                    x[i] = "00" + String(n%1000);
                                    x[i] = x[i].substring(x[i].length - 3);
                                    n = Math.floor(n/1000);
                                    i++;
                                }
                                x[i] = String(n%1000);
                                this.value = x.reverse().join(" ");
                            }
                        })
                        .addClass('remove_thousand')

                    }
                 }
                input.title = '';
            }

            var exist_parent_coloring = input.getParent('.bgrow');
            if (exist_parent_coloring){
                input.addEvents({
                    'focus' : function(){
                        exist_parent_coloring.morph('.bgrow_hover');
                     //   exist_parent_coloring.getElement('.bgrowR').fade(1);
                    },
                    'blur' : function(){
                        exist_parent_coloring.morph('.bgrow');
                     //   exist_parent_coloring.getElement('.bgrowR').fade(0);
                    }
                });
            }



			//$wrapper.css("width", inputSize+10);

			/* If this is safari we need to add an extra class */
			//$.browser.safari && $wrapper.addClass('jqTransformSafari');
			//$.browser.safari && $input.css('width',$wrapper.width()+16);
			//this.wrapper = $wrapper;

    },
    refreshSelect: function(select){
        this.unloadSelect(select);
        this.renderSelect(select);
    },

    unloadSelect: function(select){
        parentDiv = select.getParent('.jqTransformSelectWrapper');
        select.inject(parentDiv,'before').removeClass('jqTransformHidden');
        parentDiv.dispose();
    },

    renderSelect: function(select){
		if(select.hasClass('jqTransformHidden')) {return;}

		if(select.getProperty('multiple')) {return;}

			//var oLabel  =  jqTransformGetLabel($select);
			/* First thing we do is Wrap it */

            var wrapper = new Element('div',{'class':'jqTransformSelectWrapper'})
                .inject(select,'before')
                .adopt(select)
            selectSize = select.getSize();
            select.addClass('jqTransformHidden')

            var label = new Element('div',{html:'<span></span><a href="#" class="jqTransformSelectOpen"></a>'}).inject(select,'before');
            var ul = new Element('ul')
                .inject(select,'before')
                .setStyle('width',selectSize.x.toInt())
                .fade('hide')

            select.getElements('option').each(function(op,index){
                new Element('a',{href:'#',html:op.get('html'),index:index})
                    .inject(
                        new Element('li').inject(ul)
                    )
                    .addEvent('click',function(skip,e){

                        var exist_parent_coloring = select.getParent('.bgrow');
                        if (exist_parent_coloring && skip !== true){
                            exist_parent_coloring.morph('.bgrow');
                        //    exist_parent_coloring.getElement('.bgrowR').fade(0);
                        }
                        if (e) e.stop();
                        var sel = this.getParent('ul').getElement('.selected');
                        if (sel) sel.removeClass('selected');

                        this.addClass('selected');
                        oldSelectedIndex = select.selectedIndex;
                        select.selectedIndex = this.getProperty('index');
                        ul.fade(0).setStyle('display','none');

                        /* Fire the onchange event */
					   if (select.selectedIndex != oldSelectedIndex && skip !== true) {
					       select.selectedIndex = this.getProperty('index');
                           select.fireEvent('change');

                        }
	                   select.selectedIndex = this.getProperty('index');
                       wrapper.getElement('span').set('html',this.get('html'));

                    })
            })




			/* Nastaveni defaultni hodnoty */
            ul.getElement('a[index='+select.selectedIndex+']').fireEvent('click',[true]);


			/* udalost na otevreni */
            oLinkOpen = wrapper.getElements('a.jqTransformSelectOpen, span');
            oLinkOpen.addEvent('click', function(e){
                e.stop();
                if(select.getProperty('disabled')){
				   return false;
                }

                var exist_parent_coloring = select.getParent('.bgrow');

                if (wrapper.getElement('ul').getStyle('display') == 'none'){
                    ul.setStyle('display','block').fade(1);

                    if (exist_parent_coloring){
                        exist_parent_coloring.morph('.bgrow_hover');
                    //    exist_parent_coloring.getElement('.bgrowR').fade(1);
                    }

                } else {
                    ul.setStyle('display','none').fade(0);
                    if (exist_parent_coloring){
                        exist_parent_coloring.morph('.bgrow');
                    //    exist_parent_coloring.getElement('.bgrowR').fade(0);
                    }
                    //(function(){ul.setStyle('display','block')}).delay(1000);
                }
            })

			// nastaveni sirky

			var iSelectWidth = selectSize.x.toInt();
			var oSpan = wrapper.getElement('span');
            oLinkOpen = oLinkOpen[0];

			var newWidth = (iSelectWidth > oSpan.getSize().x.toInt())?
                    iSelectWidth + oLinkOpen.getSize().x.toInt():
                    wrapper.getSize().x.toInt();


            var newWidth = iSelectWidth + 31;



			wrapper.setStyle('width', newWidth);
			ul.setStyle('width',newWidth-2);
			oSpan.setStyle('width',iSelectWidth);
			ul.setStyles({display:'block',visibility:'hidden'});
			var iSelectHeight = ul.getElements('li').length * ul.getElement('li').getSize().y.toInt();
			if (iSelectHeight < ul.getSize().y)
                ul.setStyles({height:iSelectHeight,'overflow':'hidden'});
			ul.setStyles({display:'none',visibility:'visible'});


    },

    renderCheckbox: function(input){
    		var aLink = new Element('a',{href:'#','class':'jqTransformCheckbox'}).inject(
                new Element('span',{'class':'jqTransformCheckboxWrapper'}).inject(input,'before').adopt(input)
            )

            input.addEvent('change', function(){
                console.log('change');
                if (this.checked)
                    aLink.addClass('jqTransformChecked')
                else
                    aLink.removeClass('jqTransformChecked');

                return true;
            }).addClass('jqTransformHidden')

		      /* click udalost */
			aLink.addEvent('click',function(e){
			     e.stop();
				if(input.getProperty('disabled')){return false;}

                if (!input.checked) {
                    input.checked = true;
                    //aLink.addClass('jqTransformChecked')
                } else {
                    //aLink.removeClass('jqTransformChecked');
                    input.checked = false;
                }
                input.fireEvent('change');
            });
			// defaultni hodnota

            if (input.checked === true){
                aLink.addClass('jqTransformChecked');
            }
    },

    renderButton: function(button){
        var newBtn = new Element('button',{id:button.getProperty('id'), name:button.getProperty('name'), 'class':button.className + ' jqTransformButton'})
            .inject(button,'after')
            .addEvents({
                'mouseover': function(){this.addClass('jqTransformButton_hover')},
                'mouseout': function(){this.removeClass('jqTransformButton_hover')},
                'mousedown': function(){this.addClass('jqTransformButton_click')},
                'mouseup': function(){this.removeClass('jqTransformButton_click')}
            })
            .cloneEvents(button)
            new Element('span',{html:'<span>' + button.value + '</span>'}).inject(newBtn);
            button.dispose();
    },

    renderTextarea: function(textarea){
            textarea.addClass('jqtransformdone');

		//	oLabel = jqTransformGetLabel(textarea);
		//	oLabel && oLabel.click(function(){textarea.focus();});

			innerTable ='<tr><td class="jqTransformTextarea-tl"></td><td class="jqTransformTextarea-tm"></td><td class="jqTransformTextarea-tr"></td></tr>';
			innerTable +='<tr><td class="jqTransformTextarea-ml">&nbsp;</td><td class="jqTransformTextarea-mm"><div></div></td><td class="jqTransformTextarea-mr">&nbsp;</td></tr>';
			innerTable +='<tr><td class="jqTransformTextarea-bl"></td><td class="jqTransformTextarea-bm"></td><td class="jqTransformTextarea-br"></td></tr>';

			var oTable = new Element('table',{cellspacing:0, cellpadding:0, border:0, 'class':'jqTransformTextarea',html:innerTable});
			oTable
                .inject(textarea,'after')
                .setStyle('width',textarea.getSize().x + 10);


			textarea
                .addEvents({
                    'focus':function(){oTable.removeClass('jqTransformTextarea-hover').addClass('jqTransformTextarea-focus');},
                    'blur':function(){oTable.removeClass('jqTransformTextarea-focus');}
                })
                .inject(oTable.getElement('.jqTransformTextarea-mm div'));

				//.appendTo($('#jqTransformTextarea-mm div',oTable))
			;

			this.oTable = oTable;

            var exist_parent_coloring = textarea.getParent('.bgrow');
            if (exist_parent_coloring){
                textarea.addEvents({
                    'focus' : function(){
                        exist_parent_coloring.morph('.bgrow_hover');
                        //exist_parent_coloring.getElement('.bgrowR').fade(1);
                    },
                    'blur' : function(){
                        exist_parent_coloring.morph('.bgrow');
                        //exist_parent_coloring.getElement('.bgrowR').fade(0);
                    }
                });
            }
        /*
			if($.browser.safari){
				$('#jqTransformTextarea-mm',oTable)
					.addClass('jqTransformSafariTextarea')
					.find('div')
						.css('height',textarea.height())
						.css('width',textarea.width())
				;
			}
          */
    }


});

window.addEvent('domready',function(){
    $$('form.change_style').each(function(form){window.FastestForm = new FastestForm(form);})

})