More Events

• I want to write a game called Place Enteres
• To make this game I need some more interaction.
  • We discussed the event loop. What was that?
  • What is an event.
• Event Reference.
  • Briefly scroll down the list of types of events.
  • I probably want a keyboard, but perhaps a mouse event.
• The basic data type returned is an event
  • We connect events with addEventListener()
  • Note that multiple elements can receive an event.
    • But this can make things very complicated.
    • Better not to do this.
  • My code is just a bit more complex as I want the canvas hidden.
    • So I added AddListener to set an event
      • I could, if I wish, use removeEventListener
• The "click" event
  • pointer event reference.
  • This is derived from the Mouse event
  • We get multiple x and y locations
    • client x,y are relative to the browser
    • screen x,y are the screen location (monitor coordinates)
    • offset x,y are what we want.
  • look through the other fields of the event.
• I would also like to get some keypresses
  • By the way, for some reason you need keydown to get the arrow keys
  • I could use "a,d", "j,k", or left arrow, right arrow to move left and right.
  • reference
  • You may have noticed earlier, this.#canvas.tabIndex = 0
    • By default, the canvas does not receive keypresses
    • This makes that happen.
    • But you may need to click on the canvas to change the focus of the keypress events.
    • (everyone wants the keypresses)