Re: Keyboard shortcuts for non-English keyboard layouts

Have a look at https://unixpapa.com/js/testkey.html (and the accompanying blog post). Even though 12 years old, things haven't changed in browsers (fewer discrepancies, but no change in specs at least)

IIRC, nowadays you'd want to use keydown and keyup for that kind of keyboard shortcuts, and input otherwise (as a replacement for keypress)

You may also want to have a look at JS libraries dedicated to keyboard shortcuts (I don't know of any as I don't have that need) to see how they work.

On Saturday, December 14, 2024 at 1:26:46 PM UTC+1 Venky wrote:

Thanks for the reply Jens,

The issue that I am facing is with the '/', whose keycode is 191 in the standard keyboard layout and it is different in other keyboard layouts like the Latin American keyboard layout where the keycode for '/' is not 191. The keycode for the Alt key is same in almost all the keyboard layouts, so that is not the problem.
To check if the slash key is pressed along with the alt key I want to compare event.getNativeEvent().getCharCode() == '/' so that this is consistent in all keyboard layouts, but the issue is how do I check for this along with event.getNativeEvent().getAltKey() to know if both Alt + / are being pressed together.
The getCharCode() can be used only if there is a KeyPressEvent and getAltKeyCode() with KeyDownEvent or KeyUpEvent if I am not wrong, So how do I use them together.

On Thursday, December 12, 2024 at 4:48:49 AM UTC+5:30 Jens wrote:

Usually you want to use the "key" property of the event as it is independent of the physical location of the key. It contains the printable character if the keyboard key produces one. If it doesn't it contains a description like "shift".

Depending on how international you have to be, you might also want to think about keyboards that have two layouts: one with latin characters and one with non-latin characters (arabic, ..). These keyboards usually have a key to switch between both layouts and the layout with latin characters usually matches the standard English keyboard layout, but it doesn't have to. If you don't want to force your users to switch to latin mode before using a keyboard shortcut you would need to detect if the "key" property contains a non-latin character and if it does you should check "code" instead of "key" property. You would use the "code" of the English layout, assuming that the chance is high that the latin layout is indeed the standard English layout.

If you only support Chromium based browsers you can use the Keyboard API: https://developer.mozilla.org/en-US/docs/Web/API/Keyboard_API

-- J.

Venky schrieb am Mittwoch, 11. Dezember 2024 um 22:38:11 UTC+1:

Hey community,

I am working on a project where I want to introduce a keyboard shortcut for a particular action.

private void shortcutKeyHandler() {
    Event.addNativePreviewHandler(new Event.NativePreviewHandler() {
        @Override
        public void onPreviewNativeEvent(Event.NativePreviewEvent event) {
          NativeEvent nativeEvent = event.getNativeEvent();
          if (event.getTypeInt() == Event.ONKEYDOWN && nativeEvent.getAltKey() && nativeEvent.getKeyCode() == 191 && !db.isShowing()) {
            nativeEvent.preventDefault();
            execute();
          }
        }
      });
    }

In the code, I implemented a shortcut (Alt + /) to display a dialog box. While it works well with English keyboard layouts, the problem arises with other layouts where the Slash key (keycode 191) generates a different keycode.

Is there some workaround with the help of JSNI?

I would greatly appreciate any help in determining how to check the character code and verify if the Alt key is pressed.

Thanks in advance 

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To view this discussion visit https://groups.google.com/d/msgid/google-web-toolkit/5a33088f-2f30-421a-9779-cd519548d3ecn%40googlegroups.com.