From 34206744f52a5dc36633e46ef9aad792dfcdbede Mon Sep 17 00:00:00 2001
From: Stian <stianlund@gmail.com>
Date: Thu, 24 Jul 2025 11:40:43 +0200
Subject: [PATCH] Update keyboard-lock

---
 test/keyboard-lock/index.html |  7 +++++++
 test/keyboard-lock/script.js  | 32 ++++++++++++++++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/test/keyboard-lock/index.html b/test/keyboard-lock/index.html
index e1aa7be..d705fbe 100755
--- a/test/keyboard-lock/index.html
+++ b/test/keyboard-lock/index.html
@@ -38,6 +38,13 @@
     <div class="info" hidden>
       The keyboard lock has captured this key or key combination.
     </div>
+
+    <div hidden>
+      Press the button to toggle pointer lock.
+      <button id="pointer" type="button">Activate pointer lock</button>
+    </div>
+
+
   </main>
 </body>
 
diff --git a/test/keyboard-lock/script.js b/test/keyboard-lock/script.js
index 18e285b..635d4c6 100755
--- a/test/keyboard-lock/script.js
+++ b/test/keyboard-lock/script.js
@@ -6,6 +6,7 @@ if (window.self === window.top) {
 
 const fullscreenButton = document.querySelector("#fullscreen");
 const keyboardButton = document.querySelector("#keyboard");
+const pointerButton = document.querySelector("#pointer");
 const body = document.body;
 const div = document.querySelector("div");
 const info = document.querySelector(".info");
@@ -14,10 +15,13 @@ const ENTER_FULLSCREEN = "Enter full screen";
 const LEAVE_FULLSCREEN = "Leave full screen";
 const ACTIVATE_KEYBOARD_LOCK = "Activate keyboard lock";
 const DEACTIVATE_KEYBOARD_LOCK = "Dectivate keyboard lock";
+const ACTIVATE_POINTER_LOCK= "Activate pointer lock";
+const DEACTIVATE_POINTER_LOCK= "Pointer lock activated";
 
 const LOCKED_KEYS = ["MetaLeft", "MetaRight", "Tab", "KeyN", "KeyT", "Escape"];
 
 let lock = false;
+let pointerlock = false;
 
 fullscreenButton.addEventListener("click", async () => {
   if (window.self !== window.top) {
@@ -57,6 +61,34 @@ keyboardButton.addEventListener("click", async () => {
   }
 });
 
+// POINTER LOCK
+// Update button text based on current pointer lock state
+function updatePointerButtonText() {
+  const isLocked = document.pointerLockElement === document.body;
+  pointerButton.textContent = isLocked
+    ? DEACTIVATE_POINTER_LOCK
+    : ACTIVATE_POINTER_LOCK;
+}
+
+// Click handler to toggle pointer lock
+pointerButton.addEventListener("click", async () => {
+  try {
+    const isLocked = document.pointerLockElement === document.body;
+
+    if (!isLocked) {
+      await document.body.requestPointerLock();
+    } else {
+      document.exitPointerLock();
+    }
+  } catch (err) {
+    alert(`${err.name}: ${err.message}`);
+  }
+});
+
+// Listen for lock state changes (user presses Esc, tab switches, etc.)
+document.addEventListener("pointerlockchange", updatePointerButtonText);
+
+
 document.addEventListener("fullscreenchange", () => {
   keyboardButton.textContent = ACTIVATE_KEYBOARD_LOCK;
   lock = false;