$.fn.selectBox = function(options){
    return this.each(function(){
        var w = $(this).css('width');
        w = (/[0-9]*px/i.test(w)) ? parseInt(w) : 300;
        var opt = {
            'border'	: 'none',
            'background': 'transparent',
            'height'	: 36,
            //'width'		: $.browser.msie ? w - 15 : w,
			'width'		: $.browser.msie ? w - 5 : w,
            'textAlign'	: 'left'
        }
        
        if ($(this).attr('opt')) {
            $.extend(opt, eval('(' + $(this).attr('opt') + ')'));
        }
        
        var select = $(this).hide();
        var options = select[0].options;
        var input_s = $('<input readonly="readonly" type="text" />').css({
            'border'	: opt.border,
            'background': opt.background
        });
        var container = select.parent();
        
        var css_divs = {
            'float'				: 'left',
            'backgroundImage'	: 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)',
            'backgroundRepeat'	: 'no-repeat',
            'width'				: 4,
            'height'			: opt.height
        };
        var css_arrow = {
            'backgroundImage'	: 'url(' + urlGlobal + '/img/i2bforms/img_select_arrow.png)',
            'width'				: 31,
            'height'			: 30,
			'marginTop'			: 3
        };
        var css_option = {
            'height'		: 20,
            'color'			: '#fff',
            'background'	: '#000',
            'cursor'		: 'pointer',
            'fontSize'		: '1.1em',
            'fontFamily'	: 'Tahoma',
            'paddingLeft'	: 5,
            'paddingRight'	: 5
        };
        var css_option_over = {};
        $.extend(css_option_over, css_option)
        css_option_over.color = '#fff';
        css_option_over.background = '#555';
        
        var drop_down = function(){
            options = select[0].options;
            if (options.length > 0) {
                divl.css('backgroundImage', 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)');
                divc.css('backgroundImage', 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)');
                diva.css('backgroundImage', 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)');
                divr.css('backgroundImage', 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)');
				arrow.css('backgroundImage', css_arrow.backgroundImage);
                options_div.empty().show();
                
                if (options.length > 6) 
                    options_div.css({
                        'overflowY'	: 'scroll',
                        'overflowX'	: 'hidden',
                        'height'	: css_option.height * 6
                    })
                var table = $('<table></table>').appendTo(options_div).css('borderCollapse', 'collapse');
                $.each(options, function(i, val){
                    var tr = $('<tr></tr>').appendTo(table);
                    var td = $('<td></td>').attr({
                        'align'	: 'left',
                        'value'	: val.value
                    }).html(val.text).appendTo(tr).css(css_option).bind('mouseover', function(){
                        $(this).css(css_option_over);
                    }).bind('mouseout', function(){
                        $(this).css(css_option);
                    }).bind('mousedown', function(){
                        select.attr('value', $(this).attr('value'));
                        input_s.val($(this).html());
                        
                        if (select.change) {
                            select.change();
                        }
                    });
                });
                
                $(document).bind('mousedown', function(e){
                    if (!$(e.target).is('.options_div')) {
                        /*divl.css('backgroundImage', css_divs.backgroundImage);
                        divc.css('backgroundImage', css_divs.backgroundImage);
                        diva.css('backgroundImage', css_divs.backgroundImage);
                        divr.css('backgroundImage', css_divs.backgroundImage);
						arrow.css('backgroundImage', css_arrow.backgroundImage);*/
                        options_div.hide();
                        input_s.focus();
                        $(document).unbind('mousedown');
                    }
                });
            }
        }
        
        var div = $('<div></div>').appendTo(container).css({
            'zIndex'	: 5000,
            'float'		: 'left',
            'position'	: 'relative',
            'height'	: css_divs.height,/*'width':opt.width,*/
            'cursor'	: 'pointer'
			//'marginTop'	: -6
        }).bind('click', drop_down);
        var divl = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition': '0px 0px'
        });
        var divc = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition': '-' + css_divs.width + 'px 0px',
            'width': opt.width - css_arrow.width - (css_divs.width * 2)
        });
        var diva = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition': '-' + css_divs.width + 'px 0px',
            'width': css_arrow.width
        });
        var divr = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition': 'right 0px'
        });
        var arrow = $('<div></div>').appendTo(diva).css(css_arrow);
        
        // Solo para centrar verticalmente el input ******
        var table = $('<table></table>').appendTo(divc).css({
            'height': '100%',
            'width': opt.width - css_arrow.width - (css_divs.width * 2)
        });
        var tr = $('<tr></tr>').appendTo(table);
        var td = $('<td></td>').appendTo(tr);
        // *****************
        
        input_s.appendTo(td).css({
            'cursor'	: 'pointer',
			'padding'	: '0px',
			'color'		: '#fff',
			'fontFamily': 'Tahoma',
            'textAlign'	: opt.textAlign,
            'width'		: opt.width - css_arrow.width - (css_divs.width * 2)
        }).bind('blur', function(){
            divl.css('backgroundImage', css_divs.backgroundImage);
            divc.css('backgroundImage', css_divs.backgroundImage);
            diva.css('backgroundImage', css_divs.backgroundImage);
            divr.css('backgroundImage', css_divs.backgroundImage);
            options_div.hide();
        });
        
        // Options **********
        var css_options_div = {
            'position'	: 'absolute',
            'background': '#ccc',
			'color'		: '#fff',
            'width'		: opt.width,
            'top'		: 35,
            'left'		: 0,
            'border'	: '1px solid #4C4B4B',
            'overflowX'	: 'hidden',
            'zIndex'	: 5001
        }
        
        var options_div = $('<div></div>').addClass('options_div').appendTo(div).css(css_options_div).hide();
        // ******************
        
        if(options.length > 0) {
            input_s.val(options[0].text);
            select.val(options[0].value);
        }
        
        var div_disabled = $('<div></div>').hide().appendTo(div).css({
            position	: 'absolute',
            top			: 0,
            left		: 0,
            width		: ($.browser.msie && $.browser.version == '6.0') ? opt.width + 4 : opt.width,
            height		: opt.height,
            background	: '#ccc',
            opacity		: 0.7
        });
        
        this.enable = function(){
            div_disabled.hide();
            div.bind('click', drop_down);
        };
        this.disable = function(){
            div_disabled.show().css('cursor', 'default');
            div.unbind('click', drop_down);
        };
        this.setValue = function(v){
            select.attr('value', v);
            input_s.val(select[0].options[select[0].selectedIndex].text);
        };
        
        if (select.attr('disabled')) {
            this.disable();
        }
    });
};

