diff --git a/web/kvm/index.html b/web/kvm/index.html
index 97f6f2b4..0ba4ba09 100644
--- a/web/kvm/index.html
+++ b/web/kvm/index.html
@@ -175,16 +175,16 @@
-
+
| Keyboard mode: |
-
+
|
-
+
| Mouse mode: |
-
+
|
diff --git a/web/kvm/navbar-system.pug b/web/kvm/navbar-system.pug
index 03910cb2..96a5fa5c 100644
--- a/web/kvm/navbar-system.pug
+++ b/web/kvm/navbar-system.pug
@@ -48,12 +48,12 @@ li(class="right")
div(id="hid-outputs" class="feature-disabled")
hr
table(class="kv")
- tr
+ tr(id="hid-outputs-keyboard", class="feature-disabled")
td Keyboard mode:
- td #[div(id="hid-outputs-keyboard" class="radio-box")]
- tr
+ td #[div(id="hid-outputs-keyboard-box" class="radio-box")]
+ tr(id="hid-outputs-mouse", class="feature-disabled")
td Mouse #[a(target="_blank" href="https://github.com/pikvm/pikvm/blob/master/pages/mouse.md") mode]:
- td #[div(id="hid-outputs-mouse" class="radio-box")]
+ td #[div(id="hid-outputs-mouse-box" class="radio-box")]
table(class="kv")
tr(id="hid-mouse-squash" class="feature-disabled")
+menu_switch_notable("hid-mouse-squash-switch", "Squash relative mouse moves", true, true)
diff --git a/web/share/js/kvm/hid.js b/web/share/js/kvm/hid.js
index a561ae4f..dac36341 100644
--- a/web/share/js/kvm/hid.js
+++ b/web/share/js/kvm/hid.js
@@ -112,10 +112,8 @@ export function Hid(__getResolution) {
if (state && state.online) {
let keyboard_outputs = state.keyboard.outputs.available;
let mouse_outputs = state.mouse.outputs.available;
- let has_outputs = (keyboard_outputs.length || mouse_outputs.length);
- let has_relative = false;
- if (has_outputs) {
- if ($("hid-outputs-keyboard").outputs !== keyboard_outputs) {
+ if (keyboard_outputs.length) {
+ if ($("hid-outputs-keyboard-box").outputs !== keyboard_outputs) {
let html = "";
for (let args of [
["USB", "usb"],
@@ -126,11 +124,15 @@ export function Hid(__getResolution) {
html += tools.radioMakeItem("hid-outputs-keyboard-radio", args[0], args[1]);
}
}
- $("hid-outputs-keyboard").innerHTML = html;
- $("hid-outputs-keyboard").outputs = keyboard_outputs;
+ $("hid-outputs-keyboard-box").innerHTML = html;
+ $("hid-outputs-keyboard-box").outputs = keyboard_outputs;
tools.radioSetOnClick("hid-outputs-keyboard-radio", () => __clickOutputsRadio("keyboard"));
}
- if ($("hid-outputs-mouse").outputs !== mouse_outputs) {
+ tools.radioSetValue("hid-outputs-keyboard-radio", state.keyboard.outputs.active);
+ }
+ let has_relative = false;
+ if (mouse_outputs.length) {
+ if ($("hid-outputs-mouse-box").outputs !== mouse_outputs) {
let html = "";
for (let args of [
["USB", "usb", false],
@@ -143,18 +145,19 @@ export function Hid(__getResolution) {
has_relative = (has_relative || args[2]);
}
}
- $("hid-outputs-mouse").innerHTML = html;
- $("hid-outputs-mouse").outputs = mouse_outputs;
+ $("hid-outputs-mouse-box").innerHTML = html;
+ $("hid-outputs-mouse-box").outputs = mouse_outputs;
tools.radioSetOnClick("hid-outputs-mouse-radio", () => __clickOutputsRadio("mouse"));
}
- tools.radioSetValue("hid-outputs-keyboard-radio", state.keyboard.outputs.active);
tools.radioSetValue("hid-outputs-mouse-radio", state.mouse.outputs.active);
has_relative_squash = ["usb_rel", "ps2"].includes(state.mouse.outputs.active);
} else {
has_relative = !state.mouse.absolute;
has_relative_squash = has_relative;
}
- tools.featureSetEnabled($("hid-outputs"), has_outputs);
+ tools.featureSetEnabled($("hid-outputs"), (keyboard_outputs.length || mouse_outputs.length));
+ tools.featureSetEnabled($("hid-outputs-keyboard"), keyboard_outputs.length);
+ tools.featureSetEnabled($("hid-outputs-mouse"), mouse_outputs.length);
tools.featureSetEnabled($("hid-mouse-squash"), has_relative);
tools.featureSetEnabled($("hid-connect"), (state.connected !== null));
$("hid-connect-switch").checked = !!state.connected;