if (Ext.ux==null) Ext.ux={};
Ext.ux.form={};

/**
 * @class Ext.ux.form.FancyCheckbox
 * @extends Ext.form.Checkbox
 * Single checkbox field.  Can be used as a direct replacement for traditional checkbox fields.
 * @constructor
 * Creates a new Checkbox
 * @param {Object} config Configuration options
 * @xtype fancycheckbox
 */
Ext.ux.form.FancyCheckbox = Ext.extend(Ext.form.Checkbox,  {
	elHeight : 25,
	inputEl : null,

	// private
	initEvents : function(){
		Ext.ux.form.FancyCheckbox.superclass.initEvents.call(this);
		this.mon(this.wrap, {
			scope: this,
			click: this.onClick,
			change: this.onClick
		});
	},

	// private
	onRender : function(ct, position){
		Ext.ux.form.FancyCheckbox.superclass.onRender.call(this, ct, position);

		this.wrap.addClass('checkbox');

		this.inputEl=Ext.select('input', true, this.wrap.id).first();
		this.inputEl.hide();
		this.inputEl.dom.id=this.id;
		if (this.inputEl.dom.checked) this.setValue(true);
		var tr = Ext.get(this.inputEl.dom.id).findParentNode('tr.radioRow',5,true);
		if(tr !== null){
			tr.on('click', function(e,t){
				var inputR = tr.child('input[type=radio]');
				var fancyCheckbox = Ext.getCmp(inputR.id);
				fancyCheckbox.setValue(true);
			});
		}
		
	},

	// private
	onClick : function(){
		this.inputEl.dom.checked=!this.inputEl.dom.checked;
		if(this.inputEl.dom.checked != this.checked){
			this.setValue(this.inputEl.dom.checked);
		}
	},


	/**
     * Sets the checked state of the checkbox, fires the 'check' event, and calls a
     * {@link #handler} (if configured).
     * @param {Boolean/String} checked The following values will check the checkbox:
     * true, 'true', '1', or 'on'. Any other value will uncheck the checkbox.
     * @return {Ext.form.Field} this
     */
	setValue : function(v){
        var checked = this.checked,
            inputVal = this.inputValue;

        this.checked = (v === true || v === 'true' || v == '1' || (inputVal ? v == inputVal : String(v).toLowerCase() == 'on'));
        if(this.rendered){
            this.inputEl.dom.checked = this.checked;
            this.inputEl.dom.defaultChecked = this.checked;
        }
        if(checked != this.checked){
            this.fireEvent('check', this, this.checked);
            if(this.handler){
                this.handler.call(this.scope || this, this, this.checked);
            }
        }
		if(this.checked == true)
		{
			this.wrap.addClass('checked');
		}
		else
		{
			this.wrap.removeClass('checked');
		}
		return this;
	}
});
Ext.reg('fancycheckbox', Ext.ux.form.FancyCheckbox);


/**
 * @class Ext.ux.form.FancyRadio
 * @extends Ext.ux.form.FancyCheckBox
 * Single radio field.  Can be used as a direct replacement for traditional radio fields.
 * @constructor
 * Creates a new Radio button
 * @param {Object} config Configuration options
 * @xtype fancyradio
 */
Ext.ux.form.FancyRadio = Ext.extend(Ext.ux.form.FancyCheckbox,  {
	inputType: 'radio',


	/**
     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
     * @method
     */
	markInvalid : Ext.emptyFn,

	/**
     * Overridden and disabled. The editor element does not support standard valid/invalid marking. @hide
     * @method
     */
	clearInvalid : Ext.emptyFn,


	/**
     * If this radio is part of a group, it will return the selected value
     * @return {String}
     */
	getGroupValue : function(){
		var p = this.inputEl.up('form') || Ext.getBody();
		var c = p.child('input[name='+this.inputEl.dom.name+']:checked', true);
		return c ? c.value : null;
	},

	onRender : function (ct, position)
	{
		Ext.ux.form.FancyRadio.superclass.onRender.call(this, ct, position);

		this.wrap.removeClass('checkbox');
		this.wrap.addClass('radio');
	},


	/**
     * Sets either the checked/unchecked status of this Radio, or, if a string value
     * is passed, checks a sibling Radio of the same name whose value is the value specified.
     * @param value {String/Boolean} Checked value, or the value of the sibling radio button to check.
     * @return {Ext.form.Field} this
     */
	setValue : function(v){
		var checkEl,
		els,
		radio;
		if (typeof v == 'boolean') {
			Ext.ux.form.FancyRadio.superclass.setValue.call(this, v);
		} else if (this.rendered) {
			checkEl = this.getCheckEl();
			radio = checkEl.child('input[name=' + this.inputEl.dom.name + '][value=' + v + ']', true);
			if(radio){
				Ext.getCmp(radio.id).setValue(true);
			}
		}
		if(this.rendered && this.checked){
			this.inputEl.dom.checked=true;
			checkEl = checkEl || this.getCheckEl();
			els = this.getCheckEl().select('input[name=' + this.inputEl.dom.name + ']');
			els.each(function(el){
				if(el.dom.id != this.id){
					var obj=Ext.getCmp(el.dom.id);
					if (obj!=null) obj.setValue(false);
				} else {
					this.inputEl.dom.checked=true;
				}
			}, this);
		}
		return this;
	},

	// private
	onClick : function(){
		if (!this.inputEl.dom.checked) this.inputEl.dom.checked=true;
		if(this.inputEl.dom.checked != this.checked){
			this.setValue(this.inputEl.dom.checked);
		}
	},

	// private
	getCheckEl: function(){
		if(this.inGroup){
			return this.inputEl.up('.x-form-radio-group');
		}
		return this.inputEl.up('form') || Ext.getBody();
	}
});
Ext.reg('fancyradio', Ext.ux.form.FancyRadio);