diff options
| author | Maxim Devaev <[email protected]> | 2023-10-25 00:56:08 +0300 |
|---|---|---|
| committer | Maxim Devaev <[email protected]> | 2023-10-25 00:56:08 +0300 |
| commit | 3c611121a8e077e55478b9c55b51221f25207a9d (patch) | |
| tree | 4c7352556d583bd8881e2b4dac31cfdc0e6ef886 | |
| parent | 620b9fcc890e6ffd1016847d9ab9313aa3ce063c (diff) | |
web: option to remap ctrl/caps
| -rw-r--r-- | web/kvm/index.html | 16 | ||||
| -rw-r--r-- | web/kvm/navbar-system.pug | 8 | ||||
| -rw-r--r-- | web/share/css/navbar.css | 4 | ||||
| -rw-r--r-- | web/share/js/kvm/keyboard.js | 9 |
4 files changed, 33 insertions, 4 deletions
diff --git a/web/kvm/index.html b/web/kvm/index.html index 74485ade..33533dc1 100644 --- a/web/kvm/index.html +++ b/web/kvm/index.html @@ -259,11 +259,23 @@ </table> </div> <details> - <summary>Mouse settings</summary> + <summary>Keyboard & Mouse (HID) settings</summary> <div class="spoiler"> <table class="kv"> <tr> - <td>Polling interval:</td> + <td>Swap Left Ctrl and Caps keys:</td> + <td align="right"> + <div class="switch-box"> + <input type="checkbox" id="hid-keyboard-swap-cc-switch"> + <label for="hid-keyboard-swap-cc-switch"><span class="switch-inner"></span><span class="switch"></span></label> + </div> + </td> + </tr> + </table> + <hr> + <table class="kv"> + <tr> + <td>Mouse polling:</td> <td class="value-slider"> <input class="slider" type="range" id="hid-mouse-rate-slider"> </td> diff --git a/web/kvm/navbar-system.pug b/web/kvm/navbar-system.pug index f8d53793..f41e0abb 100644 --- a/web/kvm/navbar-system.pug +++ b/web/kvm/navbar-system.pug @@ -69,11 +69,15 @@ li(id="system-dropdown" class="right") td Mouse #[a(target="_blank" href="https://docs.pikvm.org/mouse") mode]: td #[div(id="hid-outputs-mouse-box" class="radio-box")] details - summary Mouse settings + summary Keyboard & Mouse (HID) settings div(class="spoiler") table(class="kv") tr - td Polling interval: + +menu_switch_notable("hid-keyboard-swap-cc-switch", "Swap Left Ctrl and Caps keys", true, false) + hr + table(class="kv") + tr + td Mouse polling: td(class="value-slider") #[input(type="range" id="hid-mouse-rate-slider" class="slider")] td(id="hid-mouse-rate-value" class="value-number") tr(id="hid-mouse-sens" class="feature-disabled") diff --git a/web/share/css/navbar.css b/web/share/css/navbar.css index afee8f02..00249647 100644 --- a/web/share/css/navbar.css +++ b/web/share/css/navbar.css @@ -150,6 +150,10 @@ ul#navbar li div.menu details div.spoiler { border-left: var(--border-default-thin); border-bottom: var(--border-default-thin); } +ul#navbar li div.menu details div.spoiler hr { + border: none; + border-top: var(--border-default-thin); +} ul#navbar li div.menu details summary::marker { color: var(--cs-marker-fg); } diff --git a/web/share/js/kvm/keyboard.js b/web/share/js/kvm/keyboard.js index b398e769..686d968b 100644 --- a/web/share/js/kvm/keyboard.js +++ b/web/share/js/kvm/keyboard.js @@ -51,6 +51,8 @@ export function Keyboard(__recordWsEvent) { window.addEventListener("focusin", __updateOnlineLeds); window.addEventListener("focusout", __updateOnlineLeds); + + tools.storage.bindSimpleSwitch($("hid-keyboard-swap-cc-switch"), "hid.keyboard.swap_cc", false); }; /************************************************************************/ @@ -129,6 +131,13 @@ export function Keyboard(__recordWsEvent) { var __sendKey = function(code, state) { tools.debug("Keyboard: key", (state ? "pressed:" : "released:"), code); + if ($("hid-keyboard-swap-cc-switch").checked) { + if (code === "ControlLeft") { + code = "CapsLock"; + } else if (code === "CapsLock") { + code = "ControlLeft"; + } + } let event = { "event_type": "key", "event": {"key": code, "state": state}, |