@qooxdoo/framework 7.0.0-beta.6 → 7.0.0

package/source/class/qx/ui/form/RadioButton.js

@@ -36,21 +36,17 @@
  *   container.add(female);
  * </pre>
  */
-qx.Class.define("qx.ui.form.RadioButton",
-{
-  extend : qx.ui.form.Button,
-  include : [
-    qx.ui.form.MForm,
-    qx.ui.form.MModelProperty
-  ],
-  implement : [
+qx.Class.define("qx.ui.form.RadioButton", {
+  extend: qx.ui.form.Button,
+  include: [qx.ui.form.MForm, qx.ui.form.MModelProperty],
+
+  implement: [
     qx.ui.form.IRadioItem,
     qx.ui.form.IForm,
     qx.ui.form.IBooleanForm,
     qx.ui.form.IModel
   ],
 
-
   /*
   *****************************************************************************
      CONSTRUCTOR
@@ -60,13 +56,12 @@ qx.Class.define("qx.ui.form.RadioButton",
   /**
    * @param label {String?null} An optional label for the radio button.
    */
-  construct : function(label)
-  {
+  construct(label) {
     if (qx.core.Environment.get("qx.debug")) {
       this.assertArgumentsCount(arguments, 0, 1);
     }
 
-    this.base(arguments, label);
+    super(label);
 
     // ARIA attrs
     // Important: (Grouped) radio btns should be children of a div with role 'radiogroup'
@@ -79,84 +74,65 @@ qx.Class.define("qx.ui.form.RadioButton",
     this.addListener("keypress", this._onKeyPress);
   },
 
-
-
-
   /*
   *****************************************************************************
      PROPERTIES
   *****************************************************************************
   */
 
-  properties :
-  {
+  properties: {
     /** The assigned qx.ui.form.RadioGroup which handles the switching between registered buttons */
-    group :
-    {
-      check  : "qx.ui.form.RadioGroup",
-      nullable : true,
-      apply : "_applyGroup"
+    group: {
+      check: "qx.ui.form.RadioGroup",
+      nullable: true,
+      apply: "_applyGroup"
     },
 
     /** The value of the widget. True, if the widget is checked. */
-    value :
-    {
-      check : "Boolean",
-      nullable : true,
-      event : "changeValue",
-      apply : "_applyValue",
+    value: {
+      check: "Boolean",
+      nullable: true,
+      event: "changeValue",
+      apply: "_applyValue",
       init: false
     },
 
     // overridden
-    appearance :
-    {
-      refine : true,
-      init : "radiobutton"
+    appearance: {
+      refine: true,
+      init: "radiobutton"
     },
 
     // overridden
-    allowGrowX :
-    {
-      refine : true,
-      init : false
+    allowGrowX: {
+      refine: true,
+      init: false
     }
   },
 
-
-
   /*
   *****************************************************************************
      MEMBERS
   *****************************************************************************
   */
   /* eslint-disable @qooxdoo/qx/no-refs-in-members */
-  members :
-  {
+  members: {
     // overridden
     /**
      * @lint ignoreReferenceField(_forwardStates)
      */
-    _forwardStates :
-    {
-      checked : true,
-      focused : true,
-      invalid : true,
-      hovered : true
+    _forwardStates: {
+      checked: true,
+      focused: true,
+      invalid: true,
+      hovered: true
     },
 
     // overridden (from MExecutable to keep the icon out of the binding)
     /**
      * @lint ignoreReferenceField(_bindableProperties)
      */
-    _bindableProperties :
-    [
-      "enabled",
-      "label",
-      "toolTipText",
-      "value",
-      "menu"
-    ],
+    _bindableProperties: ["enabled", "label", "toolTipText", "value", "menu"],
 
     /*
     ---------------------------------------------------------------------------
@@ -165,18 +141,13 @@ qx.Class.define("qx.ui.form.RadioButton",
     */
 
     // property apply
-    _applyValue : function(value, old)
-    {
-      value ?
-        this.addState("checked") :
-        this.removeState("checked");
+    _applyValue(value, old) {
+      value ? this.addState("checked") : this.removeState("checked");
       this.getContentElement().setAttribute("aria-checked", Boolean(value));
     },
 
-
     /** The assigned {@link qx.ui.form.RadioGroup} which handles the switching between registered buttons */
-    _applyGroup : function(value, old)
-    {
+    _applyGroup(value, old) {
       if (old) {
         old.remove(this);
       }
@@ -186,9 +157,6 @@ qx.Class.define("qx.ui.form.RadioButton",
       }
     },
 
-
-
-
     /*
     ---------------------------------------------------------------------------
       EVENT-HANDLER
@@ -202,7 +170,7 @@ qx.Class.define("qx.ui.form.RadioButton",
      *
      * @param e {qx.event.type.Event} execute event
      */
-    _onExecute : function(e) {
+    _onExecute(e) {
       var grp = this.getGroup();
       if (grp && grp.getAllowEmptySelection()) {
         this.toggleValue();
@@ -211,7 +179,6 @@ qx.Class.define("qx.ui.form.RadioButton",
       }
     },
 
-
     /**
      * Event listener for the "keyPress" event.
      *
@@ -220,16 +187,13 @@ qx.Class.define("qx.ui.form.RadioButton",
      *
      * @param e {qx.event.type.KeySequence} KeyPress event
      */
-    _onKeyPress : function(e)
-    {
-
+    _onKeyPress(e) {
       var grp = this.getGroup();
       if (!grp) {
         return;
       }
 
-      switch(e.getKeyIdentifier())
-      {
+      switch (e.getKeyIdentifier()) {
         case "Left":
         case "Up":
           grp.selectPrevious();

package/source/class/qx/ui/form/RadioButtonGroup.js

@@ -28,25 +28,22 @@
  * take full control of the layout and just use the selection behavior,
  * take a look at the {@link qx.ui.form.RadioGroup} object for a loose coupling.
  */
-qx.Class.define("qx.ui.form.RadioButtonGroup",
-{
-  extend : qx.ui.core.Widget,
-  include : [qx.ui.core.MLayoutHandling, qx.ui.form.MModelSelection],
-  implement : [
+qx.Class.define("qx.ui.form.RadioButtonGroup", {
+  extend: qx.ui.core.Widget,
+  include: [qx.ui.core.MLayoutHandling, qx.ui.form.MModelSelection],
+  implement: [
     qx.ui.form.IForm,
     qx.ui.form.IField,
     qx.ui.core.ISingleSelection,
     qx.ui.form.IModelSelection
   ],
 
-
   /**
    * @param layout {qx.ui.layout.Abstract} The new layout or
    *     <code>null</code> to reset the layout.
    */
-  construct : function(layout)
-  {
-    this.base(arguments);
+  construct(layout) {
+    super();
 
     // if no layout is given, use the default layout (VBox)
     if (layout == null) {
@@ -62,71 +59,67 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
     this.__radioGroup = new qx.ui.form.RadioGroup();
 
     // attach the listener
-    this.__radioGroup.addListener("changeSelection", this._onChangeSelection, this);
+    this.__radioGroup.addListener(
+      "changeSelection",
+      this._onChangeSelection,
+      this
+    );
   },
 
-
-  properties :
-  {
+  properties: {
     /**
      * Flag signaling if the group at all is valid. All children will have the
      * same state.
      */
-    valid : {
-      check : "Boolean",
-      init : true,
-      apply : "_applyValid",
-      event : "changeValid"
+    valid: {
+      check: "Boolean",
+      init: true,
+      apply: "_applyValid",
+      event: "changeValid"
     },
 
     /**
      * Flag signaling if the group is required.
      */
-    required : {
-      check : "Boolean",
-      init : false,
-      event : "changeRequired"
+    required: {
+      check: "Boolean",
+      init: false,
+      event: "changeRequired"
     },
 
     /**
      * Message which is shown in an invalid tooltip.
      */
-    invalidMessage : {
-      check : "String",
+    invalidMessage: {
+      check: "String",
       init: "",
-      event : "changeInvalidMessage",
-      apply : "_applyInvalidMessage"
+      event: "changeInvalidMessage",
+      apply: "_applyInvalidMessage"
     },
 
-
     /**
      * Message which is shown in an invalid tooltip if the {@link #required} is
      * set to true.
      */
-    requiredInvalidMessage : {
-      check : "String",
-      nullable : true,
-      event : "changeInvalidMessage"
+    requiredInvalidMessage: {
+      check: "String",
+      nullable: true,
+      event: "changeInvalidMessage"
     }
   },
 
-
-  events :
-  {
+  events: {
     /** Fires after the value was modified */
-    "changeValue" : "qx.event.type.Data",
+    changeValue: "qx.event.type.Data",
 
     /**
      * Fires after the selection was modified
      */
-    "changeSelection" : "qx.event.type.Data"
+    changeSelection: "qx.event.type.Data"
   },
 
-
-  members :
-  {
-    __radioGroup : null,
-
+  members: {
+    __radioGroup: null,
 
     /*
     ---------------------------------------------------------------------------
@@ -134,23 +127,21 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
     ---------------------------------------------------------------------------
     */
     // property apply
-    _applyInvalidMessage : function(value, old) {
+    _applyInvalidMessage(value, old) {
       var children = this._getChildren();
       for (var i = 0; i < children.length; i++) {
         children[i].setInvalidMessage(value);
       }
     },
 
-
     // property apply
-    _applyValid: function(value, old) {
+    _applyValid(value, old) {
       var children = this._getChildren();
       for (var i = 0; i < children.length; i++) {
         children[i].setValid(value);
       }
     },
 
-
     /*
     ---------------------------------------------------------------------------
       REGISTRY
@@ -162,21 +153,19 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
      *
      * @return {qx.ui.form.RadioGroup} Returns the used RadioGroup instance.
      */
-    getRadioGroup : function() {
+    getRadioGroup() {
       return this.__radioGroup;
     },
 
-
     /**
      * Returns the children list
      *
      * @return {qx.ui.core.LayoutItem[]} The children array.
      */
-    getChildren : function() {
+    getChildren() {
       return this._getChildren();
     },
 
-
     /**
      * Adds a new child widget.
      *
@@ -187,31 +176,27 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
      * @param child {qx.ui.core.LayoutItem} the widget to add.
      * @param options {Map?null} Optional layout data for widget.
      */
-    add : function(child, options) {
+    add(child, options) {
       this.__radioGroup.add(child);
       this._add(child, options);
     },
 
-
     /**
      * Remove the given child widget.
      *
      * @param child {qx.ui.core.LayoutItem} the widget to remove
      */
-    remove : function(child)
-    {
+    remove(child) {
       this.__radioGroup.remove(child);
       this._remove(child);
     },
 
-
     /**
      * Remove all children.
      *
      * @return {Array} An array of {@link qx.ui.core.LayoutItem}'s.
      */
-    removeAll : function()
-    {
+    removeAll() {
       // remove all children from the radio group
       var radioItems = this.__radioGroup.getItems();
       for (var i = radioItems.length - 1; i >= 0; i--) {
@@ -221,8 +206,6 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
       return this._removeAll();
     },
 
-
-
     /*
     ---------------------------------------------------------------------------
       SELECTION
@@ -237,30 +220,27 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
      *
      * @return {qx.ui.core.Widget[]} List of items.
      */
-    getSelection : function() {
+    getSelection() {
       return this.__radioGroup.getSelection();
     },
 
-
     /**
      * Replaces current selection with the given items.
      *
      * @param items {qx.ui.core.Widget[]} Items to select.
      * @throws {Error} if the item is not a child element.
      */
-    setSelection : function(items) {
+    setSelection(items) {
       this.__radioGroup.setSelection(items);
     },
 
-
     /**
      * Clears the whole selection at once.
      */
-    resetSelection : function() {
+    resetSelection() {
       this.__radioGroup.resetSelection();
     },
 
-
     /**
      * Detects whether the given item is currently selected.
      *
@@ -268,21 +248,19 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
      * @return {Boolean} Whether the item is selected.
      * @throws {Error} if the item is not a child element.
      */
-    isSelected : function(item) {
+    isSelected(item) {
       return this.__radioGroup.isSelected(item);
     },
 
-
     /**
      * Whether the selection is empty.
      *
      * @return {Boolean} Whether the selection is empty.
      */
-    isSelectionEmpty : function() {
+    isSelectionEmpty() {
       return this.__radioGroup.isSelectionEmpty();
     },
 
-
     /**
      * Returns all elements which are selectable.
      *
@@ -290,57 +268,64 @@ qx.Class.define("qx.ui.form.RadioButtonGroup",
      *   selectables the user can interactively select
      * @return {qx.ui.core.Widget[]} The contained items.
      */
-    getSelectables: function(all) {
+    getSelectables(all) {
       return this.__radioGroup.getSelectables(all);
     },
 
-
     /**
      * Select given value.
      *
      * @param item {null|var} Item to set as selected value.
      * @return {null|Error} The status of this operation.
      */
-    setValue : function(item) {
-      if (item && 'object' === typeof item && item instanceof qx.ui.form.IRadioItem) {
+    setValue(item) {
+      if (
+        item &&
+        "object" === typeof item &&
+        item instanceof qx.ui.form.IRadioItem
+      ) {
         return this.__radioGroup.setValue(item);
       } else {
         return new Error("can not select radio item from value");
       }
     },
 
-
     /**
      * @return {null|var} Returns the selected value.
      */
-    getValue : function() {
+    getValue() {
       return this.__radioGroup.getValue();
     },
 
-
     /**
      * Reset radio item selection.
      */
-    resetValue : function() {
+    resetValue() {
       this.__radioGroup.resetValue();
     },
 
-
     /**
      * Called on {@link qx.ui.form.RadioGroup} selection change event.
      *
      * @param event {qx.event.type.Data} Event containing the {@link qx.ui.form.RadioGroup} selection data.
      */
-    _onChangeSelection : function(event) {
+    _onChangeSelection(event) {
       this.fireDataEvent("changeValue", event.getData(), event.getOldData());
-      this.fireDataEvent("changeSelection", event.getData(), event.getOldData());
+      this.fireDataEvent(
+        "changeSelection",
+        event.getData(),
+        event.getOldData()
+      );
     }
   },
 
+  destruct() {
+    this.__radioGroup.removeListener(
+      "changeSelection",
+      this._onChangeSelection,
+      this
+    );
 
-  destruct : function()
-  {
-    this.__radioGroup.removeListener("changeSelection", this._onChangeSelection, this);
     this._disposeObjects("__radioGroup");
   }
 });