Combine and reuse translations for keyboard shortcuts

Using i18next's "nesting" and "interpolation" features should reduce the
overall number of strings to translate, as well as provide a
standardized pattern for shortcut tooltips (if applicable).

Note that this approach is still allowing for flexibility regarding
differently structured sentences in each language.

Resolves #315
This commit is contained in:
Henrik Fehlauer 2020-06-21 18:00:00 +00:00
parent e3a9f6206f
commit 09f987ea07
9 changed files with 156 additions and 66 deletions

View file

@ -24,8 +24,8 @@ BR.Map = {
if (BR.Util.getResponsiveBreakpoint() >= '3md') {
L.control
.zoom({
zoomInTitle: i18next.t('map.zoomInTitle'),
zoomOutTitle: i18next.t('map.zoomOutTitle')
zoomInTitle: i18next.t('keyboard.generic-shortcut', { action: '$t(map.zoomInTitle)', key: '+' }),
zoomOutTitle: i18next.t('keyboard.generic-shortcut', { action: '$t(map.zoomOutTitle)', key: '-' })
})
.addTo(map);
}
@ -105,7 +105,7 @@ BR.Map = {
var locationControl = L.control
.locate({
strings: {
title: i18next.t('map.locate-me')
title: i18next.t('keyboard.generic-shortcut', { action: '$t(map.locate-me)', key: 'L' })
},
icon: 'fa fa-location-arrow',
iconLoading: 'fa fa-spinner fa-pulse'

View file

@ -48,7 +48,7 @@ BR.RoutingOptions = L.Evented.extend({
// append shortcut text to tooltip
var button = $('#profile-alternative-form button')[0];
button.title = button.title + i18next.t('navbar.profile-tooltip');
button.title = button.title + i18next.t('navbar.profile-tooltip', { key: 'G' });
},
getOptions: function() {

View file

@ -46,7 +46,10 @@
search = new BR.Search();
map.addControl(search);
$('#map .leaflet-control-geocoder > button')[0].title = i18next.t('map.geocoder');
$('#map .leaflet-control-geocoder > button')[0].title = i18next.t('keyboard.generic-shortcut', {
action: '$t(map.geocoder)',
key: 'F'
});
router = L.bRouter(); //brouterCgi dummyRouter
@ -59,7 +62,10 @@
routing.draw(false);
control.state('activate-draw');
},
title: i18next.t('map.draw-route-stop')
title: i18next.t('keyboard.generic-shortcut', {
action: '$t(map.draw-route-stop)',
key: '$t(keyboard.escape)'
})
},
{
stateName: 'activate-draw',
@ -68,7 +74,7 @@
routing.draw(true);
control.state('deactivate-draw');
},
title: i18next.t('map.draw-route-start')
title: i18next.t('keyboard.generic-shortcut', { action: '$t(map.draw-route-start)', key: 'D' })
}
]
});
@ -78,7 +84,7 @@
function() {
routing.reverse();
},
i18next.t('map.reverse-route')
i18next.t('keyboard.generic-shortcut', { action: '$t(map.reverse-route)', key: 'R' })
);
var deletePointButton = L.easyButton(
@ -86,7 +92,7 @@
function() {
routing.deleteLastPoint();
},
i18next.t('map.delete-last-point')
i18next.t('keyboard.generic-shortcut', { action: '$t(map.delete-last-point)', key: 'Z' })
);
deleteRouteButton = L.easyButton(
@ -94,7 +100,7 @@
function() {
clearRoute();
},
i18next.t('map.clear-route-tooltip')
i18next.t('keyboard.generic-shortcut', { action: '$t(map.clear-route)', key: '$t(keyboard.backspace)' })
);
L.DomEvent.addListener(
@ -175,8 +181,11 @@
profile.update(evt.options);
});
BR.NogoAreas.MSG_BUTTON = i18next.t('map.nogo.draw');
BR.NogoAreas.MSG_BUTTON_CANCEL = i18next.t('map.nogo.cancel');
BR.NogoAreas.MSG_BUTTON = i18next.t('keyboard.generic-shortcut', { action: '$t(map.nogo.draw)', key: 'N' });
BR.NogoAreas.MSG_BUTTON_CANCEL = i18next.t('keyboard.generic-shortcut', {
action: '$t(map.nogo.cancel)',
key: '$t(keyboard.escape)'
});
BR.NogoAreas.MSG_CREATE = i18next.t('map.nogo.click-drag');
BR.NogoAreas.MSG_DISABLED = i18next.t('map.nogo.edit');
BR.NogoAreas.MSG_ENABLED = i18next.t('map.nogo.help');
@ -313,7 +322,7 @@
map.addControl(
new BR.OpacitySliderControl({
id: 'route',
title: i18next.t('map.opacity-slider'),
title: i18next.t('map.opacity-slider-shortcut', { action: '$t(map.opacity-slider)', key: 'M' }),
muteKeyCode: 77, // m
callback: L.bind(routing.setOpacity, routing)
})
@ -456,8 +465,9 @@
}
},
function(err, t) {
jqueryI18next.init(i18next, $);
$('html').localize({
jqueryI18next.init(i18next, $, { useOptionsAttr: true });
$('html').localize();
$('#aboutLinks').localize({
privacyPolicyUrl: BR.conf.privacyPolicyUrl || 'https://brouter.de/privacypolicy.html'
});

View file

@ -25,7 +25,7 @@ BR.PoiMarkers = L.Control.extend({
onClick: function() {
self.draw(true);
},
title: i18next.t('map.draw-poi-start')
title: i18next.t('keyboard.generic-shortcut', { action: '$t(map.draw-poi-start)', key: 'P' })
},
{
stateName: 'deactivate-poi',
@ -33,7 +33,10 @@ BR.PoiMarkers = L.Control.extend({
onClick: function() {
self.draw(false);
},
title: i18next.t('map.draw-poi-stop')
title: i18next.t('keyboard.generic-shortcut', {
action: '$t(map.draw-poi-stop)',
key: '$t(keyboard.escape)'
})
}
]
}).addTo(map);

View file

@ -21,7 +21,7 @@ BR.RoutingPathQuality = L.Control.extend({
this.providers = {
incline: {
title: i18next.t('map.route-quality-incline'),
title: i18next.t('map.route-quality-shortcut', { action: '$t(map.route-quality-incline)', key: 'C' }),
icon: 'fa-line-chart',
provider: new HotLineQualityProvider({
hotlineOptions: {
@ -48,7 +48,7 @@ BR.RoutingPathQuality = L.Control.extend({
})
},
altitude: {
title: i18next.t('map.route-quality-altitude'),
title: i18next.t('map.route-quality-shortcut', { action: '$t(map.route-quality-altitude)', key: 'C' }),
icon: 'fa-area-chart',
provider: new HotLineQualityProvider({
hotlineOptions: {
@ -61,7 +61,7 @@ BR.RoutingPathQuality = L.Control.extend({
})
},
cost: {
title: i18next.t('map.route-quality-cost'),
title: i18next.t('map.route-quality-shortcut', { action: '$t(map.route-quality-cost)', key: 'C' }),
icon: 'fa-usd',
provider: new HotLineQualityProvider({
hotlineOptions: {

View file

@ -1,8 +1,8 @@
BR.stravaSegments = function(map, layersControl) {
var stravaControl = L.control
.stravaSegments({
runningTitle: i18next.t('map.strava-running'),
bikingTitle: i18next.t('map.strava-biking'),
runningTitle: i18next.t('map.strava-shortcut', { action: '$t(map.strava-running)', key: 'S' }),
bikingTitle: i18next.t('map.strava-shortcut', { action: '$t(map.strava-biking)', key: 'S' }),
loadingTitle: i18next.t('map.loading'),
stravaToken: BR.keys.strava
})