Recieving keypress events in custom modal


#1

Hi Guys,

I am trying to write a simple, general purpose ‘select one of these options’ modal. The modal is implemented using custom HTML/CSS and addModalPanel().

Ideally, I call the modal with a list of strings (in code). The modal starts up, and shows the strings to the user as individual list items. The user then uses their arrow keys + enter to select an item. A callback is invoked to deliver the results to a predefined handler.

Problem: I cannot seem to ‘get notified’ when the keys are pressed. I have tried many different methods but none work.

How can I get a method called when these keys are pressed in the modal?

Current code (keypresses not working): https://github.com/twitchyliquid64/ciphersink-soe/blob/master/lib/viewControllers/selectOptionModal.js#L41

Thanks :slight_smile:

Tom


#2

Atom does some stuff with keyboard support to make customizable keybindings possible. This means that just listening for keydown events on elements might or might not work. Take a look at how I added support for core:confirm and core:focus-next commands in my bug-report package to handle common Tab and Enter navigation in the bottom panel:

The benefit here is that people could map those commands to whatever key combination they wanted and everything would work as expected. But, by default, everything works normally with Tab for core:focus-next and Enter for core:confirm.