diff --git a/README.md b/README.md index 8b24725..6f69991 100755 --- a/README.md +++ b/README.md @@ -20,7 +20,8 @@ Clay will eventually be built into the Pebble SDK. However, while it is still in var clayConfig = require('config.json'); var clay = new Clay(clayConfig); ``` -6. Next is the fun part - creating your config page. Edit your `config.js` file to build a layout of elements as described in the sections below. +6. Add `configurable` to the `capabilities` array in your `appinfo.json`. +7. Next is the fun part - creating your config page. Edit your `config.js` file to build a layout of elements as described in the sections below. # Getting Started (CloudPebble) diff --git a/src/scripts/components/slider.js b/src/scripts/components/slider.js index b80d6ab..d15ad6b 100644 --- a/src/scripts/components/slider.js +++ b/src/scripts/components/slider.js @@ -25,7 +25,7 @@ module.exports = { * @return {void} */ function setValueDisplay() { - var value = self.get(); + var value = self.get().toFixed(self.precision); $value.set('value', value); $valuePad.set('innerHTML', value); } diff --git a/test/spec/components/slider.js b/test/spec/components/slider.js index 9026f5c..e060517 100644 --- a/test/spec/components/slider.js +++ b/test/spec/components/slider.js @@ -65,4 +65,31 @@ describe('component - slider', function() { assert.strictEqual(sliderItem.precision, 2); }); + + it('always displays decimal when precision is less than 1', function() { + var clayConfig = fixture.clayConfig([{ + type: 'slider', + step: 0.05 + }]); + var sliderItem = clayConfig.getItemsByType('slider')[0]; + var $valueDisplay = sliderItem.$element.select('.value'); + var $valueDisplayPad = sliderItem.$element.select('.value-pad'); + var $slider = sliderItem.$element.select('.slider'); + + assert.strictEqual($valueDisplay.get('value'), '50.00'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '50.00'); + assert.strictEqual($slider.get('value'), '50'); + sliderItem.set(75); + assert.strictEqual($valueDisplay.get('value'), '75.00'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '75.00'); + assert.strictEqual($slider.get('value'), '75'); + sliderItem.set(33.25); + assert.strictEqual($valueDisplay.get('value'), '33.25'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '33.25'); + assert.strictEqual($slider.get('value'), '33.25'); + sliderItem.set(17.1); + assert.strictEqual($valueDisplay.get('value'), '17.10'); + assert.strictEqual($valueDisplayPad.get('innerHTML'), '17.10'); + assert.strictEqual($slider.get('value'), '17.1'); + }); });