ben/brouter-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Add shortcut to toggle profile switcher

Browse source 
Press 'G' to open the profile switcher, select a profile with the arrow
keys, apply with 'Enter' and close the switcher with 'Escape'.

While 'T' and 'P' will be / were already taken, 'G' is at least easily
reachable with the left hand for users using a mouse with their right
hand at the same time.

Since Bootstrap keeps updating the tooltip when changing options in the
dropdown (which is useful in case the text is longer than the width of
the control), the shortcut text needs to be applied dynamically too.
This commit is contained in:
Henrik Fehlauer 2020-06-09 18:00:00 +00:00
parent ba0bb39fd5
commit 6da520ed4d
3 changed files with 23 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

20
js/control/RoutingOptions.js
View file

@ -1,4 +1,10 @@
BR.RoutingOptions = L.Evented.extend({
options: {
shortcut: {
switch: 71 // char code for 'g'
}
},
initialize: function() {
$('#profile-alternative').on('changed.bs.select', this._getChangeHandler());
@ -15,6 +21,8 @@ BR.RoutingOptions = L.Evented.extend({
profiles_list.children[0].value = 'Custom';
// <custom> profile is empty at start, select next one
profiles_list.children[1].selected = true;
L.DomEvent.addListener(document, 'keydown', this._keydownListener, this);
},
refreshUI: function() {
@ -37,6 +45,10 @@ BR.RoutingOptions = L.Evented.extend({
custom.disabled = true;
}
$('.selectpicker').selectpicker('refresh');
// append shortcut text to tooltip
var button = $('#profile-alternative-form button')[0];
button.title = button.title + i18next.t('navbar.profile-tooltip');
},
getOptions: function() {
@ -105,5 +117,13 @@ BR.RoutingOptions = L.Evented.extend({
return L.bind(function(evt) {
this.fire('update', { options: this.getOptions() });
}, this);
},
_keydownListener: function(e) {
if (BR.Util.keyboardShortcutsAllowed(e) && e.keyCode === this.options.shortcut.switch) {
if (!$('#profile-alternative-form .dropdown').hasClass('show')) {
$('#profile-alternative-form button').click();
}
}
}
});