Skip to content

Instantly share code, notes, and snippets.

@xenago
Forked from toff/FullScreenGrabKeyboard.user.js
Last active March 19, 2023 03:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save xenago/e92b6e36b9aec5a638d1b676fab7a517 to your computer and use it in GitHub Desktop.
Save xenago/e92b6e36b9aec5a638d1b676fab7a517 to your computer and use it in GitHub Desktop.
Grant webapps full keyboard access to enable use of additional shortcuts; useful with Apache Guacamole remote sessions.
// ==UserScript==
// @name Full-screen Grab Keyboard
// @version 0.1
// @description Lock the keyboard in full-screen mode, granting webapps access to additional key shortcuts
// @match https://SITE_URL_HERE/*
// @grant none
// @noframes
// @author xenago
// ==/UserScript==
// Notes:
// - Only compatible with Chromium-based browsers
// - Full-screen is required for this to work, it does not function outside that mode
// References:
// Original author toff's version: https://gist.github.com/toff/ab1ba901dc663297af1fb4b8e630d899
// https://developer.mozilla.org/en-US/docs/Web/API/Keyboard/lock#browser_compatibility
// https://chromestatus.com/feature/5642959835889664
// https://wicg.github.io/keyboard-lock/
// https://github.com/WICG/keyboard-lock
(function() {
'use strict';
// Create a button to go full-screen.
let fsButtonElem = document.createElement("input");
fsButtonElem.type = "button";
fsButtonElem.value = "🖵";
fsButtonElem.style.position = "absolute";
fsButtonElem.style.top = "8px";
fsButtonElem.style.left = "24px";
fsButtonElem.style.opacity = "40%";
fsButtonElem.style.padding = "3px 4px 0px 4px";
fsButtonElem.style.zIndex = 10000;
fsButtonElem.style.fontSize = "11px";
fsButtonElem.isMoving = false;
fsButtonElem.addEventListener("click", function() {
if (!fsButtonElem.isMoving) {
if (!document.fullscreenElement) {
document.body.requestFullscreen();
} else {
document.exitFullscreen();
}
}
fsButtonElem.isMoving = false;
});
document.body.appendChild(fsButtonElem);
// Lock the keyboard once in full-screen mode
document.addEventListener("fullscreenchange", event => {
if (document.fullscreenElement) {
if (navigator.keyboard) {
console.log("Locking keyboard.");
navigator.keyboard.lock();
} else {
console.error("Locking keyboard is not supported.");
}
}
});
})();
@xenago
Copy link
Author

xenago commented Mar 19, 2023

Note: this is extremely useful with Apache Guacamole, to ensure actions like Alt+Tab get passed through to a remote session.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment