I was able to get both approaches to work: 1) Setting tabindex to 0 on the div: This works but the div does not automatically get focus - I still have to click on it, and then it responds to keypresses. I tried setting the attribute autofocus = 1 but that didn’t help. Also it draws a blue border around the div, which I could probably figure out how to hide.
2) Changing to a “program” instead of “beginnerProgram” and setting up a subscription using the Keyboard package. I think I’m happiest with this. In either case I’m now watching for keydown events. On Fri, Feb 3, 2017 at 9:53 AM, Lyle Kopnicky <[email protected]> wrote: > I'll try that, thanks. I guess the elm-lang/keyboard approach is for > catching keys from anywhere on the page, but catching them on the div is > preferred if you have other elements on the screen that should manage their > own keypresses. At this point it's the only div on the screen so it doesn't > make a big difference. I'll try setting the focus and see how that works. > > On Thu, Feb 2, 2017 at 5:54 AM, Bernardo <[email protected]> wrote: > >> Your code should work with a couple of changes. To receive the events the >> div should have the focus; divs normally don't have focus, so you need to >> add the attribute tabindex 0 to be able to focus the div. Also instead >> of the keypress event you should listen to keydown as keypress is only >> for printable characters. >> >> >> On Thursday, 2 February 2017 04:23:31 UTC-3, Lyle Kopnicky wrote: >>> >>> Hi folks, >>> >>> I'm having trouble detecting keypresses in Elm 0.18. The only examples I >>> can find are old ones that use Signals. There are no examples in the Elm >>> Architecture Tutorial. The Html.Events module documentation shows a piece >>> of the puzzle with the example for onKeyUp. >>> >>> Heres a gist with the code: https://gist.github.com/ >>> anonymous/5f54c2b2c8fb42a31d4ae37058a72e2a >>> >>> You can ignore the KaTeX import - that's not used at the moment. >>> >>> It compiles and runs, but the circle just sits there. I have know way of >>> knowing if it's detecting my keypresses. I thought that by putting the >>> event handler on the outer div, it would intercept keypresses. I didn't >>> have any way of adding handler to the svg element. >>> >>> BTW I also tried 'keyup' instead of 'keypress', and I tried making it >>> generate the MoveRight message for any key, just to make sure it wasn't bad >>> key code problem. >>> >>> Do I need to somehow attach the keypress handler to the document >>> instead? Perhaps I need to use a subscription? I'm not finding any guidance >>> in the docs. Any help would be appreciated. >>> >>> Thanks, >>> Lyle >>> >> -- >> You received this message because you are subscribed to a topic in the >> Google Groups "Elm Discuss" group. >> To unsubscribe from this topic, visit https://groups.google.com/d/to >> pic/elm-discuss/TytivlR2CH0/unsubscribe. >> To unsubscribe from this group and all its topics, send an email to >> [email protected]. >> For more options, visit https://groups.google.com/d/optout. >> > > -- You received this message because you are subscribed to the Google Groups "Elm Discuss" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. For more options, visit https://groups.google.com/d/optout.
