1 //<script type="text/javascript">
3 * @class Ext.form.Checkbox
4 * @extends Ext.form.Field
5 * Single checkbox field. Can be used as a direct replacement for traditional checkbox fields.
7 * Creates a new Checkbox
8 * @param {Object} config Configuration options
10 Ext.form.StarField = function(config){
11 Ext.form.StarField.superclass.constructor.call(this, config);
15 Ext.extend(Ext.form.StarField, Ext.form.Field, {
18 * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
22 * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
24 focusClass : undefined,
26 * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to "x-form-field")
28 fieldClass: 'x-form-field',
30 * @cfg {Boolean} checked True if the the checkbox should render already checked (defaults to false)
34 * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
35 * {tag: "input", type: "checkbox", autocomplete: "off"})
37 // defaultAutoCreate : { tag: 'div' },
38 defaultAutoCreate : { tag: 'input', type: 'hidden', autocomplete: 'off'},
40 * @cfg {String} addTitle Text to include for adding a title.
44 onResize : function(){
45 Ext.form.Field.superclass.onResize.apply(this, arguments);
49 initEvents : function(){
50 // Ext.form.Checkbox.superclass.initEvents.call(this);
56 getResizeEl : function(){
60 getPositionEl : function(){
65 onRender : function(ct, position){
67 this.style = this.style || '';
68 var style = this.style;
72 Ext.form.StarField.superclass.onRender.call(this, ct, position);
73 this.wrap = this.el.wrap({cls: 'x-menu-check-item '});
74 this.viewEl = this.wrap.createChild({ tag: 'img', src: Roo.BLANK_IMAGE_URL });
77 this.viewEl.applyStyles('width:60px;height:15px;margin:3px;margin-left:1px;');
78 this.viewEl.applyStyles('background-image: url(' + rootURL +'/Pman/templates/images/fivestars.gif);' );
81 //if(this.inputValue !== undefined){
82 //this.setValue(this.value);
83 this.viewEl.on('mouseup', function(e) {
84 var xy = _this.viewEl.getXY();
85 var offset = Math.floor( (e.xy[0] - xy[0]) / 12.0) +1;
86 _this.setValue(offset);
88 this.viewEl.on('mousemove', function(e) {
89 var xy = _this.viewEl.getXY();
90 var offset = Math.floor( (e.xy[0] - xy[0]) / 12.0) +1;
91 _this.viewEl.setStyle('background-color', '#eee');
92 _this.viewEl.setStyle('background-position', '-' + (60 - (offset * 12)) + ' 0');
94 this.viewEl.on('mouseout', function(e) {
95 _this.setValue(_this.value);
102 initValue : Ext.emptyFn,
105 * Returns the checked state of the checkbox.
106 * @return {Boolean} True if checked, else false
110 * Sets the value of the item.
111 * @param {Boolean/String} checked True, 'true', '1', or 'on' to check the checkbox, any other value will uncheck it.
113 setValue : function(v){
124 this.viewEl.setStyle('background-color', '#fff');
125 this.viewEl.setStyle('background-position', '-' + (60 - (v * 12)) + ' 0');
128 Roo.form.StarField.superclass.setValue.call(this, v);