seastan / dragncards

Multiplayer online card game platform written in Elixir, Phoenix, and React. Drag and Drop provided by React-Beautiful-DND.
https://dragncards.com/
77 stars 41 forks source link

Handling modifier keys on Mac #90

Open morvael opened 1 month ago

morvael commented 1 month ago

1) Cmd key is reported as left Alt key on Windows/Linux

2) Alt key on Mac works like both Alts pressed together on Windows/Linux. For example with Polish programmers keyboard right Alt+S is recognized by the game as just Ś. But on Mac it's always Alt+Ś (whether you press left or right Alt doesn't matter), which is equivalent of left Alt+right Alt+S on Windows/Linux.

3) Full screen combo is Shift + Cmd + F, which the engine still blocks from reaching the browser, unlike F11 (which was fixed for Windows/Linux in https://github.com/seastan/dragncards/issues/76).

I think Mac users are more used to thinking of Cmd+letter hotkeys like we think of Ctrl+letter hotkeys (for example copy is Cmd+C, paste is Cmd+V). Therefore there are two ways of improving hotkey legend and compatibility:

morvael commented 1 month ago

Some info on recognizing Cmd key: https://stackoverflow.com/questions/3902635/how-to-capture-a-macs-command-key-press-in-javascript leading to https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/metaKey

morvael commented 1 month ago

The fix would require printing different symbols in hotkey legend (and I print them in card menus too, so would need some "translating" function that works in the frontend?), and encapsulating the check for virtual "Ctrl" or "Alt" that would map into proper event field depending on OS.