Merge pull request #8 from pebble/PBL-33868/use-int-for-toggle

Use int for 'checked' manipulator instead of boolean

README.md

@@ -214,7 +214,7 @@ Switch for a single item.
 | id | string (unique) | Set this to a unique string to allow this item to be looked up using `Clay.getItemsById()` in your [custom function](#custom-function). |
 | appKey | string (unique) | The AppMessage key matching the `appKey` item defined in your `appinfo.json`.  Set this to a unique string to allow this item to be looked up using `Clay.getItemsByAppKey()` in your custom function. You must set this if you wish for the value of this item to be persisted after the user closes the config page. |
 | label | string | The label that should appear next to this item. |
-| defaultValue | boolean | The default value of the toggle. Defaults to `false` if not specified. |
+| defaultValue | int\|boolean | The default value of the toggle. Defaults to `false` if not specified. |
 | attributes | object | An object containing HTML attributes to set on the input field. You can add basic HTML5 validation this way by setting attribute such as `required`. |
 
 
@@ -465,8 +465,8 @@ Each component has a **manipulator**. This is a set of methods used to talk to t
 
 | Method | Returns | Event Fired | Description | 
 |--------|---------|-------------| ------------|
-| `.set( [boolean] value)` | `ClayItem` | `change` | Check/uncheck the state of this item. |
-| `.get()` |  `string` | Gets the content of this item. |
+| `.set( [boolean\|int] value)` | `ClayItem` | `change` | Check/uncheck the state of this item. |
+| `.get()` | `int` | 1 if checked, 0 if not checked |
 | `.disable()` | `ClayItem` | `disabled` | Prevents this item from being edited by the user. |
 | `.enable()` | `ClayItem` | `enabled` | Allows this item to be edited by the user. |
 
@@ -493,7 +493,7 @@ Each component has a **manipulator**. This is a set of methods used to talk to t
 | Method | Returns | Event Fired | Description | 
 |--------|---------|-------------| ------------|
 | `.set( [array] value)` | `ClayItem` | `change` | Checks the checkboxes that corresponds to the provided list of values. |
-| `.get()` |  `string` | Gets the value of the checked radio button in the list. |
+| `.get()` |  `Array.<string>` | Gets an array of strings representing the list of the values of the checked items |
 | `.disable()` | `ClayItem` | `disabled` | Prevents this item from being edited by the user. |
 | `.enable()` | `ClayItem` | `enabled` | Allows this item to be edited by the user. |
 

src/scripts/lib/manipulators.js

@@ -41,10 +41,10 @@ module.exports = {
   },
   checked: {
     get: function() {
-      return this.$manipulatorTarget.get('checked');
+      return this.$manipulatorTarget.get('checked') ? 1 : 0;
     },
     set: function(value) {
-      this.$manipulatorTarget.set('checked', value);
+      this.$manipulatorTarget.set('checked', !!value);
       return this.trigger('change');
     },
     disable: disable,

test/spec/lib/clay-config.js

@@ -112,7 +112,7 @@ describe('ClayConfig', function() {
       assert.deepEqual(clayConfig.getSettings(), {
         test1: 'default val',
         test2: 'val-2',
-        test3: false
+        test3: 0
       });
 
       clayConfig.getItemByAppKey('test1').set('val-1');
@@ -121,7 +121,7 @@ describe('ClayConfig', function() {
       assert.deepEqual(clayConfig.getSettings(), {
         test1: 'val-1',
         test2: 'val-2',
-        test3: true
+        test3: 1
       });
     });
   });

test/spec/lib/manipulators.js

@@ -95,8 +95,10 @@ describe('manipulators', function() {
   });
 
   describe('checked', function() {
-    testSetGet('toggle', true);
-    testSetGet('toggle', false);
+    testSetGet('toggle', true, 1);
+    testSetGet('toggle', 1);
+    testSetGet('toggle', false, 0);
+    testSetGet('toggle', 0);
     testDisable('toggle');
     testEnable('toggle');
   });