Initial commit (#29193)

tgui/packages/tgui/backend.ts

@@ -15,6 +15,7 @@ import { perf } from 'common/perf';
 import { createAction } from 'common/redux';
 import { setupDrag } from './drag';
 import { focusMap } from './focus';
+import { releaseHeldKeys, startKeyPassthrough, stopKeyPassthrough } from './hotkeys';
 import { createLogger } from './logging';
 import { resumeRenderer, suspendRenderer } from './renderer';
 
@@ -153,6 +154,8 @@ export const backendMiddleware = (store) => {
       Byond.winset(Byond.windowId, {
         'is-visible': false,
       });
+      stopKeyPassthrough();
+      releaseHeldKeys();
       setTimeout(() => focusMap());
     }
 
@@ -179,6 +182,7 @@ export const backendMiddleware = (store) => {
       logger.log('backend/update', payload);
       // Signal renderer that we have resumed
       resumeRenderer();
+      startKeyPassthrough();
       // Setup drag
       setupDrag();
       // We schedule this for the next tick here because resizing and unhiding

tgui/packages/tgui/hotkeys.ts

@@ -30,6 +30,9 @@ const hotKeysAcquired = [
 // State of passed-through keys.
 const keyState: Record<string, boolean> = {};
 
+// Custom listeners for key events
+const keyListeners: ((key: KeyEvent) => void)[] = [];
+
 /**
  * Converts a browser keycode to BYOND keycode.
  */
@@ -177,7 +180,20 @@ export const setupHotKeys = () => {
   globalEvents.on('window-blur', () => {
     releaseHeldKeys();
   });
-  globalEvents.on('key', (key: KeyEvent) => {
-    handlePassthrough(key);
-  });
+  startKeyPassthrough();
+};
+
+export const startKeyPassthrough = () => {
+  globalEvents.on('key', keyEvent);
+};
+
+export const stopKeyPassthrough = () => {
+  globalEvents.off('key', keyEvent);
+};
+
+const keyEvent = (key: KeyEvent) => {
+  for (const keyListener of keyListeners) {
+    keyListener(key);
+  }
+  handlePassthrough(key);
 };