git.roojs.org Git - xtuple/blob - lib/enyo-x/source/widgets/checkbox.js

   1 /*jshint node:true, indent:2, curly:true, eqeqeq:true, immed:true, latedef:true, newcap:true, noarg:true,
   2 regexp:true, undef:true, trailing:true, white:true */
   3 /*global XT:true, Globalize:true, enyo:true, _:true */
   4
   5 (function () {
   6
   7   /**
   8     @name XV.CheckboxWidget
   9     @class An input control consisting of fittable columns:
  10       label, decorator, and checkbox.<br />
  11     Use to implement a styled checkbox
  12       which is made up of a checkbox input control and its label.
  13     @extends XV.Input
  14    */
  15   enyo.kind({
  16     name: "XV.CheckboxWidget",
  17     kind: "XV.InputWidget",
  18     classes: "xv-checkboxwidget",
  19     components: [
  20       {controlClasses: 'enyo-inline', components: [
  21         {name: "label", classes: "xv-label"},
  22         {kind: "onyx.InputDecorator", components: [
  23           {name: "input", kind: "onyx.Checkbox", onchange: "inputChanged"}
  24         ]}
  25       ]}
  26     ],
  27     /**
  28     @todo Document the clear method.
  29     */
  30     clear: function (options) {
  31       this.setValue(false, options);
  32     },
  33     /**
  34     @todo Document the create method.
  35     */
  36     create: function () {
  37       this.inherited(arguments);
  38       this.labelChanged();
  39     },
  40     disabledChanged: function () {
  41       this.inherited(arguments);
  42       this.$.label.addRemoveClass("disabled", this.getDisabled());
  43     },
  44     /**
  45     @todo Document the inputChanged method.
  46     */
  47     inputChanged: function (inSender, inEvent) {
  48       var input = this.$.input.getValue();
  49       this.setValue(input);
  50     },
  51     /**
  52     @todo Document the labelChanged method.
  53     */
  54     labelChanged: function () {
  55       var label = (this.getLabel() || ("_" + this.attr || "").loc()) + ":";
  56       this.$.label.setContent(label);
  57     },
  58     /**
  59     @todo Document the valueChanged method.
  60     */
  61     valueChanged: function (value) {
  62       this.$.input.setValue(value);
  63       return value;
  64     }
  65   });
  66
  67   /**
  68     @name XV.StickyCheckboxWidget
  69     @class An input control consisting of fittable columns:
  70       label, decorator, and checkbox.<br />
  71     Use to implement a styled checkbox
  72       which is made up of a checkbox input control and its label.
  73       Remembers last checked setting using cookies. Not to be
  74       used with models.
  75     The object should be given a unique name as the name of the
  76     object will be used for the cookie name.
  77     @extends XV.Input
  78    */
  79   enyo.kind(/** @lends XV.StickyCheckboxWidget# */{
  80     name: "XV.StickyCheckboxWidget",
  81     classes: "xv-input xv-checkboxwidget",
  82     published: {
  83       label: "",
  84       disabled: false,
  85       checked: false
  86     },
  87     events: {
  88       onValueChange: ""
  89     },
  90     components: [
  91       {controlClasses: 'enyo-inline', components: [
  92         {name: "label", classes: "xv-label"},
  93         {kind: "onyx.InputDecorator", components: [
  94           {name: "input", kind: "onyx.Checkbox", onchange: "inputChanged"}
  95         ]}
  96       ]}
  97     ],
  98     /**
  99     @todo Document the clear method.
 100     */
 101     clear: function () {
 102       this.$.input.setValue(false);
 103     },
 104     /**
 105     @todo Document the create method.
 106     */
 107     create: function () {
 108       var value,
 109         toBoolean = function (val) {
 110           if (_.isString(val)) {
 111             return val === "true" ? true : false;
 112           }
 113           return val;
 114         };
 115
 116       this.inherited(arguments);
 117       this.labelChanged();
 118       if (this.name === "stickyCheckboxWidget") {
 119         this._err = true;
 120         throw "Sticky Checkbox Widget should have a unique name.";
 121       } else {
 122         value = toBoolean(enyo.getCookie(this.name));
 123         value = _.isBoolean(value) ? value : this.checked;
 124         this.checked = value;
 125         this.$.input.setValue(value);
 126       }
 127     },
 128     disabledChanged: function () {
 129       var disabled = this.getDisabled();
 130       this.$.input.setDisabled(disabled);
 131       this.$.label.addRemoveClass("disabled", disabled);
 132     },
 133     /**
 134     @todo Document the focus method.
 135     */
 136     focus: function () {
 137       this.$.input.focus();
 138     },
 139     inputChanged: function (inSender, inEvent) {
 140       this.setChecked(this.$.input.checked);
 141     },
 142     isChecked: function () {
 143       return this.$.input.checked;
 144     },
 145     /**
 146     @todo Document the labelChanged method.
 147     */
 148     labelChanged: function () {
 149       var label = (this.getLabel() || ("_" + this.attr || "").loc()) + ":";
 150       this.$.label.setContent(label);
 151     },
 152     checkedChanged: function () {
 153       this.$.input.setChecked(this.checked);
 154       if (!this._err) {
 155         enyo.setCookie(this.name, this.checked);
 156       }
 157       this.doValueChange({value: this.checked});
 158     }
 159   });
 160
 161 }());