phone placeholder from country being edited

Prefer to pull in phone placeholder text based on the country currently
being edited.  Fallback to using placeholder text based on user’s
locale settings.

rename phone placeholders to phone formats

add Germany example phone number

See [German Wikipedia article
E.123](https://de.wikipedia.org/wiki/E.123)

check for null in focus

check that input.node() is not null in i.focus()
This commit is contained in:
Peter Dobratz
2016-04-25 12:13:01 -07:00
committed by Bryan Housel
parent 9974aae30b
commit 2d9327c5b9
4 changed files with 135 additions and 37 deletions

View File

@@ -295,7 +295,8 @@ fs.writeFileSync('data/data.js', 'iD.data = ' + JSON.stringify({
locales: r('locales.json'),
en: read('dist/locales/en.json'),
suggestions: r('name-suggestions.json'),
addressFormats: r('address-formats.json')
addressFormats: r('address-formats.json'),
phoneFormats: r('phone-formats.json')
}) + ';');
fs.writeFileSync('dist/presets.js', 'iD.data.presets = ' + JSON.stringify({

View File

@@ -18,7 +18,8 @@ iD.data = {
path + 'data/locales.json',
path + 'dist/locales/en.json',
path + 'data/name-suggestions.json',
path + 'data/address-formats.json'
path + 'data/address-formats.json',
path + 'data/phone-formats.json'
], d3.json, function (err, data) {
iD.data = {
@@ -37,7 +38,8 @@ iD.data = {
locales: data[10],
en: data[11],
suggestions: data[12],
addressFormats: data[13]
addressFormats: data[13],
phoneFormats: data[14]
};
callback();

52
data/phone-formats.json Normal file
View File

@@ -0,0 +1,52 @@
{
"us": "+1-202-555-1234",
"ca": "+1-226-555-1234",
"bs": "+1-242-555-1234",
"bb": "+1-246-555-1234",
"ai": "+1-264-555-1234",
"ag": "+1-268-555-1234",
"vg": "+1-284-555-1234",
"vi": "+1-340-555-1234",
"ky": "+1-345-555-1234",
"bm": "+1-441-555-1234",
"gd": "+1-473-555-1234",
"tc": "+1-649-555-1234",
"ms": "+1-664-555-1234",
"mp": "+1-670-555-1234",
"gu": "+1-671-555-1234",
"as": "+1-684-555-1234",
"sx": "+1-721-555-1234",
"lc": "+1-758-555-1234",
"dm": "+1-767-555-1234",
"vc": "+1-784-555-1234",
"pr": "+1-787-555-1234",
"do": "+1-809-555-1234",
"tt": "+1-868-555-1234",
"kn": "+1-869-555-1234",
"jm": "+1-876-555-1234",
"za": "+27 11 907 1111",
"nl": "+31 42 123 4567",
"fr": "+33 1 23 45 67 89",
"es": "+34 989 12 34 56",
"pt": "+351 211 123456",
"fi": "+358 40 123 4567",
"hu": "+36 1 123 45 67",
"hr": "+385 01 123 4567",
"si": "+386 31 123 4567",
"it": "+39 01 123 456",
"va": "+39 01 123 456",
"gb": "+44 207 123456",
"gg": "+44 207 123456",
"im": "+44 207 123456",
"je": "+44 207 123456",
"se": "+46 31 123 4567",
"no": "+47 22 12 34 56",
"sj": "+47 22 12 34 56",
"pl": "+48 42 123 4567",
"de": "+49 89 1234567",
"br": "+55 11 0982 1098",
"ru": "+7 495 1234567",
"kz": "+7 495 1234567",
"vn": "+84 1 234 5678",
"hk": "+852 12345678"
}

View File

@@ -2,51 +2,81 @@ iD.ui.preset.text =
iD.ui.preset.number =
iD.ui.preset.tel =
iD.ui.preset.email =
iD.ui.preset.url = function(field) {
iD.ui.preset.url = function(field, context) {
var dispatch = d3.dispatch('change'),
input;
var dispatch = d3.dispatch('init', 'change'),
input,
entity,
isInitialized;
function i(selection) {
isInitialized = false;
input = selection.selectAll('input')
.data([0]);
input.enter().append('input')
.attr('type', field.type)
.attr('id', 'preset-input-' + field.id)
.attr('placeholder', field.placeholder() || t('inspector.unknown'));
if (field.type === 'tel') {
var center = entity.extent(context.graph()).center();
input
.on('input', change(true))
.on('blur', change())
.on('change', change());
iD.services.nominatim().countryCode(center, function (err, countryCode) {
if (field.type === 'number') {
input.attr('type', 'text');
input.enter().append('input')
.attr('type', field.type)
.attr('id', 'preset-input-' + field.id)
.attr('placeholder',
iD.data.phoneFormats[countryCode] ||
field.placeholder() ||
t('inspector.unknown'));
var spinControl = selection.selectAll('.spin-control')
.data([0]);
input
.on('input', change(true))
.on('blur', change())
.on('change', change());
var enter = spinControl.enter().append('div')
.attr('class', 'spin-control');
dispatch.init();
isInitialized = true;
});
} else {
input.enter().append('input')
.attr('type', field.type)
.attr('id', 'preset-input-' + field.id)
.attr('placeholder', field.placeholder() || t('inspector.unknown'));
enter.append('button')
.datum(1)
.attr('class', 'increment')
.attr('tabindex', -1);
input
.on('input', change(true))
.on('blur', change())
.on('change', change());
enter.append('button')
.datum(-1)
.attr('class', 'decrement')
.attr('tabindex', -1);
if (field.type === 'number') {
input.attr('type', 'text');
spinControl.selectAll('button')
.on('click', function(d) {
d3.event.preventDefault();
var num = parseInt(input.node().value || 0, 10);
if (!isNaN(num)) input.node().value = num + d;
change()();
});
var spinControl = selection.selectAll('.spin-control')
.data([0]);
var enter = spinControl.enter().append('div')
.attr('class', 'spin-control');
enter.append('button')
.datum(1)
.attr('class', 'increment')
.attr('tabindex', -1);
enter.append('button')
.datum(-1)
.attr('class', 'decrement')
.attr('tabindex', -1);
spinControl.selectAll('button')
.on('click', function(d) {
d3.event.preventDefault();
var num = parseInt(input.node().value || 0, 10);
if (!isNaN(num)) input.node().value = num + d;
change()();
});
}
dispatch.init();
isInitialized = true;
}
}
@@ -58,12 +88,25 @@ iD.ui.preset.url = function(field) {
};
}
i.entity = function(_) {
if (!arguments.length) return entity;
entity = _;
return i;
};
i.tags = function(tags) {
input.value(tags[field.key] || '');
if (isInitialized) {
input.value(tags[field.key] || '');
} else {
dispatch.on('init', function () {
input.value(tags[field.key] || '');
});
}
};
i.focus = function() {
input.node().focus();
var node = input.node();
if (node) node.focus();
};
return d3.rebind(i, dispatch, 'on');