From d75aa7d04a3d86bc5164a50f9a32c6d4bbac079e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Minh=20Nguy=E1=BB=85n?= Date: Tue, 9 Jan 2018 00:58:58 -0800 Subject: [PATCH] Internationalized measurement panel --- data/core.yaml | 12 +++++- dist/locales/en.json | 14 +++++-- modules/ui/panels/measurement.js | 67 +++++++++++++++++++------------- 3 files changed, 61 insertions(+), 32 deletions(-) diff --git a/data/core.yaml b/data/core.yaml index 4e3c734f5..b3fdc7399 100644 --- a/data/core.yaml +++ b/data/core.yaml @@ -319,6 +319,8 @@ en: metric: Metric imperial: Imperial node_count: Number of nodes + coordinate_pair: "{latitude}, {longitude}" + area_pair: "{area1} ({area2})" geometry: point: point vertex: vertex @@ -1056,7 +1058,13 @@ en: location: "Toggle location panel" measurement: "Toggle measurement panel" units: - miles: "{quantity} mi" feet: "{quantity} ft" - kilometers: "{quantity} km" + miles: "{quantity} mi" + square_feet: "{quantity} sq ft" + square_miles: "{quantity} sq mi" + acres: "{quantity} ac" meters: "{quantity} m" + kilometers: "{quantity} km" + square_meters: "{quantity} m²" + square_kilometers: "{quantity} km²" + hectares: "{quantity} ha" diff --git a/dist/locales/en.json b/dist/locales/en.json index f36bcb42f..24831e3ba 100644 --- a/dist/locales/en.json +++ b/dist/locales/en.json @@ -398,7 +398,9 @@ "location": "Location", "metric": "Metric", "imperial": "Imperial", - "node_count": "Number of nodes" + "node_count": "Number of nodes", + "coordinate_pair": "{latitude}, {longitude}", + "area_pair": "{area1} ({area2})" } }, "geometry": { @@ -1222,10 +1224,16 @@ } }, "units": { - "miles": "{quantity} mi", "feet": "{quantity} ft", + "miles": "{quantity} mi", + "square_feet": "{quantity} sq ft", + "square_miles": "{quantity} sq mi", + "acres": "{quantity} ac", + "meters": "{quantity} m", "kilometers": "{quantity} km", - "meters": "{quantity} m" + "square_meters": "{quantity} m²", + "square_kilometers": "{quantity} km²", + "hectares": "{quantity} ha" }, "presets": { "categories": { diff --git a/modules/ui/panels/measurement.js b/modules/ui/panels/measurement.js index 48a6546bd..e9ccfa467 100644 --- a/modules/ui/panels/measurement.js +++ b/modules/ui/panels/measurement.js @@ -14,7 +14,8 @@ import { utilDetect } from '../../util/detect'; export function uiPanelMeasurement(context) { - var isImperial = (utilDetect().locale.toLowerCase() === 'en-us'); + var locale = utilDetect().locale, + isImperial = (locale.toLowerCase() === 'en-us'); var OSM_PRECISION = 7; @@ -53,70 +54,77 @@ export function uiPanelMeasurement(context) { function displayLength(m) { var d = m * (isImperial ? 3.28084 : 1), - p, unit; + unit; if (isImperial) { if (d >= 5280) { d /= 5280; - unit = 'mi'; + unit = 'miles'; } else { - unit = 'ft'; + unit = 'feet'; } } else { if (d >= 1000) { d /= 1000; - unit = 'km'; + unit = 'kilometers'; } else { - unit = 'm'; + unit = 'meters'; } } - // drop unnecessary precision - p = d > 1000 ? 0 : d > 100 ? 1 : 2; - - return String(d.toFixed(p)) + ' ' + unit; + return t('units.' + unit, { + quantity: d.toLocaleString(locale, { maximumSignificantDigits: 4 }) + }); } function displayArea(m2) { var d = m2 * (isImperial ? 10.7639111056 : 1), - d1, d2, p1, p2, unit1, unit2; + d1, d2, unit1, unit2, area; if (isImperial) { if (d >= 6969600) { // > 0.25mi² show mi² d1 = d / 27878400; - unit1 = 'mi²'; + unit1 = 'square_miles'; } else { d1 = d; - unit1 = 'ft²'; + unit1 = 'square_feet'; } if (d > 4356 && d < 43560000) { // 0.1 - 1000 acres d2 = d / 43560; - unit2 = 'ac'; + unit2 = 'acres'; } } else { if (d >= 250000) { // > 0.25km² show km² d1 = d / 1000000; - unit1 = 'km²'; + unit1 = 'square_kilometers'; } else { d1 = d; - unit1 = 'm²'; + unit1 = 'square_meters'; } if (d > 1000 && d < 10000000) { // 0.1 - 1000 hectares d2 = d / 10000; - unit2 = 'ha'; + unit2 = 'hectares'; } } - // drop unnecessary precision - p1 = d1 > 1000 ? 0 : d1 > 100 ? 1 : 2; - p2 = d2 > 1000 ? 0 : d2 > 100 ? 1 : 2; + area = t('units.' + unit1, { + quantity: d1.toLocaleString(locale, { maximumSignificantDigits: 4 }) + }); - return String(d1.toFixed(p1)) + ' ' + unit1 + - (d2 ? ' (' + String(d2.toFixed(p2)) + ' ' + unit2 + ')' : ''); + if (d2) { + return t('info_panels.measurement.area_pair', { + area1: area, + area2: t('units.' + unit2, { + quantity: d2.toLocaleString(locale, { maximumSignificantDigits: 2 }) + }) + }); + } else { + return area; + } } @@ -132,7 +140,7 @@ export function uiPanelMeasurement(context) { selection .append('h4') .attr('class', 'measurement-heading') - .text(singular || t('info_panels.measurement.selected', { n: selected.length })); + .text(singular || t('info_panels.measurement.selected', { n: selected.length.toLocaleString(locale) })); if (!selected.length) return; @@ -154,7 +162,10 @@ export function uiPanelMeasurement(context) { .text(t('info_panels.measurement.center') + ':') .append('span') .text( - center[1].toFixed(OSM_PRECISION) + ', ' + center[0].toFixed(OSM_PRECISION) + t('info_panels.measurement.coordinate_pair', { + latitude: center[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }), + longitude: center[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }) + }) ); return; } @@ -183,8 +194,7 @@ export function uiPanelMeasurement(context) { .append('li') .text(t('info_panels.measurement.node_count') + ':') .append('span') - .text(nodeCount(feature) - ); + .text(nodeCount(feature).toLocaleString(locale)); } if (closed) { @@ -208,7 +218,10 @@ export function uiPanelMeasurement(context) { .text(t('info_panels.measurement.centroid') + ':') .append('span') .text( - centroid[1].toFixed(OSM_PRECISION) + ', ' + centroid[0].toFixed(OSM_PRECISION) + t('info_panels.measurement.coordinate_pair', { + latitude: centroid[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }), + longitude: centroid[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }) + }) ); var toggle = isImperial ? 'imperial' : 'metric';