GithubFollow/One-KVM
1
0
Fork 0
mirror of https://github.com/mofeng-git/One-KVM.git synced 2025-12-13 01:30:31 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

improved wm dialogs

Browse Source
This commit is contained in:
Maxim Devaev 2024-09-23 02:32:38 +03:00
parent 5ed368769c
commit 8209ee2eb0
9 changed files with 71 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/share/js/index/main.js
View File

@ -57,7 +57,7 @@ function __loadKvmdInfo() {
let apps = []; let apps = [];
if (info.extras === null) { if (info.extras === null) {
wm.error("Not all applications in the menu can be displayed<br>due an error. See KVMD logs for details."); wm.error("Not all applications in the menu can be displayed due an error.<br>See KVMD logs for details.");
} else { } else {
apps = Object.values(info.extras).sort(function(a, b) { apps = Object.values(info.extras).sort(function(a, b) {
if (a.place < b.place) { if (a.place < b.place) {
@ -113,7 +113,7 @@ function __makeApp(id, path, icon, name) {
<a href="${path}"> <a href="${path}">
<div> <div>
<img class="svg-gray" src="${icon}"> <img class="svg-gray" src="${icon}">
${name} ${tools.escape(name)}
</div> </div>
</a> </a>
</div> </div>
@ -125,7 +125,7 @@ function __logout() {
if (http.status === 200 || http.status === 401 || http.status === 403) { if (http.status === 200 || http.status === 401 || http.status === 403) {
document.location.href = "/login"; document.location.href = "/login";
} else { } else {
wm.error("Logout error:<br>", http.responseText); wm.error("Logout error", http.responseText);
} }
}); });
} }

27
web/share/js/kvm/atx.js
View File

@ -38,19 +38,9 @@ export function Atx(__recorder) {
tools.storage.bindSimpleSwitch($("atx-ask-switch"), "atx.ask", true); tools.storage.bindSimpleSwitch($("atx-ask-switch"), "atx.ask", true);
for (let args of [ tools.el.setOnClick($("atx-power-button"), () => __clickAtx("power"));
["atx-power-button", "power", "Are you sure you want to press the power button?"], tools.el.setOnClick($("atx-power-button-long"), () => __clickAtx("power_long"));
["atx-power-button-long", "power_long", ` tools.el.setOnClick($("atx-reset-button"), () => __clickAtx("reset"));
Are you sure you want to long press the power button?<br>
Warning! This could cause data loss on the server.
`],
["atx-reset-button", "reset", `
Are you sure you want to press the reset button?<br>
Warning! This could case data loss on the server.
`],
]) {
tools.el.setOnClick($(args[0]), () => __clickButton(args[1], args[2]));
}
}; };
/************************************************************************/ /************************************************************************/
@ -71,20 +61,23 @@ export function Atx(__recorder) {
} }
}; };
var __clickButton = function(button, confirm_msg) { var __clickAtx = function(button) {
let click_button = function() { let click_button = function() {
tools.httpPost("/api/atx/click", {"button": button}, function(http) { tools.httpPost("/api/atx/click", {"button": button}, function(http) {
if (http.status === 409) { if (http.status === 409) {
wm.error("Performing another ATX operation for other client.<br>Please try again later"); wm.error("Performing another ATX operation for other client.<br>Please try again later.");
} else if (http.status !== 200) { } else if (http.status !== 200) {
wm.error("Click error:<br>", http.responseText); wm.error("Click error", http.responseText);
} }
}); });
__recorder.recordAtxButtonEvent(button); __recorder.recordAtxButtonEvent(button);
}; };
if ($("atx-ask-switch").checked) { if ($("atx-ask-switch").checked) {
wm.confirm(confirm_msg).then(function(ok) { wm.confirm(`
Are you sure you want to press the <b>${button}</b> button?<br>
Warning! This could case data loss on the server.
`).then(function(ok) {
if (ok) { if (ok) {
click_button(); click_button();
} }

6
web/share/js/kvm/gpio.js
View File

@ -185,7 +185,7 @@ export function Gpio(__recorder) {
__recorder.recordGpioSwitchEvent(channel, to); __recorder.recordGpioSwitchEvent(channel, to);
}; };
if (confirm) { if (confirm) {
wm.confirm(confirm).then(function(ok) { wm.confirm(tools.escape(confirm)).then(function(ok) {
if (ok) { if (ok) {
act(); act();
} else { } else {
@ -205,7 +205,7 @@ export function Gpio(__recorder) {
__recorder.recordGpioPulseEvent(channel); __recorder.recordGpioPulseEvent(channel);
}; };
if (confirm) { if (confirm) {
wm.confirm(confirm).then(function(ok) { if (ok) act(); }); wm.confirm(tools.escape(confirm)).then(function(ok) { if (ok) act(); });
} else { } else {
act(); act();
} }
@ -216,7 +216,7 @@ export function Gpio(__recorder) {
if (http.status === 409) { if (http.status === 409) {
wm.error("Performing another operation for this GPIO channel.<br>Please try again later"); wm.error("Performing another operation for this GPIO channel.<br>Please try again later");
} else if (http.status !== 200) { } else if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText); wm.error("GPIO error", http.responseText);
} }
}); });
}; };

20
web/share/js/kvm/hid.js
View File

@ -98,8 +98,7 @@ export function Hid(__getGeometry, __recorder) {
} }
let codes = el_shortcut.getAttribute("data-shortcut").split(" "); let codes = el_shortcut.getAttribute("data-shortcut").split(" ");
if (ask) { if (ask) {
let confirm_msg = `Do you want to press <b>${codes.join(" + ")}</b>?`; wm.confirm("Do you want to press this hotkey?", codes.join(" + ")).then(function(ok) {
wm.confirm(confirm_msg).then(function(ok) {
if (ok) { if (ok) {
__emitShortcut(codes); __emitShortcut(codes);
} }
@ -261,7 +260,7 @@ export function Hid(__getGeometry, __recorder) {
if (http.status === 413) { if (http.status === 413) {
wm.error("Too many text for paste!"); wm.error("Too many text for paste!");
} else if (http.status !== 200) { } else if (http.status !== 200) {
wm.error("HID paste error:<br>", http.responseText); wm.error("HID paste error", http.responseText);
} else if (http.status === 200) { } else if (http.status === 200) {
__recorder.recordPrintEvent(text); __recorder.recordPrintEvent(text);
} }
@ -269,9 +268,10 @@ export function Hid(__getGeometry, __recorder) {
}; };
if ($("hid-pak-ask-switch").checked) { if ($("hid-pak-ask-switch").checked) {
let confirm_msg = `You're going to paste ${text.length} character${text.length ? "s" : ""}.<br>`; wm.confirm(`
confirm_msg += "Are you sure you want to continue?"; You're going to paste ${text.length} character${text.length ? "s" : ""}.<br>
wm.confirm(confirm_msg).then(function(ok) { Are you sure you want to continue?
`).then(function(ok) {
if (ok) { if (ok) {
paste_as_keys(); paste_as_keys();
} else { } else {
@ -288,7 +288,7 @@ export function Hid(__getGeometry, __recorder) {
let output = tools.radio.getValue(`hid-outputs-${hid}-radio`); let output = tools.radio.getValue(`hid-outputs-${hid}-radio`);
tools.httpPost("/api/hid/set_params", {[`${hid}_output`]: output}, function(http) { tools.httpPost("/api/hid/set_params", {[`${hid}_output`]: output}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Can't configure HID:<br>", http.responseText); wm.error("Can't configure HID", http.responseText);
} }
}); });
}; };
@ -297,7 +297,7 @@ export function Hid(__getGeometry, __recorder) {
let enabled = $("hid-jiggler-switch").checked; let enabled = $("hid-jiggler-switch").checked;
tools.httpPost("/api/hid/set_params", {"jiggler": enabled}, function(http) { tools.httpPost("/api/hid/set_params", {"jiggler": enabled}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error(`Can't ${enabled ? "enabled" : "disable"} mouse juggler:<br>`, http.responseText); wm.error(`Can't ${enabled ? "enabled" : "disable"} mouse jiggler`, http.responseText);
} }
}); });
}; };
@ -306,7 +306,7 @@ export function Hid(__getGeometry, __recorder) {
let connected = $("hid-connect-switch").checked; let connected = $("hid-connect-switch").checked;
tools.httpPost("/api/hid/set_connected", {"connected": connected}, function(http) { tools.httpPost("/api/hid/set_connected", {"connected": connected}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error(`Can't ${connected ? "connect" : "disconnect"} HID:<br>`, http.responseText); wm.error(`Can't ${connected ? "connect" : "disconnect"} HID`, http.responseText);
} }
}); });
}; };
@ -316,7 +316,7 @@ export function Hid(__getGeometry, __recorder) {
if (ok) { if (ok) {
tools.httpPost("/api/hid/reset", null, function(http) { tools.httpPost("/api/hid/reset", null, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("HID reset error:<br>", http.responseText); wm.error("HID reset error", http.responseText);
} }
}); });
} }

27
web/share/js/kvm/msd.js
View File

@ -86,11 +86,11 @@ export function Msd() {
var __clickRemoveButton = function() { var __clickRemoveButton = function() {
let name = $("msd-image-selector").value; let name = $("msd-image-selector").value;
wm.confirm(`Are you sure you want to remove the image<br><b>${tools.escape(name)}</b> from PiKVM?`).then(function(ok) { wm.confirm("Are you sure you want to remove this image?", name).then(function(ok) {
if (ok) { if (ok) {
tools.httpPost("/api/msd/remove", {"image": name}, function(http) { tools.httpPost("/api/msd/remove", {"image": name}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Can't remove image:<br>", http.responseText); wm.error("Can't remove image", http.responseText);
} }
}); });
} }
@ -100,7 +100,7 @@ export function Msd() {
var __sendParam = function(name, value) { var __sendParam = function(name, value) {
tools.httpPost("/api/msd/set_params", {[name]: value}, function(http) { tools.httpPost("/api/msd/set_params", {[name]: value}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Can't configure MSD:<br>", http.responseText); wm.error("Can't configure Mass Storage", http.responseText);
} }
}); });
}; };
@ -124,8 +124,9 @@ export function Msd() {
var __httpStateChange = function() { var __httpStateChange = function() {
if (__http.readyState === 4) { if (__http.readyState === 4) {
if (__http.status !== 200) { if (__http.status !== 200) {
wm.error("Can't upload image to the Mass Storage Drive:<br>", __http.responseText); wm.error("Can't upload image", __http.responseText);
} else if ($("msd-new-url").value.length > 0) { } else if ($("msd-new-url").value.length > 0) {
let html = "";
let msg = ""; let msg = "";
try { try {
let end = __http.responseText.lastIndexOf("\r\n"); let end = __http.responseText.lastIndexOf("\r\n");
@ -139,13 +140,15 @@ export function Msd() {
let result_str = __http.responseText.slice(begin, end); let result_str = __http.responseText.slice(begin, end);
let result = JSON.parse(result_str); let result = JSON.parse(result_str);
if (!result.ok) { if (!result.ok) {
msg = `Can't upload image to the Mass Storage Drive:<br>${result_str}`; html = "Can't upload image";
msg = result_str;
} }
} catch (ex) { } catch (ex) {
msg = `Can't parse upload result:<br>${ex}`; html = "Can't parse upload result";
msg = `${ex}`;
} }
if (msg.length > 0) { if (html.length > 0) {
wm.error(msg); wm.error(html, msg);
} }
} }
tools.hidden.setVisible($("msd-new-sub"), false); tools.hidden.setVisible($("msd-new-sub"), false);
@ -166,7 +169,7 @@ export function Msd() {
var __clickConnectButton = function(connected) { var __clickConnectButton = function(connected) {
tools.httpPost("/api/msd/set_connected", {"connected": connected}, function(http) { tools.httpPost("/api/msd/set_connected", {"connected": connected}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Switch error:<br>", http.responseText); wm.error("Can't switch Mass Storage", http.responseText);
} }
__applyState(); __applyState();
}); });
@ -175,11 +178,11 @@ export function Msd() {
}; };
var __clickResetButton = function() { var __clickResetButton = function() {
wm.confirm("Are you sure you want to reset Mass Storage Drive?").then(function(ok) { wm.confirm("Are you sure you want to reset Mass Storage?").then(function(ok) {
if (ok) { if (ok) {
tools.httpPost("/api/msd/reset", null, function(http) { tools.httpPost("/api/msd/reset", null, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("MSD reset error:<br>", http.responseText); wm.error("Mass Storage reset error", http.responseText);
} }
__applyState(); __applyState();
}); });
@ -206,7 +209,7 @@ export function Msd() {
$("msd-new-url").value = ""; $("msd-new-url").value = "";
let part = __state.storage.parts[$("msd-new-part-selector").value]; let part = __state.storage.parts[$("msd-new-part-selector").value];
if (file.size > part.size) { if (file.size > part.size) {
wm.error("New image is too big for the MSD partition.<br>Maximum:", tools.formatSize(part.size)); wm.error(`New image is too big for the Mass Storage partition.<br>Maximum: ${tools.formatSize(part.size)}`);
el_input.value = ""; el_input.value = "";
} }
} }

8
web/share/js/kvm/recorder.js
View File

@ -215,7 +215,7 @@ export function Recorder() {
__events = events; __events = events;
__events_time = events_time; __events_time = events_time;
} catch (ex) { } catch (ex) {
wm.error(`Invalid script: ${ex}`); wm.error("Invalid script", `${ex}`);
} }
el_input.value = ""; el_input.value = "";
@ -285,7 +285,7 @@ export function Recorder() {
wm.error("Too many text for paste!"); wm.error("Too many text for paste!");
__stopProcess(); __stopProcess();
} else if (http.status !== 200) { } else if (http.status !== 200) {
wm.error("HID paste error:<br>", http.responseText); wm.error("HID paste error", http.responseText);
__stopProcess(); __stopProcess();
} else if (http.status === 200) { } else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0); __play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
@ -296,7 +296,7 @@ export function Recorder() {
} else if (event.event_type === "atx_button") { } else if (event.event_type === "atx_button") {
tools.httpPost("/api/atx/click", {"button": event.event.button}, function(http) { tools.httpPost("/api/atx/click", {"button": event.event.button}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("ATX error:<br>", http.responseText); wm.error("ATX error", http.responseText);
__stopProcess(); __stopProcess();
} else if (http.status === 200) { } else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0); __play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
@ -315,7 +315,7 @@ export function Recorder() {
} }
tools.httpPost(path, params, function(http) { tools.httpPost(path, params, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText); wm.error("GPIO error", http.responseText);
__stopProcess(); __stopProcess();
} else if (http.status === 200) { } else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0); __play_timer = setTimeout(() => __runEvents(index + 1, time), 0);

4
web/share/js/kvm/stream.js
View File

@ -297,7 +297,7 @@ export function Streamer() {
__resetStream(); __resetStream();
tools.httpPost("/api/streamer/reset", null, function(http) { tools.httpPost("/api/streamer/reset", null, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Can't reset stream:<br>", http.responseText); wm.error("Can't reset stream", http.responseText);
} }
}); });
} }
@ -307,7 +307,7 @@ export function Streamer() {
var __sendParam = function(name, value) { var __sendParam = function(name, value) {
tools.httpPost("/api/streamer/set_params", {[name]: value}, function(http) { tools.httpPost("/api/streamer/set_params", {[name]: value}, function(http) {
if (http.status !== 200) { if (http.status !== 200) {
wm.error("Can't configure stream:<br>", http.responseText); wm.error("Can't configure stream", http.responseText);
} }
}); });
}; };

2
web/share/js/login/main.js
View File

@ -64,7 +64,7 @@ function __login() {
if (error === "ValidatorError") { if (error === "ValidatorError") {
wm.error("Invalid characters in credentials").then(__tryAgain); wm.error("Invalid characters in credentials").then(__tryAgain);
} else { } else {
wm.error("Login error:<br>", http.responseText).then(__tryAgain); wm.error("Login error", http.responseText).then(__tryAgain);
} }
} }
}, body, "application/x-www-form-urlencoded"); }, body, "application/x-www-form-urlencoded");

36
web/share/js/wm.js
View File

@ -173,13 +173,13 @@ function __WindowManager() {
if (ex) { if (ex) {
tools.error("copyTextToClipboard(): Workaround failed:", ex); tools.error("copyTextToClipboard(): Workaround failed:", ex);
wm.error("Can't copy text to the clipboard:<br>", ex); self.error("Can't copy text to the clipboard", `${ex}`);
} }
}); });
}; };
if (navigator.clipboard) { if (navigator.clipboard) {
navigator.clipboard.writeText(text).then(function() { navigator.clipboard.writeText(text).then(function() {
wm.info("The text has been copied to the clipboard"); self.info("The text has been copied to the clipboard");
}, function(ex) { }, function(ex) {
workaround(ex); workaround(ex);
}); });
@ -188,12 +188,22 @@ function __WindowManager() {
} }
}; };
self.info = (...args) => __modalDialog("Info", args.join(" "), true, false); self.info = (html, ...args) => __modalCodeDialog("Info", html, args.join("\n"), true, false);
self.error = (...args) => __modalDialog("Error", args.join(" "), true, false); self.error = (html, ...args) => __modalCodeDialog("Error", html, args.join("\n"), true, false);
self.confirm = (...args) => __modalDialog("Question", args.join(" "), true, true); self.confirm = (html, ...args) => __modalCodeDialog("Question", html, args.join("\n"), true, true);
self.modal = (header, text, ok, cancel) => __modalDialog(header, text, ok, cancel); self.modal = (header, html, ok, cancel) => __modalDialog(header, html, ok, cancel);
var __modalDialog = function(header, text, ok, cancel, parent=null) { var __modalCodeDialog = function(header, html, code, ok, cancel) {
let create_content = function(el_content) {
if (code) {
html += `<br><br><div class="code"><pre style="margin:0px">${tools.escape(code)}</pre></div>`;
}
el_content.innerHTML = html;
};
return __modalDialog(header, create_content, ok, cancel);
};
var __modalDialog = function(header, html, ok, cancel, parent=null) {
let el_active_menu = (document.activeElement && document.activeElement.closest(".menu")); let el_active_menu = (document.activeElement && document.activeElement.closest(".menu"));
let el_modal = document.createElement("div"); let el_modal = document.createElement("div");
@ -207,7 +217,7 @@ function __WindowManager() {
let el_header = document.createElement("div"); let el_header = document.createElement("div");
el_header.className = "modal-header"; el_header.className = "modal-header";
el_header.innerHTML = header; el_header.innerText = header;
el_window.appendChild(el_header); el_window.appendChild(el_header);
let el_content = document.createElement("div"); let el_content = document.createElement("div");
@ -223,13 +233,13 @@ function __WindowManager() {
if (cancel) { if (cancel) {
el_cancel_button = document.createElement("button"); el_cancel_button = document.createElement("button");
el_cancel_button.className = "row100"; el_cancel_button.className = "row100";
el_cancel_button.innerHTML = "Cancel"; el_cancel_button.innerText = "Cancel";
el_buttons.appendChild(el_cancel_button); el_buttons.appendChild(el_cancel_button);
} }
if (ok) { if (ok) {
el_ok_button = document.createElement("button"); el_ok_button = document.createElement("button");
el_ok_button.className = "row100"; el_ok_button.className = "row100";
el_ok_button.innerHTML = "OK"; el_ok_button.innerText = "OK";
el_buttons.appendChild(el_ok_button); el_buttons.appendChild(el_ok_button);
} }
if (ok && cancel) { if (ok && cancel) {
@ -276,11 +286,11 @@ function __WindowManager() {
__windows.push(el_modal); __windows.push(el_modal);
(parent || document.fullscreenElement || document.body).appendChild(el_modal); (parent || document.fullscreenElement || document.body).appendChild(el_modal);
if (typeof text === "function") { if (typeof html === "function") {
// Это должно быть здесь, потому что элемент должен иметь родителя чтобы существовать // Это должно быть здесь, потому что элемент должен иметь родителя чтобы существовать
text(el_content, el_ok_button); html(el_content, el_ok_button);
} else { } else {
el_content.innerHTML = text; el_content.innerHTML = html;
} }
__activateWindow(el_modal); __activateWindow(el_modal);