Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix for issue #4090: cmd.js line 20-26 replaced with OS-specific keyboard shortcut mappings with localization. #10570

Draft
wants to merge 3 commits into
base: develop
Choose a base branch
from
Draft

Fix for issue #4090: cmd.js line 20-26 replaced with OS-specific keyboard shortcut mappings with localization. #10570

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
34d48e6
Fix for issue #4090: cmd.js line 20-26 replaced with OS-specific keyb…
StillAbeginnerr Nov 30, 2024
959399e
Fix for issue #4090: cmd.js line 20-26 replaced with OS-specific keyb…
StillAbeginnerr Nov 30, 2024
672b376
Fix for issue #4090: cmd.js line 20-26 replaced with OS-specific keyb…
StillAbeginnerr Nov 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 8 additions & 6 deletions modules/ui/cmd.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,14 @@ export var uiCmd = function (code) {
if (detected.os === 'win') {
if (code === '⌘⇧Z') return 'Ctrl+Y';
}

var mac = (detected.os === 'mac');
var result = '',
replacements = {
'⌘': 'Ctrl',
'⇧': 'Shift',
'⌥': 'Alt',
'⌫': 'Backspace',
'⌦': 'Delete'
'⌘': mac ? '⌘ ' : t('shortcuts.key.ctrl'),
'⇧': mac ? '⇧ ' : t('shortcuts.key.shift'),
'⌥': mac ? '⌥ ' : t('shortcuts.key.alt'),
'⌫': mac ? '⌫ ' : t('shortcuts.key.backspace'),
'⌦': mac ? '⌦ ' : t('shortcuts.key.del'),
Comment on lines +20 to +24
Copy link
Collaborator

@1ec5 1ec5 Dec 1, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is essentially the same as what c22fa60 did in uiCmd.display down below to fix the Keyboard Shortcuts screen. I suspect c22fa60 didn’t touch this function because it’s also being used in places where raw key identifiers are needed rather than human-readable labels. For example, the following code uses the return value to register the actual keyboard shortcut:

iD/modules/ui/full_screen.js

Lines 72 to 73 in 3025d4f

var keys = (detected.os === 'mac' ? [uiCmd('⌃⌘F'), 'f11'] : ['f11']);
context.keybinding().on(keys, fullScreen);

iD/modules/ui/zoom.js

Lines 102 to 110 in 3025d4f

utilKeybinding.plusKeys.forEach(function(key) {
context.keybinding().on([key], zoomIn);
context.keybinding().on([uiCmd('⌥' + key)], zoomInFurther);
});
utilKeybinding.minusKeys.forEach(function(key) {
context.keybinding().on([key], zoomOut);
context.keybinding().on([uiCmd('⌥' + key)], zoomOutFurther);
});

If you run this branch on macOS, or on Windows with the German localization, will the shortcuts function correctly when you press them? If not, then maybe we need to revert this function to what it was previously. If we look back at the code I pointed to earlier, notice how it’s only being used to create the tooltip – so it’s probably only for display purposes:

iD/modules/ui/sections/data_layers.js

Line 404 in b5d45e3

.keys([uiCmd('⌘⇧' + t('info_panels.history.key'))])

If that’s the case, then changing that code to call uiCmd.display instead might fix the issue for that particular tooltip. So instead of implementing anything new, you’d be reviewing each of the calls to uiCmd, deciding whether it should be replaced with a call to uiCmd.display.

Copy link
Author

@StillAbeginnerr StillAbeginnerr Dec 1, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank very much for the detailed explanation, it's very helpful and I now understood with more clarity, gotta read more about this codebase, and I've marked the calls where uiCmd been called and now checking how useful, the uiCmd.display would be for a particular tooltip...will submit a pull request again after high detailed review of each call.

Copy link
Author

@StillAbeginnerr StillAbeginnerr Dec 3, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@1ec5

While working, I found these 2 issues/bug

  1. Issue with Key Functionality.

It seems that the keyboard shortcut for ? isn’t functioning as expected. Based on testing, it appears the shortcut should be labeled as Shift + ? instead of just ?, as pressing ? alone triggers the black overlay below the inspect button in the top-left corner.


Image 1 :

image

In Image 2, The Keyboard Shortcut should also be labeled as Shift + ?.

Image 2 :

image
  1. Interaction Limitation with Quality Assurance Tab
    When the Quality Assurance tab is open in the Help section, the Keyboard Shortcuts option becomes unclickable. Interestingly, this behavior is not observed with other tabs, which allow seamless access to the keyboard shortcuts.

Image 1 : For example, the Keyboard Shortcuts options is clickable in case of points tab.


image

Image 2 : When the Quality Assurance tab is open in the Help section, the Keyboard Shortcuts option becomes unclickable.


WhatsApp Image 2024-12-03 at 11 03 13

Checked with latest changes on both local host and online deployment.

Copy link
Author

@StillAbeginnerr StillAbeginnerr Dec 3, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

Help/Keyboard Shortcuts.

I’ve resolved the labeling issue mentioned in the previous comment (Issue 1, Image 2) by replacing ? with Shift + ? in the relevant file for "Show Keyboard Shortcuts". Should I create a separate issue and raise a PR for this fix, or is it okay to include it as part of this current work?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems that the keyboard shortcut for ? isn’t functioning as expected. Based on testing, it appears the shortcut should be labeled as Shift + ? instead of just ?, as pressing ? alone triggers the black overlay below the inspect button in the top-left corner.

I think spelling it as just “?” is a standard convention, at least on macOS. If you’re using an English keyboard layout, pressing that key alone would be /, not ?. A user-selectable keyboard layout could conceivably have ? as the primary function of a key, or it could require a modifier key other than Shift. All that matters to a Web application like iD is whether the user has pressed the some key combination that would input “?” into a text field.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When the Quality Assurance tab is open in the Help section, the Keyboard Shortcuts option becomes unclickable.

I can reproduce this issue – you can only click on a tiny sliver at the bottom of the button. This is probably unrelated to displaying localized keyboard shortcuts in the tooltip, so please open a separate issue about it. Thanks!

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for reviewing! I’ll go ahead and create a separate issue for this fix and then focus on the uiCmd functionality.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It seems that the keyboard shortcut for ? isn’t functioning as expected. Based on testing, it appears the shortcut should be labeled as Shift + ? instead of just ?, as pressing ? alone triggers the black overlay below the inspect button in the top-left corner.

I think spelling it as just “?” is a standard convention, at least on macOS. If you’re using an English keyboard layout, pressing that key alone would be /, not ?. A user-selectable keyboard layout could conceivably have ? as the primary function of a key, or it could require a modifier key other than Shift. All that matters to a Web application like iD is whether the user has pressed the some key combination that would input “?” into a text field.

You're absolutely right—using "?" as the shortcut makes sense, especially since it's about the input rather than the exact key combination. It’s a good reminder that different keyboard layouts might handle this differently, Thanks for pointing that out. 😊

};

for (var i = 0; i < code.length; i++) {
Expand All @@ -36,12 +36,14 @@ export var uiCmd = function (code) {
};



// return a display-focused string for a given keyboard code
uiCmd.display = function(code) {
if (code.length !== 1) return code;

var detected = utilDetect();
var mac = (detected.os === 'mac');

var replacements = {
'⌘': mac ? '⌘ ' + t('shortcuts.key.cmd') : t('shortcuts.key.ctrl'),
'⇧': mac ? '⇧ ' + t('shortcuts.key.shift') : t('shortcuts.key.shift'),
Expand Down
1 change: 1 addition & 0 deletions modules/ui/sections/data_layers.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -405,6 +405,7 @@ export function uiSectionDataLayers(context) {
.placement('top')
);


historyPanelLabelEnter
.append('input')
.attr('type', 'checkbox')
Expand Down