From dc2dbbe183dcb327a08488a9bd3854fe4e68e086 Mon Sep 17 00:00:00 2001 From: John Firebaugh Date: Tue, 12 Feb 2013 15:45:12 -0800 Subject: [PATCH] Extract iD.ui.Zoom, add tooltips with key hint --- index.html | 1 + js/id/id.js | 2 ++ js/id/ui.js | 21 +++------------------ js/id/ui/zoom.js | 40 ++++++++++++++++++++++++++++++++++++++++ locale/da.js | 8 +++++--- locale/de.js | 8 +++++--- locale/en.js | 8 +++++--- locale/es.js | 8 +++++--- locale/fr.js | 8 +++++--- locale/ja.js | 8 +++++--- locale/lv.js | 8 +++++--- locale/tr.js | 8 +++++--- 12 files changed, 86 insertions(+), 42 deletions(-) create mode 100644 js/id/ui/zoom.js diff --git a/index.html b/index.html index 4ea9d9721..009ee4133 100644 --- a/index.html +++ b/index.html @@ -82,6 +82,7 @@ + diff --git a/js/id/id.js b/js/id/id.js index f0747ad02..5db609593 100644 --- a/js/id/id.js +++ b/js/id/id.js @@ -85,6 +85,8 @@ window.iD = function () { context.projection = map.projection; context.tail = map.tail; context.redraw = map.redraw; + context.zoomIn = map.zoomIn; + context.zoomOut = map.zoomOut; context.container = function(_) { if (!arguments.length) return container; diff --git a/js/id/ui.js b/js/id/ui.js index 535c825eb..7ae2c9e28 100644 --- a/js/id/ui.js +++ b/js/id/ui.js @@ -37,20 +37,9 @@ iD.ui = function(context) { .attr('class', 'button-wrap col1') .call(iD.ui.Save(context)); - var zoom = container.append('div') + container.append('div') .attr('class', 'zoombuttons map-control') - .selectAll('button') - .data([['zoom-in', '+', map.zoomIn, t('zoom-in')], ['zoom-out', '-', map.zoomOut, t('zoom-out')]]) - .enter() - .append('button') - .attr('tabindex', -1) - .attr('class', function(d) { return d[0]; }) - .attr('title', function(d) { return d[3]; }) - .on('click.editor', function(d) { return d[2](); }) - .append('span') - .attr('class', function(d) { - return d[0] + ' icon'; - }); + .call(iD.ui.Zoom(context)); if (navigator.geolocation) { container.append('div') @@ -139,11 +128,7 @@ iD.ui = function(context) { .on('←', pan([pa, 0])) .on('↑', pan([0, pa])) .on('→', pan([-pa, 0])) - .on('↓', pan([0, -pa])) - .on('⇧=', function() { map.zoomIn(); }) - .on('+', function() { map.zoomIn(); }) - .on('-', function() { map.zoomOut(); }) - .on('dash', function() { map.zoomOut(); }); + .on('↓', pan([0, -pa])); d3.select(document) .call(keybinding); diff --git a/js/id/ui/zoom.js b/js/id/ui/zoom.js new file mode 100644 index 000000000..823bc120f --- /dev/null +++ b/js/id/ui/zoom.js @@ -0,0 +1,40 @@ +iD.ui.Zoom = function(context) { + var zooms = [{ + id: 'zoom-in', + title: t('zoom.in'), + action: context.zoomIn, + key: '+' + }, { + id: 'zoom-out', + title: t('zoom.out'), + action: context.zoomOut, + key: '-' + }]; + + return function(selection) { + var button = selection.selectAll('button') + .data(zooms) + .enter().append('button') + .attr('tabindex', -1) + .attr('class', function(d) { return d.id; }) + .on('click.editor', function(d) { d.action(); }) + .call(bootstrap.tooltip() + .placement('right') + .html(true) + .title(function(d) { + return iD.ui.tooltipHtml(d.title, d.key); + })); + + button.append('span') + .attr('class', function(d) { return d.id + ' icon'; }); + + var keybinding = d3.keybinding('zoom') + .on('+', function() { context.zoomIn(); }) + .on('-', function() { context.zoomOut(); }) + .on('⇧=', function() { context.zoomIn(); }) + .on('dash', function() { context.zoomOut(); }); + + d3.select(document) + .call(keybinding); + } +}; diff --git a/locale/da.js b/locale/da.js index 342273223..29e23c6f2 100644 --- a/locale/da.js +++ b/locale/da.js @@ -149,9 +149,6 @@ locale.da = { just_edited: "Du har lige rettede i OpenStreetMap!", okay: "Ok", - "zoom-in": "Zoom ind", - "zoom-out": "Zoom ud", - nothing_to_undo: "Nothing to undo.", nothing_to_redo: "Nothing to redo.", @@ -197,5 +194,10 @@ locale.da = { source_switch: { live: "live", dev: "dev" + }, + + zoom: { + in: "Zoom ind", + out: "Zoom ud" } }; diff --git a/locale/de.js b/locale/de.js index 543eaab2d..f1f3ef850 100644 --- a/locale/de.js +++ b/locale/de.js @@ -145,9 +145,6 @@ locale.de = { just_edited: "Sie haben gerade OpenStreetMap editiert!", okay: "OK", - "zoom-in": "Hineinzoomen", - "zoom-out": "Herauszoomen", - nothing_to_undo: "Nichts zum Rückgängigmachen.", nothing_to_redo: "Nichts zum Wiederherstellen.", @@ -193,5 +190,10 @@ locale.de = { source_switch: { live: "live", dev: "dev" + }, + + zoom: { + in: "Hineinzoomen", + out: "Herauszoomen" } }; diff --git a/locale/en.js b/locale/en.js index 007c8e5be..501f36a37 100644 --- a/locale/en.js +++ b/locale/en.js @@ -145,9 +145,6 @@ locale.en = { just_edited: "You Just Edited OpenStreetMap!", okay: "Okay", - "zoom-in": "Zoom In", - "zoom-out": "Zoom Out", - nothing_to_undo: "Nothing to undo.", nothing_to_redo: "Nothing to redo.", @@ -193,5 +190,10 @@ locale.en = { source_switch: { live: "live", dev: "dev" + }, + + zoom: { + in: "Zoom In", + out: "Zoom Out" } }; diff --git a/locale/es.js b/locale/es.js index 4bb5f3959..0468405b5 100644 --- a/locale/es.js +++ b/locale/es.js @@ -145,9 +145,6 @@ locale.es = { just_edited: "Acabas de editar OpenStreetMap!", //"You Just Edited OpenStreetMap!", okay: "OK", //"Okay", - "zoom-in": "Aumentar", // "Zoom In", - "zoom-out": "Alejar", //"Zoom Out", - nothing_to_undo: "Nada para deshacer", //"Nothing to undo.", nothing_to_redo: "Nada para rehacer", //"Nothing to redo.", @@ -193,5 +190,10 @@ locale.es = { source_switch: { live: "en vivo", //"live", dev: "dev" + }, + + zoom: { + in: "Aumentar", // "Zoom In", + out: "Alejar" //"Zoom Out", } }; diff --git a/locale/fr.js b/locale/fr.js index adf4a2d26..4530924a0 100644 --- a/locale/fr.js +++ b/locale/fr.js @@ -145,9 +145,6 @@ locale.fr = { just_edited: "Vous venez de participer à OpenStreetMap!", okay: "Okay", - "zoom-in": "Zoomer", - "zoom-out": "Dézoomer", - nothing_to_undo: "Rien à annuler.", nothing_to_redo: "Rien à refaire.", @@ -193,5 +190,10 @@ locale.fr = { source_switch: { live: "live", dev: "dev" + }, + + zoom: { + in: "Zoomer", + out: "Dézoomer" } }; diff --git a/locale/ja.js b/locale/ja.js index b002f54bf..ada737bd1 100644 --- a/locale/ja.js +++ b/locale/ja.js @@ -145,9 +145,6 @@ locale.ja = { just_edited: "OpenStreetMap編集完了！", okay: "OK", - "zoom-in": "ズームイン", - "zoom-out": "ズームアウト", - nothing_to_undo: "やり直す変更点がありません", nothing_to_redo: "やり直した変更点がありません", @@ -193,5 +190,10 @@ locale.ja = { source_switch: { live: "本番サーバ", dev: "開発サーバ" + }, + + zoom: { + in: "ズームイン", + out: "ズームアウト" } }; diff --git a/locale/lv.js b/locale/lv.js index 1d55450f8..fd8be7cfe 100644 --- a/locale/lv.js +++ b/locale/lv.js @@ -145,9 +145,6 @@ locale.lv = { just_edited: "Jūs nupat rediģējāt OpenStreetMap", okay: "Labi", - "zoom-in": "Pietuvināt", - "zoom-out": "Attālināt", - nothing_to_undo: "Nav nekā, ko atcelt", nothing_to_redo: "Nav nekā, ko atsaukt", @@ -193,5 +190,10 @@ locale.lv = { source_switch: { live: "live", dev: "dev" + }, + + zoom: { + in: "Pietuvināt", + out: "Attālināt" } }; diff --git a/locale/tr.js b/locale/tr.js index d14f08ecb..a9b3e4b47 100644 --- a/locale/tr.js +++ b/locale/tr.js @@ -145,9 +145,6 @@ locale.tr = { just_edited: "Şu an OpenStreetMap'de bir değişiklik yaptınız!", okay: "Tamam", - "zoom-in": "Yaklaş", - "zoom-out": "Uzaklaş", - nothing_to_undo: "Geri alınacak birşey yok.", nothing_to_redo: "Tekrar yapılacak birşey yok.", @@ -193,5 +190,10 @@ locale.tr = { source_switch: { live: "canlı", dev: "geliştirme" + }, + + zoom: { + in: "Yaklaş", + out: "Uzaklaş" } };