diff --git a/index_dev.html b/index_dev.html index aab7da2f7..c16b6a655 100644 --- a/index_dev.html +++ b/index_dev.html @@ -27,7 +27,6 @@ - diff --git a/js/id/ui/preset.js b/js/id/ui/preset.js index 9f90917e9..49935fe9e 100644 --- a/js/id/ui/preset.js +++ b/js/id/ui/preset.js @@ -1,6 +1,5 @@ iD.ui.preset = function(context) { var event = d3.dispatch('change', 'setTags', 'close'), - taginfo = iD.taginfo(), entity, type, hidden, @@ -11,77 +10,19 @@ iD.ui.preset = function(context) { // generate form fields for a given field. function input(d) { - var i, wrap; - switch (d.type) { - case 'text': - i = iD.ui.preset.input() - .type('text'); - break; - case 'number': - i = iD.ui.preset.input() - .type('number'); - break; - case 'tel': - i = iD.ui.preset.input() - .placeholder('1-555-555-5555') - .type('tel'); - break; - case 'email': - i = iD.ui.preset.input() - .placeholder('email@example.com') - .type('email'); - break; - case 'url': - i = iD.ui.preset.input() - .placeholder('http://example.com') - .type('url'); - break; - case 'check': - i = iD.ui.preset.check(); - break; - case 'combo': - i = iD.ui.preset.combo(); - if (d.options) { - i.options(d.options); - } else { - taginfo.values({ - key: d.key - }, function(err, data) { - if (!err) i.options(_.pluck(data, 'value')); - }); - } - break; - case 'address': - i = iD.ui.preset.address(context) - .entity(entity); - break; - } - if (i) { - this.call(i); + var i = iD.ui.preset[d.type](d, context) + .on('close', event.close) + .on('change', event.change); - if (d.key) keys.push(d.key); - else if (d.keys) keys = keys.concat(d.keys); + event.on('setTags.' + d.key || d.type, function(tags) { + i.tags(_.clone(tags)); + }); - i.on('change', function(value) { - var tags = {}; - if (d.key) { - tags[d.key] = value; - } else { - tags = value; - } - event.change(tags); - }); + if (d.type === 'address') i.entity(entity); - i.on('close', event.close); + keys = keys.concat(d.key ? [d.key] : d.keys); - event.on('setTags.' + d.key || d.type, function(tags) { - if (d.key) { - i.value(tags[d.key]); - } else { - i.value(_.clone(tags)); - } - }); - } + this.call(i); } function presets(selection) { diff --git a/js/id/ui/preset/address.js b/js/id/ui/preset/address.js index bacef0735..777a74eb7 100644 --- a/js/id/ui/preset/address.js +++ b/js/id/ui/preset/address.js @@ -1,4 +1,4 @@ -iD.ui.preset.address = function(context) { +iD.ui.preset.address = function(form, context) { var event = d3.dispatch('change', 'close'), housename, @@ -93,7 +93,7 @@ iD.ui.preset.address = function(context) { return address; }; - address.value = function(tags) { + address.tags = function(tags) { housename.property('value', tags['addr:housename'] || ''); housenumber.property('value', tags['addr:housenumber'] || ''); street.property('value', tags['addr:street'] || ''); diff --git a/js/id/ui/preset/check.js b/js/id/ui/preset/check.js index 4ace3eace..738b14765 100644 --- a/js/id/ui/preset/check.js +++ b/js/id/ui/preset/check.js @@ -1,4 +1,4 @@ -iD.ui.preset.check = function() { +iD.ui.preset.check = function(form) { var event = d3.dispatch('change', 'close'), values = ['', 'yes', 'no'], @@ -20,16 +20,16 @@ iD.ui.preset.check = function() { .attr('class', 'value'); box.on('click', function() { - check.value(values[(values.indexOf(value) + 1) % 3]); - event.change(value); + var t = {}; + t[form.key] = values[(values.indexOf(value) + 1) % 3]; + check.tags(t); + event.change(t); d3.event.stopPropagation(); }); - - check.value(); }; - check.value = function(v) { - value = v || ''; + check.tags = function(tags) { + value = tags[form.key] || ''; box.property('indeterminate', !value); box.property('checked', value === 'yes'); text.text(value || 'unknown'); diff --git a/js/id/ui/preset/combo.js b/js/id/ui/preset/combo.js index 5bad8d032..851b993a9 100644 --- a/js/id/ui/preset/combo.js +++ b/js/id/ui/preset/combo.js @@ -1,8 +1,6 @@ -iD.ui.preset.combo = function() { +iD.ui.preset.combo = function(form) { var event = d3.dispatch('change', 'close'), - combobox, - options, wrap, input; @@ -15,34 +13,42 @@ iD.ui.preset.combo = function() { .on('change', change) .on('blur', change); - combobox = d3.combobox(); + var combobox = d3.combobox(); wrap.call(combobox); - if (options) combo.options(options); - } + if (form.options) { + options(form.options); + } else { + iD.taginfo().values({ + key: form.key + }, function(err, data) { + if (!err) options(_.pluck(data, 'value')); + }); + } - function change() { - event.change(input.property('value').replace(' ', '_')); - } - - combo.options = function(o) { - options = o; - if (combobox) { - combobox.data(options.map(function(d) { + function options(opts) { + combobox.data(opts.map(function(d) { var o = {}; o.title = o.value = d.replace('_', ' '); return o; })); input.attr('placeholder', function() { - if (!options || options.length < 3) return ''; - return options.slice(0, 3).join(', ') + '...'; + if (opts.length < 3) return ''; + return opts.slice(0, 3).join(', ') + '...'; }); } - }; + } - combo.value = function(v) { - input.property('value', v || ''); + + function change() { + var t = {}; + t[form.key] = input.property('value').replace(' ', '_'); + event.change(t); + } + + combo.tags = function(tags) { + input.property('value', tags[form.key] || ''); }; return d3.rebind(combo, event, 'on'); diff --git a/js/id/ui/preset/input.js b/js/id/ui/preset/input.js index f89fca939..a9dde9bf1 100644 --- a/js/id/ui/preset/input.js +++ b/js/id/ui/preset/input.js @@ -1,28 +1,29 @@ -iD.ui.preset.input = function() { +iD.ui.preset.text = +iD.ui.preset.number = +iD.ui.preset.tel = +iD.ui.preset.email = +iD.ui.preset.url = function(form) { var event = d3.dispatch('change', 'close'), - type, input; function i(selection) { input = selection.append('input') - .attr('type', type) + .attr('type', form.type) + .attr('placeholder', form.placeholder || '') .on('blur', change) .on('change', change) .call(iD.behavior.accept().on('accept', event.close)); } function change() { - event.change(input.property('value')); + var t = {}; + t[form.key] = input.property('value'); + event.change(t); } - i.type = function(_) { - type = _; - return i; - }; - - i.value = function(value) { - input.property('value', value || ''); + i.tags = function(tags) { + input.property('value', tags[form.key] || ''); }; return d3.rebind(i, event, 'on');