Keyboard control service manipulates map even when map isn't focused

[rongoldinfeld]

Intended outcome: This keyboard service is used for handling map actions on keyboard events. So those actions should only occur when pressing the keys while the map is focused.

Actual outcome: Pressing keys described in KeyboardControlService are manipulating the map although the map is not focused

How to reproduce the issue: From the simple example at the documentation, focus another elements (even an input) and press the keys from the configuration, the map actions should occur.

My Suggestion: The event listeners are added on the document. I suggest registering them on the map.

Version

• [email protected]

[tomermoshe]

Hi, thanks for opening the issue. I think that the behavior you proposed makes sense for some use cases but is too specific and will not be suitable in other use cases. Instead we have an option to filter a keyboard action using the validate option in KeyboardControlParams

Here's an example that can help achieve the desired behavior:

this.keyboardControlService.setKeyboardControls(
  {
    W: {
      action: KeyboardAction.CAMERA_UP,
      validation: () => 
  document.activeElement.contains(this.cesiumService.getMap().getMapContainer()),
    },
  },
  (keyEvent: KeyboardEvent) => {
    if (keyEvent.code === 'KeyW' || keyEvent.code === 'ArrowUp') {
      return 'W';
    } else {
      return keyEvent.key;
    }
  },
);

[rongoldinfeld]

It might have a bad influence on performance? For each key press on the document such validation is performed. e.g : when typing inside an input Maybe giving the option to attach listeners to specific elements might be a better solution

[Crocsx]

I just wanted to up this Issues.

What kind of approach would be the best ?

• Passing an element to setKeyboardControls and bind a key to an element (or all a set to an element) (but need to keep track correctly on which key is assigned to which element, so that if the user assign another set, we can remove the previous correctly) ?
• Using the validation like we do now ? (I don't know if it does or not impact performance)
• Instead of assigning the event to the document like it is the case now, maybe give a tabIndex to the canvas, and bind the key event to the canvas ? so that it fires only when the canvas is focused (which might probably be what most user want)