1 files changed, 165 insertions, 490 deletions

diff --git a/node_modules/montage/ui/button.reel/button.js b/node_modules/montage/ui/button.reel/button.js
index 60bca109..51f4c011 100755..100644
--- a/node_modules/montage/ui/button.reel/button.js
+++ b/node_modules/montage/ui/button.reel/button.js
@@ -3,20 +3,13 @@
  No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
  (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
  </copyright> */
-/**
-        @module "montage/ui/button.reel"
-    @requires montage/core/core
-    @requires montage/ui/component
-*/
 var Montage = require("montage").Montage,
-    Component = require("ui/component").Component;
-
+    Component = require("ui/component").Component,
+    NativeControl = require("ui/native-control").NativeControl;
 /**
- @class module:"montage/ui/button.reel".Button
- @classdesc Button component implementation. Turns any div element into a multi-state labeled button.
- @extends module:montage/ui/component.Component
+ * The Text input
  */
-exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.reel".Button# */ {
+var Button = exports.Button = Montage.create(NativeControl, {
 
 /**
   Description TODO
@@ -45,69 +38,11 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r
         }
     },
 
-/**
-  Description TODO
-  @private
-*/
-    _busy: {
-        enumerable: false,
-        value: false
-    },
-
-/**
-        Description TODO
-        @type {Function}
-        @default {Boolean} false
-    */
-    busy: {
-        get: function () {
-            return this._busy;
-        },
-        set: function (value) {
-            if ((value === true) && (!this._disabled)) {
-                this._busy = true;
-            } else {
-                this._busy = false;
-            }
-            this.needsDraw = true;
-        }
-    },
-
-/**
-  Description TODO
-  @private
-*/
-    _disabled: {
-        enumerable: false,
-        value: false
-    },
-
-/**
-        Description TODO
-        @type {Function}
-        @default {Boolean} false
-    */
-    disabled: {
-        get: function () {
-            return this._disabled;
-        },
-        set: function (value) {
-            if (value === true) {
-                this._disabled = true;
-                this.busy = false;
-            } else {
-                this._disabled = false;
-            }
-            this.needsDraw = true;
-        }
-    },
-
     //TODO we should prefer positive properties like enabled vs disabled, get rid of disabled
-
     enabled: {
         dependencies: ["disabled"],
         get: function () {
-            return !!this._disabled;
+            return !this._disabled;
         },
         set: function (value) {
             this.disabled = !value;
@@ -115,56 +50,6 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r
     },
 
     /**
-     * When behavior is toggle, @link http://www.w3.org/TR/wai-aria/states_and_properties#aria-pressed
-     * the pressed property contains the equivalent of the aria-pressed attribute: "true"||"false"||"mixed"
-     * @private
-     */
-    _pressed: {
-        value: "false",
-        enumerable: false
-    },
-    /**
-        Description TODO
-        @type {Function}
-        @default {Boolean} "false"
-    */
-    pressed: {
-        get: function() {
-            return this._pressed;
-        },
-        set: function(value) {
-            if (value !== this._pressed) {
-                this._pressed = value;
-                this.needsDraw = true;
-            }
-        }
-    },
-    /**
-     * Used when a button is associated with an input tag. For buttons, the title comes from it's value attribute.
-     * If the value property is undefined, it will be initialized from the button's input element if the element is an input type.
-     * @private
-     */
-    _value: {
-        enumerable: false,
-        value: undefined
-    },
-    /**
-        Description TODO
-        @type {Function}
-        @default undefined
-    */
-    value: {
-        serializable: true,
-        get: function () {
-            return this._value;
-        },
-        set: function (value) {
-            this._value = value;
-            this.needsDraw = true;
-        }
-    },
-
-    /**
         The Montage converted used to convert or format values displayed by this Button instance.
         @type {Property}
         @default null
@@ -174,141 +59,63 @@ exports.Button = Montage.create(Component,/** @lends module:"montage/ui/button.r
     },
 
     /**
-     * @private
-     */
-    _title: {
-        enumerable: false,
-        value: undefined
-    },
-    /**
-        Description Text to show in the tooltip displayed by hovering over this button
-        @type {Function}
-        @default undefined
-    */
-    title: {
-        serializable: true,
-        get: function () {
-            return this._title;
-        },
-        set: function (value) {
-            this._title = value;
-            this.needsDraw = true;
-        }
-    },
-
-/**
-  Description TODO
-  @private
-*/
-    _valueNode: {value:undefined, enumerable: false},
-
-/**
-        Used when a button is associate with an input tag.<br>
-        For buttons, the title comes from it's value attribute.<br>
-        valueActive, if set, is used when the button is in active state (mousedown / touchstart).
-        @type {String}
-        @default undefined
+      Stores the node that contains this button's value. Only used for
+      non-`<input>` elements.
+      @private
     */
-    valueActive: {
-        serializable: true,
-        value: undefined
-    },
-
- /**
-  Description TODO
-  @private
-*/
-    _valueNodeActiveNode: {value:undefined, enumerable: false},
-
+    _labelNode: {value:undefined, enumerable: false},
 
+    _label: { value: undefined, enumerable: false },
     /**
-     Used when a button is associate with an input tag.<br>
-     For buttons, the title comes from its value attribute.<br>
-     When behavior is toggle, @link http://www.w3.org/TR/wai-aria/states_and_properties#aria-pressed the button has multiple states and may need different titles for that.<br>
-     So, pressedValue would contain the value to use when pressed is true.
-     @type {String}
+        The label for the button.