search

georgealways / lil-gui

Makes a floating panel for controllers on the web. Works as a drop-in replacement for dat.gui in most projects.
https://lil-gui.georgealways.com/
MIT License
1.15k stars 47 forks source link

captureKeys flag #138

Closed georgealways closed 1 week ago

georgealways commented 4 months ago

[!WARNING]
NO LONGER PLANNED: See https://github.com/georgealways/lil-gui/pull/138#issuecomment-2381385272

Adds a captureKeys flag to GUI's constructor, which is true by default. If this is false, GUI will not call stopPropagation() on key events that originate from within the GUI. The user must then manage event propagation manually using something like the following:

const gui = new GUI( { captureKeys: false } );

window.addEventListener( 'keydown', e => { 
  if ( gui.domElement.contains( e.target ) ) {
    // I'm typing in the GUI.
  } else if ( e.code === 'Space' ) {
    jump();
  }
});

The reason for this change is to have uniform behavior between Controllers and folder titles: they both respect captureKeys the same way. Of course, you can disable this behavior with { captureKeys: false }, but then you must manage all events yourself as shown above.

For tests: expanded the browser shim to simulate event propagation.

georgealways commented 1 week ago

I wanted to give an update here as I think I've been acting on a few false positives regarding this behavior across different threads.

Reading back my approach above, it feels like this has led to more complexity than is warranted. In the next release, there will still be no user control over this behavior.

Controllers will ALWAYS capture key events. Folder titles will NEVER capture key events.

I can't think of a reasonable use case where you'd want to control your app via keyboard while simultaneously typing in a controller. Folders should not (and AFAICT did not) ever capture your keystrokes.