$.fn.inputBox = function(){
    return this.each(function(){
        var w = $(this).css('width');
        w = (/[0-9]*px/i.test(w)) ? parseInt(w) : 225;
        var opt = {
            'border'		: 'none',
            'background'	: 'transparent',
            'height'		: 36,
            'width'			: w,
            'textAlign'		: 'left',
			'font-family'	: 'Tahoma',
			'font-size'		: '1.1em'
        }
        
        if ($(this).attr('opt')) {
            $.extend(opt, eval('(' + $(this).attr('opt') + ')'));
        }
        
        var input = $(this).css({
            'border'		: opt.border,
            'background'	: opt.background,
			'font-family'	: 'Tahoma',
			'font-size'		: '1.1em',
			'color'			: '#fff'
        });
        var container = input.parent();
        
        var css_divs = {
            'float'				: 'left',
            'backgroundImage'	: 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)',
            'backgroundRepeat'	: 'no-repeat',
            'width'				: 4,
            'height'			: opt.height
        };
        var css_divs_error = {
            'backgroundImage'	: 'url(' + urlGlobal + '/img/i2bforms/bg_select.png)'
		};
        var div = $('<div></div>').appendTo(container).css({
            'float'		: 'left',
            'position'	: 'relative',
            'height'	: css_divs.height/*'width':opt.width,*/
        });
        var divl = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition'	: '0px 0px'
        });
        var divc = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition'	: '-' + css_divs.width + 'px 0px',
            'width'					: opt.width - (css_divs.width * 2)
        });
        var divr = $('<div></div>').appendTo(div).css(css_divs).css({
            'backgroundPosition'	: 'right 0px'
        });
        
        // Solo para centrar verticalmente el input ******
        var table = $('<table></table>').appendTo(divc).css({
            'height'	: '100%',
            'width'		: opt.width - (css_divs.width * 2)
        });
        var tr = $('<tr></tr>').appendTo(table);
        var td = $('<td></td>').appendTo(tr);
        // *****************
        
        input.appendTo(td).css({
            'textAlign'	: opt.textAlign,
            'width'		: opt.width - (css_divs.width * 2)
        }).bind('blur', function(){
            /*divl.css('backgroundImage', css_divs.backgroundImage);
            divc.css('backgroundImage', css_divs.backgroundImage);
            divr.css('backgroundImage', css_divs.backgroundImage);*/
        }).val(this.value);
		
		
		this.enableError = function() {
			divl.css('backgroundImage', css_divs_error.backgroundImage);
			divc.css('backgroundImage', css_divs_error.backgroundImage);
			divr.css('backgroundImage', css_divs_error.backgroundImage);
		};
		
		this.disableError = function() {
			divl.css('backgroundImage', css_divs.backgroundImage);
			divc.css('backgroundImage', css_divs.backgroundImage);
			divr.css('backgroundImage', css_divs.backgroundImage);
		};
		
    });
};