diff --git a/web/share/js/kvm/hid.js b/web/share/js/kvm/hid.js index e95d92c2..e7aa29e6 100644 --- a/web/share/js/kvm/hid.js +++ b/web/share/js/kvm/hid.js @@ -71,21 +71,6 @@ export function Hid(__getGeometry, __recorder) { window.addEventListener("pagehide", __releaseAll); window.addEventListener("blur", __releaseAll); - tools.storage.bindSimpleSwitch($("hid-pak-ask-switch"), "hid.pak.ask", true); - tools.storage.bindSimpleSwitch($("hid-pak-secure-switch"), "hid.pak.secure", false, function(value) { - $("hid-pak-text").style.setProperty("-webkit-text-security", (value ? "disc" : "none")); - }); - tools.feature.setEnabled($("hid-pak-secure"), ( - tools.browser.is_chrome - || tools.browser.is_safari - || tools.browser.is_opera - )); - - $("hid-pak-keymap-selector").addEventListener("change", function() { - tools.storage.set("hid.pak.keymap", $("hid-pak-keymap-selector").value); - }); - - tools.el.setOnClick($("hid-pak-button"), __clickPasteAsKeysButton); tools.el.setOnClick($("hid-connect-switch"), __clickConnectSwitch); tools.el.setOnClick($("hid-reset-button"), __clickResetButton); @@ -117,8 +102,6 @@ export function Hid(__getGeometry, __recorder) { /************************************************************************/ self.setSocket = function(ws) { - tools.el.setEnabled($("hid-pak-text"), ws); - tools.el.setEnabled($("hid-pak-button"), ws); tools.el.setEnabled($("hid-reset-button"), ws); tools.el.setEnabled($("hid-jiggler-switch"), ws); if (!ws) { @@ -198,17 +181,11 @@ export function Hid(__getGeometry, __recorder) { tools.el.setEnabled($("hid-connect-switch"), (state && state.online && !state.busy)); if (state) { - __keyboard.setState(state.keyboard, state.online, state.busy); - __mouse.setState(state.mouse, state.online, state.busy); + __keyboard.setState(state.keyboard.online, state.keyboard.leds, state.online, state.busy); + __mouse.setState(state.mouse.online, state.mouse.absolute, state.online, state.busy); } }; - self.setKeymaps = function(state) { - let el = $("hid-pak-keymap-selector"); - tools.selector.setValues(el, state.keymaps.available); - tools.selector.setSelectedValue(el, tools.storage.get("hid.pak.keymap", state.keymaps["default"])); - }; - var __releaseAll = function() { __keyboard.releaseAll(); __mouse.releaseAll(); @@ -240,50 +217,6 @@ export function Hid(__getGeometry, __recorder) { }); }; - var __clickPasteAsKeysButton = function() { - let text = $("hid-pak-text").value; - if (text) { - let paste_as_keys = function() { - tools.el.setEnabled($("hid-pak-text"), false); - tools.el.setEnabled($("hid-pak-button"), false); - tools.el.setEnabled($("hid-pak-keymap-selector"), false); - - let keymap = $("hid-pak-keymap-selector").value; - - tools.debug(`HID: paste-as-keys ${keymap}: ${text}`); - - tools.httpPost("/api/hid/print", {"limit": 0, "keymap": keymap}, function(http) { - tools.el.setEnabled($("hid-pak-text"), true); - tools.el.setEnabled($("hid-pak-button"), true); - tools.el.setEnabled($("hid-pak-keymap-selector"), true); - $("hid-pak-text").value = ""; - if (http.status === 413) { - wm.error("Too many text for paste!"); - } else if (http.status !== 200) { - wm.error("HID paste error", http.responseText); - } else if (http.status === 200) { - __recorder.recordPrintEvent(text, keymap); - } - }, text, "text/plain"); - }; - - if ($("hid-pak-ask-switch").checked) { - wm.confirm(` - You're going to paste ${text.length} character${text.length ? "s" : ""}.
- Are you sure you want to continue? - `).then(function(ok) { - if (ok) { - paste_as_keys(); - } else { - $("hid-pak-text").value = ""; - } - }); - } else { - paste_as_keys(); - } - } - }; - var __clickOutputsRadio = function(hid) { let output = tools.radio.getValue(`hid-outputs-${hid}-radio`); tools.httpPost("/api/hid/set_params", {[`${hid}_output`]: output}, function(http) { diff --git a/web/share/js/kvm/keyboard.js b/web/share/js/kvm/keyboard.js index 68fb2167..2377d07a 100644 --- a/web/share/js/kvm/keyboard.js +++ b/web/share/js/kvm/keyboard.js @@ -65,17 +65,17 @@ export function Keyboard(__recordWsEvent) { __updateOnlineLeds(); }; - self.setState = function(state, hid_online, hid_busy) { + self.setState = function(online, leds, hid_online, hid_busy) { if (!hid_online) { __online = null; } else { - __online = (state.online && !hid_busy); + __online = (online && !hid_busy); } __updateOnlineLeds(); for (let led of ["caps", "scroll", "num"]) { for (let el of $$$(`.hid-keyboard-${led}-led`)) { - if (state.leds[led]) { + if (leds[led]) { el.classList.add("led-green"); el.classList.remove("led-gray"); } else { diff --git a/web/share/js/kvm/mouse.js b/web/share/js/kvm/mouse.js index 5f75175c..3310d17e 100644 --- a/web/share/js/kvm/mouse.js +++ b/web/share/js/kvm/mouse.js @@ -90,20 +90,20 @@ export function Mouse(__getGeometry, __recordWsEvent) { __updateOnlineLeds(); }; - self.setState = function(state, hid_online, hid_busy) { + self.setState = function(online, absolute, hid_online, hid_busy) { if (!hid_online) { __online = null; } else { - __online = (state.online && !hid_busy); + __online = (online && !hid_busy); } - if (!__absolute && state.absolute && __isRelativeCaptured()) { + if (!__absolute && absolute && __isRelativeCaptured()) { document.exitPointerLock(); } - if (__absolute && !state.absolute) { + if (__absolute && !absolute) { __relative_deltas = []; __relative_touch_pos = null; } - __absolute = state.absolute; + __absolute = absolute; __updateOnlineLeds(); }; diff --git a/web/share/js/kvm/paste.js b/web/share/js/kvm/paste.js new file mode 100644 index 00000000..8b770122 --- /dev/null +++ b/web/share/js/kvm/paste.js @@ -0,0 +1,112 @@ +/***************************************************************************** +# # +# KVMD - The main PiKVM daemon. # +# # +# Copyright (C) 2018-2024 Maxim Devaev # +# # +# This program is free software: you can redistribute it and/or modify # +# it under the terms of the GNU General Public License as published by # +# the Free Software Foundation, either version 3 of the License, or # +# (at your option) any later version. # +# # +# This program is distributed in the hope that it will be useful, # +# but WITHOUT ANY WARRANTY; without even the implied warranty of # +# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the # +# GNU General Public License for more details. # +# # +# You should have received a copy of the GNU General Public License # +# along with this program. If not, see . # +# # +*****************************************************************************/ + + +"use strict"; + + +import {tools, $} from "../tools.js"; +import {wm} from "../wm.js"; + + +export function Paste(__recorder) { + var self = this; + + /************************************************************************/ + + var __init__ = function() { + tools.storage.bindSimpleSwitch($("hid-pak-ask-switch"), "hid.pak.ask", true); + tools.storage.bindSimpleSwitch($("hid-pak-secure-switch"), "hid.pak.secure", false, function(value) { + $("hid-pak-text").style.setProperty("-webkit-text-security", (value ? "disc" : "none")); + }); + tools.feature.setEnabled($("hid-pak-secure"), ( + tools.browser.is_chrome + || tools.browser.is_safari + || tools.browser.is_opera + )); + + $("hid-pak-keymap-selector").addEventListener("change", function() { + tools.storage.set("hid.pak.keymap", $("hid-pak-keymap-selector").value); + }); + tools.el.setOnClick($("hid-pak-button"), __clickPasteAsKeysButton); + }; + + /************************************************************************/ + + self.setState = function(state) { + tools.el.setEnabled($("hid-pak-text"), state); + tools.el.setEnabled($("hid-pak-button"), state); + if (state) { + let el = $("hid-pak-keymap-selector"); + let sel = tools.storage.get("hid.pak.keymap", state.keymaps["default"]); + el.options.length = 0; + for (let keymap of state.keymaps.available) { + tools.selector.addOption(el, keymap, keymap, (keymap === sel)); + } + } + }; + + var __clickPasteAsKeysButton = function() { + let text = $("hid-pak-text").value; + if (text) { + let paste_as_keys = function() { + tools.el.setEnabled($("hid-pak-text"), false); + tools.el.setEnabled($("hid-pak-button"), false); + tools.el.setEnabled($("hid-pak-keymap-selector"), false); + + let keymap = $("hid-pak-keymap-selector").value; + + tools.debug(`HID: paste-as-keys ${keymap}: ${text}`); + + tools.httpPost("/api/hid/print", {"limit": 0, "keymap": keymap}, function(http) { + tools.el.setEnabled($("hid-pak-text"), true); + tools.el.setEnabled($("hid-pak-button"), true); + tools.el.setEnabled($("hid-pak-keymap-selector"), true); + $("hid-pak-text").value = ""; + if (http.status === 413) { + wm.error("Too many text for paste!"); + } else if (http.status !== 200) { + wm.error("HID paste error", http.responseText); + } else if (http.status === 200) { + __recorder.recordPrintEvent(text, keymap); + } + }, text, "text/plain"); + }; + + if ($("hid-pak-ask-switch").checked) { + wm.confirm(` + You're going to paste ${text.length} character${text.length ? "s" : ""}.
+ Are you sure you want to continue? + `).then(function(ok) { + if (ok) { + paste_as_keys(); + } else { + $("hid-pak-text").value = ""; + } + }); + } else { + paste_as_keys(); + } + } + }; + + __init__(); +} diff --git a/web/share/js/kvm/session.js b/web/share/js/kvm/session.js index 523b4097..a97b1a3b 100644 --- a/web/share/js/kvm/session.js +++ b/web/share/js/kvm/session.js @@ -28,6 +28,7 @@ import {wm} from "../wm.js"; import {Recorder} from "./recorder.js"; import {Hid} from "./hid.js"; +import {Paste} from "./paste.js"; import {Atx} from "./atx.js"; import {Msd} from "./msd.js"; import {Streamer} from "./stream.js"; @@ -48,6 +49,7 @@ export function Session() { var __streamer = new Streamer(); var __recorder = new Recorder(); var __hid = new Hid(__streamer.getGeometry, __recorder); + var __paste = new Paste(__recorder); var __atx = new Atx(__recorder); var __msd = new Msd(); var __gpio = new Gpio(__recorder); @@ -363,8 +365,8 @@ export function Session() { case "pong": __missed_heartbeats = 0; break; case "info_state": __setInfoState(data.event); break; case "gpio_state": __gpio.setState(data.event); break; - case "hid_keymaps_state": __hid.setKeymaps(data.event); break; case "hid_state": __hid.setState(data.event); break; + case "hid_keymaps_state": __paste.setState(data.event); break; case "atx_state": __atx.setState(data.event); break; case "msd_state": __msd.setState(data.event); break; case "streamer_state": __streamer.setState(data.event); break; @@ -395,6 +397,8 @@ export function Session() { __gpio.setState(null); __hid.setSocket(null); __recorder.setSocket(null); + + __paste.setState(null); __atx.setState(null); __msd.setState(null); __streamer.setState(null); diff --git a/web/share/js/tools.js b/web/share/js/tools.js index 97eb0abf..046813c6 100644 --- a/web/share/js/tools.js +++ b/web/share/js/tools.js @@ -317,30 +317,6 @@ export var tools = new function() { } return false; }, - - "setValues": function(el, values, empty_title=null) { - if (values.constructor == Object) { - values = Object.keys(values).sort(); - } - let values_json = JSON.stringify(values); - if (el.__values_json !== values_json) { - el.options.length = 0; - for (let value of values) { - let title = value; - if (title.length === 0 && empty_title !== null) { - title = empty_title; - } - self.selector.addOption(el, title, value); - } - el.__values_json = values_json; - el.__values = values; - } - }, - "setSelectedValue": function(el, value) { - if (el.__values && el.__values.includes(value)) { - el.value = value; - } - }, }; };