CriticalDepsMirror/clay
1
0
Fork 0
mirror of https://github.com/pebble-dev/clay.git synced 2026-08-27 20:36:33 -04:00
Code Issues Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Keegan
2015-11-12 09:42:18 -08:00
parent 0aef0caf79
commit d47db97bb6
6 changed files with 48 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
gulpfile.js
+1 -1
View File
@@ -15,7 +15,7 @@ gulp.task('clean', function(done) {
});
});
gulp.task('browserify', ['clean'], function(done) {
gulp.task('browserify', ['clean'], function() {
return browserify('src/scripts/config-page.js', { debug: false })
.transform(stringify(['.html', '.mustache']))
.bundle()
src/config-page.html
Regular → Executable
+1 -1
View File
@@ -15,6 +15,6 @@
<body>
<form id="main-form"></form>
<script src="../vendor/pebble-slate/dist/js/slate.min.js"></script>
<script src="../tmp/config-page.js"></script>
<script uglify src="../tmp/config-page.js"></script>
</body>
</html>
src/scripts/config-page.js
+9 -5
View File
@@ -10,8 +10,8 @@
* @property {string|boolean} default
* @property {string} label
* @property {object} attributes
* @property {array} options
* @property {array} items
* @property {Array} options
* @property {Array} items
*/
var mustache = require('mustache');
@@ -47,8 +47,10 @@ function getSetting(key, defaultValue) {
// settings[key] = value;
// }
var index = 0;
/**
* @param {Clay~Item} item
* @param {Clay~Item|Array} item
* @param {$} $parent
*/
function processConfigItem(item, $parent) {
@@ -73,9 +75,11 @@ function processConfigItem(item, $parent) {
var itemType = itemTypes[item.type];
var templateData = $.extend({}, item, {
attributes: $.map(item.attributes || [], function(item, key) {
console.log(index);
return {
key: key,
value: item.toString()
value: item.toString(),
index: index++
};
})
});
@@ -145,7 +149,7 @@ api.getItemsByType = function(type) {
});
};
processConfigItem(config, $mainForm, 0);
processConfigItem(config, $mainForm);
$mainForm.on('submit', submit);
module.exports = api;
src/scripts/lib/item-types.js
+4
View File
@@ -31,6 +31,10 @@ module.exports = {
template: require('../../templates/components/toggle.mustache'),
manipulator: manipulators.checked
},
radiogroup: {
template: require('../../templates/components/radiogroup.mustache'),
manipulator: manipulators.radiogroup
},
submit: {
template: require('../../templates/components/submit.mustache'),
manipulator: manipulators.val
src/scripts/lib/manipulators.js
+18
View File
@@ -43,5 +43,23 @@ module.exports = {
return this.$manipulatorTarget.prop('disabled', false)
.triggerHandler('change');
}
},
radiogroup: {
get: function() {
return this.$manipulatorTarget.find('input:checked').val();
},
set: function(value) {
this.$manipulatorTarget.find('[value="' + value + '"]')
.prop('checked', true);
return this.$manipulatorTarget.triggerHandler('change');
},
disable: function() {
return this.$manipulatorTarget.prop('disabled', true)
.triggerHandler('change');
},
enable: function() {
return this.$manipulatorTarget.prop('disabled', false)
.triggerHandler('change');
}
}
};
src/templates/components/radiogroup.mustache
+15
View File
@@ -0,0 +1,15 @@
<div class="">
<span class="label">{{label}}</span>
<div data-manipulator-target>
{{#options}}
<label class="item">
<span class="label">{{label}}</span>
<input type="radio"
class="item-radio"
name="{{index}}"
value="{{value}}"
/>
</label>
{{/options}}
</div>
</div>