refactoring

This commit is contained in:
Maxim Devaev 2024-03-25 01:01:21 +02:00
parent 1d48ba0a5a
commit 71e5e4d138
13 changed files with 211 additions and 246 deletions

View File

@ -51,60 +51,58 @@ function __setAppText() {
}
function __loadKvmdInfo() {
let http = tools.makeRequest("GET", "/api/info?fields=auth,meta,extras", function() {
if (http.readyState === 4) {
if (http.status === 200) {
let info = JSON.parse(http.responseText).result;
tools.httpGet("/api/info?fields=auth,meta,extras", function(http) {
if (http.status === 200) {
let info = JSON.parse(http.responseText).result;
let apps = [];
if (info.extras === null) {
wm.error("Not all applications in the menu can be displayed<br>due an error. See KVMD logs for details.");
} else {
apps = Object.values(info.extras).sort(function(a, b) {
if (a.place < b.place) {
return -1;
} else if (a.place > b.place) {
return 1;
} else {
return 0;
}
});
}
$("apps-box").innerHTML = "<ul id=\"apps\"></ul>";
// Don't use this option, it may be removed in any time
let hide_kvm_button = (
(info.meta !== null && info.meta.web && info.meta.web.hide_kvm_button)
|| tools.config.getBool("index--hide-kvm-button", false)
);
if (!hide_kvm_button) {
$("apps").innerHTML += __makeApp(null, "kvm", "share/svg/kvm.svg", "KVM");
}
for (let app of apps) {
if (app.place >= 0 && (app.enabled || app.started)) {
$("apps").innerHTML += __makeApp(null, app.path, app.icon, app.name);
}
}
if (info.auth.enabled) {
$("apps").innerHTML += __makeApp("logout-button", "#", "share/svg/logout.svg", "Logout");
tools.el.setOnClick($("logout-button"), __logout);
}
if (info.meta !== null && info.meta.server && info.meta.server.host) {
$("kvmd-meta-server-host").innerHTML = info.meta.server.host;
document.title = `PiKVM Index: ${info.meta.server.host}`;
} else {
$("kvmd-meta-server-host").innerHTML = "";
document.title = "PiKVM Index";
}
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
let apps = [];
if (info.extras === null) {
wm.error("Not all applications in the menu can be displayed<br>due an error. See KVMD logs for details.");
} else {
setTimeout(__loadKvmdInfo, 1000);
apps = Object.values(info.extras).sort(function(a, b) {
if (a.place < b.place) {
return -1;
} else if (a.place > b.place) {
return 1;
} else {
return 0;
}
});
}
$("apps-box").innerHTML = "<ul id=\"apps\"></ul>";
// Don't use this option, it may be removed in any time
let hide_kvm_button = (
(info.meta !== null && info.meta.web && info.meta.web.hide_kvm_button)
|| tools.config.getBool("index--hide-kvm-button", false)
);
if (!hide_kvm_button) {
$("apps").innerHTML += __makeApp(null, "kvm", "share/svg/kvm.svg", "KVM");
}
for (let app of apps) {
if (app.place >= 0 && (app.enabled || app.started)) {
$("apps").innerHTML += __makeApp(null, app.path, app.icon, app.name);
}
}
if (info.auth.enabled) {
$("apps").innerHTML += __makeApp("logout-button", "#", "share/svg/logout.svg", "Logout");
tools.el.setOnClick($("logout-button"), __logout);
}
if (info.meta !== null && info.meta.server && info.meta.server.host) {
$("kvmd-meta-server-host").innerHTML = info.meta.server.host;
document.title = `PiKVM Index: ${info.meta.server.host}`;
} else {
$("kvmd-meta-server-host").innerHTML = "";
document.title = "PiKVM Index";
}
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
setTimeout(__loadKvmdInfo, 1000);
}
});
}
@ -123,13 +121,11 @@ function __makeApp(id, path, icon, name) {
}
function __logout() {
let http = tools.makeRequest("POST", "/api/auth/logout", function() {
if (http.readyState === 4) {
if (http.status === 200 || http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
wm.error("Logout error:<br>", http.responseText);
}
tools.httpPost("/api/auth/logout", function(http) {
if (http.status === 200 || http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
wm.error("Logout error:<br>", http.responseText);
}
});
}

View File

@ -31,32 +31,30 @@ export function main() {
}
function __loadKvmdInfo() {
let http = tools.makeRequest("GET", "/api/info", function() {
if (http.readyState === 4) {
if (http.status === 200) {
let ipmi_port = JSON.parse(http.responseText).result.extras.ipmi.port;
let make_item = (comment, ipmi, api) => `
<span class="code-comment"># ${comment}:<br>$</span>
ipmitool -I lanplus -U admin -P admin -H ${window.location.hostname} -p ${ipmi_port} ${ipmi}<br>
<span class="code-comment">$</span> curl -XPOST -HX-KVMD-User:admin -HX-KVMD-Passwd:admin -k \\<br>
&nbsp;&nbsp;&nbsp;&nbsp;${window.location.protocol}//${window.location.host}/api/atx${api}<br>
`;
$("ipmi-text").innerHTML = `
${make_item("Power on the server if it's off", "power on", "/power?action=on")}
<br>
${make_item("Soft power off the server if it's on", "power soft", "/power?action=off")}
<br>
${make_item("Hard power off the server if it's on", "power off", "/power?action=off_hard")}
<br>
${make_item("Hard reset the server if it's on", "power reset", "/power?action=reset_hard")}
<br>
${make_item("Check the power status", "power status", "")}
`;
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
setTimeout(__loadKvmdInfo, 1000);
}
tools.httpGet("/api/info", function(http) {
if (http.status === 200) {
let ipmi_port = JSON.parse(http.responseText).result.extras.ipmi.port;
let make_item = (comment, ipmi, api) => `
<span class="code-comment"># ${comment}:<br>$</span>
ipmitool -I lanplus -U admin -P admin -H ${window.location.hostname} -p ${ipmi_port} ${ipmi}<br>
<span class="code-comment">$</span> curl -XPOST -HX-KVMD-User:admin -HX-KVMD-Passwd:admin -k \\<br>
&nbsp;&nbsp;&nbsp;&nbsp;${window.location.protocol}//${window.location.host}/api/atx${api}<br>
`;
$("ipmi-text").innerHTML = `
${make_item("Power on the server if it's off", "power on", "/power?action=on")}
<br>
${make_item("Soft power off the server if it's on", "power soft", "/power?action=off")}
<br>
${make_item("Hard power off the server if it's on", "power off", "/power?action=off_hard")}
<br>
${make_item("Hard reset the server if it's on", "power reset", "/power?action=reset_hard")}
<br>
${make_item("Check the power status", "power status", "")}
`;
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
setTimeout(__loadKvmdInfo, 1000);
}
});
}

View File

@ -73,13 +73,11 @@ export function Atx(__recorder) {
var __clickButton = function(button, confirm_msg) {
let click_button = function() {
let http = tools.makeRequest("POST", `/api/atx/click?button=${button}`, function() {
if (http.readyState === 4) {
if (http.status === 409) {
wm.error("Performing another ATX operation for other client.<br>Please try again later");
} else if (http.status !== 200) {
wm.error("Click error:<br>", http.responseText);
}
tools.httpPost(`/api/atx/click?button=${button}`, function(http) {
if (http.status === 409) {
wm.error("Performing another ATX operation for other client.<br>Please try again later");
} else if (http.status !== 200) {
wm.error("Click error:<br>", http.responseText);
}
});
__recorder.recordAtxButtonEvent(button);

View File

@ -209,13 +209,11 @@ export function Gpio(__recorder) {
};
var __sendPost = function(url) {
let http = tools.makeRequest("POST", url, function() {
if (http.readyState === 4) {
if (http.status === 409) {
wm.error("Performing another operation for this GPIO channel.<br>Please try again later");
} else if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText);
}
tools.httpPost(url, function(http) {
if (http.status === 409) {
wm.error("Performing another operation for this GPIO channel.<br>Please try again later");
} else if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText);
}
});
};

View File

@ -253,19 +253,17 @@ export function Hid(__getGeometry, __recorder) {
tools.debug(`HID: paste-as-keys ${keymap}: ${text}`);
let http = tools.makeRequest("POST", `/api/hid/print?limit=0&keymap=${keymap}`, function() {
if (http.readyState === 4) {
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:<br>", http.responseText);
} else if (http.status === 200) {
__recorder.recordPrintEvent(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:<br>", http.responseText);
} else if (http.status === 200) {
__recorder.recordPrintEvent(text);
}
}, text, "text/plain");
};
@ -288,33 +286,27 @@ export function Hid(__getGeometry, __recorder) {
var __clickOutputsRadio = function(hid) {
let output = tools.radio.getValue(`hid-outputs-${hid}-radio`);
let http = tools.makeRequest("POST", `/api/hid/set_params?${hid}_output=${output}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Can't configure HID:<br>", http.responseText);
}
tools.httpPost(`/api/hid/set_params?${hid}_output=${output}`, function(http) {
if (http.status !== 200) {
wm.error("Can't configure HID:<br>", http.responseText);
}
});
};
var __clickJigglerSwitch = function() {
let enabled = $("hid-jiggler-switch").checked;
let http = tools.makeRequest("POST", `/api/hid/set_params?jiggler=${enabled}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error(`Can't ${enabled ? "enabled" : "disable"} mouse juggler:<br>`, http.responseText);
}
tools.httpPost(`/api/hid/set_params?jiggler=${enabled}`, function(http) {
if (http.status !== 200) {
wm.error(`Can't ${enabled ? "enabled" : "disable"} mouse juggler:<br>`, http.responseText);
}
});
};
var __clickConnectSwitch = function() {
let connected = $("hid-connect-switch").checked;
let http = tools.makeRequest("POST", `/api/hid/set_connected?connected=${connected}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error(`Can't ${connected ? "connect" : "disconnect"} HID:<br>`, http.responseText);
}
tools.httpPost(`/api/hid/set_connected?connected=${connected}`, function(http) {
if (http.status !== 200) {
wm.error(`Can't ${connected ? "connect" : "disconnect"} HID:<br>`, http.responseText);
}
});
};
@ -322,11 +314,9 @@ export function Hid(__getGeometry, __recorder) {
var __clickResetButton = function() {
wm.confirm("Are you sure you want to reset HID (keyboard & mouse)?").then(function(ok) {
if (ok) {
let http = tools.makeRequest("POST", "/api/hid/reset", function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("HID reset error:<br>", http.responseText);
}
tools.httpPost("/api/hid/reset", function(http) {
if (http.status !== 200) {
wm.error("HID reset error:<br>", http.responseText);
}
});
}

View File

@ -88,11 +88,9 @@ export function Msd() {
let name = $("msd-image-selector").value;
wm.confirm(`Are you sure you want to remove the image<br><b>${name}</b> from PiKVM?`).then(function(ok) {
if (ok) {
let http = tools.makeRequest("POST", `/api/msd/remove?image=${name}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Can't remove image:<br>", http.responseText);
}
tools.httpPost(`/api/msd/remove?image=${name}`, function(http) {
if (http.status !== 200) {
wm.error("Can't remove image:<br>", http.responseText);
}
});
}
@ -100,11 +98,9 @@ export function Msd() {
};
var __sendParam = function(name, value) {
let http = tools.makeRequest("POST", `/api/msd/set_params?${name}=${encodeURIComponent(value)}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Can't configure MSD:<br>", http.responseText);
}
tools.httpPost(`/api/msd/set_params?${name}=${encodeURIComponent(value)}`, function(http) {
if (http.status !== 200) {
wm.error("Can't configure MSD:<br>", http.responseText);
}
});
};
@ -168,11 +164,9 @@ export function Msd() {
};
var __clickConnectButton = function(connected) {
let http = tools.makeRequest("POST", `/api/msd/set_connected?connected=${connected}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Switch error:<br>", http.responseText);
}
tools.httpPost(`/api/msd/set_connected?connected=${connected}`, function(http) {
if (http.status !== 200) {
wm.error("Switch error:<br>", http.responseText);
}
__applyState();
});
@ -183,11 +177,9 @@ export function Msd() {
var __clickResetButton = function() {
wm.confirm("Are you sure you want to reset Mass Storage Drive?").then(function(ok) {
if (ok) {
let http = tools.makeRequest("POST", "/api/msd/reset", function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("MSD reset error:<br>", http.responseText);
}
tools.httpPost("/api/msd/reset", function(http) {
if (http.status !== 200) {
wm.error("MSD reset error:<br>", http.responseText);
}
__applyState();
});

View File

@ -167,17 +167,15 @@ export function Ocr(__getGeometry) {
url += `&ocr_left=${__selection.left}&ocr_top=${__selection.top}`;
url += `&ocr_right=${__selection.right}&ocr_bottom=${__selection.bottom}`;
let http = tools.makeRequest("GET", url, function() {
if (http.readyState === 4) {
if (http.status === 200) {
wm.copyTextToClipboard(http.responseText);
} else {
wm.error("OCR error:<br>", http.responseText);
}
tools.el.setEnabled($("stream-ocr-button"), true);
tools.el.setEnabled($("stream-ocr-lang-selector"), true);
$("stream-ocr-led").className = "led-gray";
tools.httpGet(url, function(http) {
if (http.status === 200) {
wm.copyTextToClipboard(http.responseText);
} else {
wm.error("OCR error:<br>", http.responseText);
}
tools.el.setEnabled($("stream-ocr-button"), true);
tools.el.setEnabled($("stream-ocr-lang-selector"), true);
$("stream-ocr-led").className = "led-gray";
}, null, null, 30000);
};

View File

@ -280,30 +280,26 @@ export function Recorder() {
return;
} else if (event.event_type === "print") {
let http = tools.makeRequest("POST", "/api/hid/print?limit=0", function() {
if (http.readyState === 4) {
if (http.status === 413) {
wm.error("Too many text for paste!");
__stopProcess();
} else if (http.status !== 200) {
wm.error("HID paste error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
tools.httpPost("/api/hid/print?limit=0", function(http) {
if (http.status === 413) {
wm.error("Too many text for paste!");
__stopProcess();
} else if (http.status !== 200) {
wm.error("HID paste error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
}, event.event.text, "text/plain");
return;
} else if (event.event_type === "atx_button") {
let http = tools.makeRequest("POST", `/api/atx/click?button=${event.event.button}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("ATX error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
tools.httpPost(`/api/atx/click?button=${event.event.button}`, function(http) {
if (http.status !== 200) {
wm.error("ATX error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
});
return;
@ -315,14 +311,12 @@ export function Recorder() {
} else { // gpio_pulse
path += `/pulse?channel=${event.event.channel}`;
}
let http = tools.makeRequest("POST", path, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
tools.httpPost(path, function(http) {
if (http.status !== 200) {
wm.error("GPIO error:<br>", http.responseText);
__stopProcess();
} else if (http.status === 200) {
__play_timer = setTimeout(() => __runEvents(index + 1, time), 0);
}
});
return;

View File

@ -275,23 +275,21 @@ export function Session() {
$("link-led").className = "led-yellow";
$("link-led").title = "Connecting...";
let http = tools.makeRequest("GET", "/api/auth/check", function() {
if (http.readyState === 4) {
if (http.status === 200) {
__ws = new WebSocket(`${tools.is_https ? "wss" : "ws"}://${location.host}/api/ws`);
__ws.sendHidEvent = (event) => __sendHidEvent(__ws, event.event_type, event.event);
__ws.onopen = __wsOpenHandler;
__ws.onmessage = __wsMessageHandler;
__ws.onerror = __wsErrorHandler;
__ws.onclose = __wsCloseHandler;
} else if (http.status === 401 || http.status === 403) {
window.onbeforeunload = () => null;
wm.error("Unexpected logout occured, please login again").then(function() {
document.location.href = "/login";
});
} else {
__wsCloseHandler(null);
}
tools.httpGet("/api/auth/check", function(http) {
if (http.status === 200) {
__ws = new WebSocket(`${tools.is_https ? "wss" : "ws"}://${location.host}/api/ws`);
__ws.sendHidEvent = (event) => __sendHidEvent(__ws, event.event_type, event.event);
__ws.onopen = __wsOpenHandler;
__ws.onmessage = __wsMessageHandler;
__ws.onerror = __wsErrorHandler;
__ws.onclose = __wsCloseHandler;
} else if (http.status === 401 || http.status === 403) {
window.onbeforeunload = () => null;
wm.error("Unexpected logout occured, please login again").then(function() {
document.location.href = "/login";
});
} else {
__wsCloseHandler(null);
}
});
};

View File

@ -295,11 +295,9 @@ export function Streamer() {
wm.confirm("Are you sure you want to reset stream?").then(function (ok) {
if (ok) {
__resetStream();
let http = tools.makeRequest("POST", "/api/streamer/reset", function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Can't reset stream:<br>", http.responseText);
}
tools.httpPost("/api/streamer/reset", function(http) {
if (http.status !== 200) {
wm.error("Can't reset stream:<br>", http.responseText);
}
});
}
@ -307,11 +305,9 @@ export function Streamer() {
};
var __sendParam = function(name, value) {
let http = tools.makeRequest("POST", `/api/streamer/set_params?${name}=${value}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
wm.error("Can't configure stream:<br>", http.responseText);
}
tools.httpPost(`/api/streamer/set_params?${name}=${value}`, function(http) {
if (http.status !== 200) {
wm.error("Can't configure stream:<br>", http.responseText);
}
});
};

View File

@ -51,22 +51,20 @@ function __login() {
} else {
let passwd = $("passwd-input").value + $("code-input").value;
let body = `user=${encodeURIComponent(user)}&passwd=${encodeURIComponent(passwd)}`;
let http = tools.makeRequest("POST", "/api/auth/login", function() {
if (http.readyState === 4) {
if (http.status === 200) {
document.location.href = "/";
} else if (http.status === 403) {
wm.error("Invalid credentials").then(__tryAgain);
tools.httpPost("/api/auth/login", function(http) {
if (http.status === 200) {
document.location.href = "/";
} else if (http.status === 403) {
wm.error("Invalid credentials").then(__tryAgain);
} else {
let error = "";
if (http.status === 400) {
try { error = JSON.parse(http.responseText)["result"]["error"]; } catch (_) { /* Nah */ }
}
if (error === "ValidatorError") {
wm.error("Invalid characters in credentials").then(__tryAgain);
} else {
let error = "";
if (http.status === 400) {
try { error = JSON.parse(http.responseText)["result"]["error"]; } catch (_) { /* Nah */ }
}
if (error === "ValidatorError") {
wm.error("Invalid characters in credentials").then(__tryAgain);
} else {
wm.error("Login error:<br>", http.responseText).then(__tryAgain);
}
wm.error("Login error:<br>", http.responseText).then(__tryAgain);
}
}
}, body, "application/x-www-form-urlencoded");

View File

@ -39,16 +39,27 @@ export var tools = new function() {
/************************************************************************/
self.makeRequest = function(method, url, callback, body=null, content_type=null, timeout=15000) {
self.httpRequest = function(method, url, callback, body=null, content_type=null, timeout=15000) {
let http = new XMLHttpRequest();
http.open(method, url, true);
if (content_type) {
http.setRequestHeader("Content-Type", content_type);
}
http.onreadystatechange = callback;
http.onreadystatechange = function() {
if (http.readyState === 4) {
callback(http);
}
};
http.timeout = timeout;
http.send(body);
return http;
};
self.httpGet = function(url, callback, body=null, content_type=null, timeout=15000) {
self.httpRequest("GET", url, callback, body, content_type, timeout);
};
self.httpPost = function(url, callback, body=null, content_type=null, timeout=15000) {
self.httpRequest("POST", url, callback, body, content_type, timeout);
};
/************************************************************************/

View File

@ -31,19 +31,17 @@ export function main() {
}
function __loadKvmdInfo() {
let http = tools.makeRequest("GET", "/api/info", function() {
if (http.readyState === 4) {
if (http.status === 200) {
let vnc_port = JSON.parse(http.responseText).result.extras.vnc.port;
$("vnc-text").innerHTML = `
<span class="code-comment"># How to connect using the Linux terminal:<br>
$</span> vncviewer ${window.location.hostname}::${vnc_port}
`;
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
setTimeout(__loadKvmdInfo, 1000);
}
tools.httpGet("/api/info", function(http) {
if (http.status === 200) {
let vnc_port = JSON.parse(http.responseText).result.extras.vnc.port;
$("vnc-text").innerHTML = `
<span class="code-comment"># How to connect using the Linux terminal:<br>
$</span> vncviewer ${window.location.hostname}::${vnc_port}
`;
} else if (http.status === 401 || http.status === 403) {
document.location.href = "/login";
} else {
setTimeout(__loadKvmdInfo, 1000);
}
});
}