summaryrefslogtreecommitdiff
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/css/kvm/about.css8
-rw-r--r--web/css/kvm/hid.css2
-rw-r--r--web/css/main.css23
-rw-r--r--web/js/kvm/hid.js15
-rw-r--r--web/js/kvm/keyboard.js5
-rw-r--r--web/js/kvm/msd.js2
-rw-r--r--web/js/kvm/session.js11
-rw-r--r--web/js/kvm/stream.js6
-rw-r--r--web/kvm/index.html4
9 files changed, 48 insertions, 28 deletions
diff --git a/web/css/kvm/about.css b/web/css/kvm/about.css
index ccb3ad53..a841c3a6 100644
--- a/web/css/kvm/about.css
+++ b/web/css/kvm/about.css
@@ -30,8 +30,8 @@ div#about textarea {
width: 100%;
height: 200px;
padding: 0;
- color: var(--fg-color-normal);
- background-color: var(--bg-color-menu);
+ color: var(--fg-color-light);
+ background-color: var(--bg-color-dark);
border: none;
border-radius: 4px;
outline: 0 !important;
@@ -42,11 +42,11 @@ div#about textarea {
}
div#about textarea::-moz-placeholder {
- line-height: 150px;
+ line-height: 190px;
text-align: center;
}
div#about textarea::-webkit-input-placeholder {
- line-height: 150px;
+ line-height: 190px;
text-align: center;
}
diff --git a/web/css/kvm/hid.css b/web/css/kvm/hid.css
index 8c420fe9..28f4291e 100644
--- a/web/css/kvm/hid.css
+++ b/web/css/kvm/hid.css
@@ -3,7 +3,7 @@ textarea#hid-pak-text {
resize: none;
width: 100%;
height: 40px;
- color: var(--fg-color-dark);
+ color: var(--fg-color-intensive);
background-color: var(--bg-color-light);
border: none;
outline: 0 !important;
diff --git a/web/css/main.css b/web/css/main.css
index 953e4f3c..8f37f6bd 100644
--- a/web/css/main.css
+++ b/web/css/main.css
@@ -22,17 +22,34 @@ hr {
}
p.text {
- display: table-cell;
text-align: justify;
}
+p:not(:first-child).text {
+ margin-top: 0;
+}
+p:last-child.text {
+ margin-bottom: 0;
+}
-pre.code {
+div.code {
+ white-space: nowrap;
overflow-x: auto;
+ font-family: monospace;
+ border-radius: 4px;
color: var(--fg-color-dark);
background-color: var(--bg-color-dark);
padding: 10px;
}
-pre.code span.code-comment {
+div.code::-webkit-scrollbar {
+ width: 8px;
+ height: 8px;
+}
+div.code::-webkit-scrollbar-thumb {
+ border-radius: 4px;
+ background: var(--fg-color-inactive);
+}
+
+div.code span.code-comment {
color: var(--fg-color-inactive);
}
diff --git a/web/js/kvm/hid.js b/web/js/kvm/hid.js
index 5b13480f..69b34144 100644
--- a/web/js/kvm/hid.js
+++ b/web/js/kvm/hid.js
@@ -141,13 +141,14 @@ function Hid() {
clipboard_codes.push(codes);
}
});
-
- var confirm_msg = (
- "You are going to automatically type " + codes_count
- + " characters from the system clipboard."
- + " It will take " + (__codes_delay * codes_count * 2 / 1000) + " seconds.<br>"
- + "<br>Are you sure you want to continue?<br>"
- );
+ var time = __codes_delay * codes_count * 2 / 1000;
+
+ var confirm_msg = `
+ You are going to automatically type ${codes_count} characters from the system clipboard.
+ It will take ${time} seconds.<br>
+ <br>
+ Are you sure you want to continue?
+ `;
ui.confirm(confirm_msg).then(function(ok) {
if (ok) {
diff --git a/web/js/kvm/keyboard.js b/web/js/kvm/keyboard.js
index ee9a7ba1..8a08a8aa 100644
--- a/web/js/kvm/keyboard.js
+++ b/web/js/kvm/keyboard.js
@@ -83,7 +83,7 @@ function Keyboard() {
if (event.preventDefault) {
event.preventDefault();
}
- var el_key = document.querySelector("[data-key='" + event.code + "']");
+ var el_key = document.querySelector(`[data-key='${event.code}']`);
if (el_key && !event.repeat) {
__commonHandler(el_key, state, "pressed");
if (__mac_cmd_hook) {
@@ -168,7 +168,8 @@ function Keyboard() {
};
var __resolveKeys = function(el_key) {
- return document.querySelectorAll("[data-key='" + el_key.getAttribute("data-key") + "']");
+ var code = el_key.getAttribute("data-key");
+ return document.querySelectorAll(`[data-key='${code}']`);
};
var __sendKey = function(el_key, state) {
diff --git a/web/js/kvm/msd.js b/web/js/kvm/msd.js
index bbc86370..c59563b7 100644
--- a/web/js/kvm/msd.js
+++ b/web/js/kvm/msd.js
@@ -73,7 +73,7 @@ function Msd() {
__applyState();
});
__applyState();
- $("msd-switch-to-" + to + "-button").disabled = true;
+ $(`msd-switch-to-${to}-button`).disabled = true;
};
var __selectNewImageFile = function() {
diff --git a/web/js/kvm/session.js b/web/js/kvm/session.js
index 19166a9a..ebddff7b 100644
--- a/web/js/kvm/session.js
+++ b/web/js/kvm/session.js
@@ -15,13 +15,13 @@ function Session() {
var __init__ = function() {
$("link-led").title = "Not connected yet...";
- __loadKvmdVersion();
+ __loadKvmdInfo();
__startPoller();
};
/********************************************************************************/
- var __loadKvmdVersion = function() {
+ var __loadKvmdInfo = function() {
var http = tools.makeRequest("GET", "/kvmd/info", function() {
if (http.readyState === 4) {
if (http.status === 200) {
@@ -40,9 +40,9 @@ function Session() {
}
}
$("about-version-kvmd").innerHTML = info.version.kvmd;
- $("about-version-streamer").innerHTML = info.version.streamer + " (" + info.streamer + ")";
+ $("about-version-streamer").innerHTML = `${info.version.streamer} (${info.streamer})`;
} else {
- setTimeout(__loadKvmdVersion, 1000);
+ setTimeout(__loadKvmdInfo, 1000);
}
}
});
@@ -54,7 +54,8 @@ function Session() {
var http = tools.makeRequest("GET", "/ws_auth", function() {
if (http.readyState === 4) {
if (http.status === 200) {
- __ws = new WebSocket((location.protocol === "https:" ? "wss" : "ws") + "://" + location.host + "/kvmd/ws");
+ var proto = (location.protocol === "https:" ? "wss" : "ws");
+ __ws = new WebSocket(`${proto}://${location.host}/kvmd/ws`);
__ws.onopen = __wsOpenHandler;
__ws.onmessage = __wsMessageHandler;
__ws.onerror = __wsErrorHandler;
diff --git a/web/js/kvm/stream.js b/web/js/kvm/stream.js
index 32a8cad8..d543701f 100644
--- a/web/js/kvm/stream.js
+++ b/web/js/kvm/stream.js
@@ -156,8 +156,8 @@ function Streamer() {
var el_grab = document.querySelector("#stream-window-header .window-grab");
var el_info = $("stream-info");
if (online) {
- var fps_suffix = (__client_fps >= 0 ? " / " + __client_fps + " fps" : "");
- el_grab.innerHTML = el_info.innerHTML = "Stream &ndash; " + __resolution.width + "x" + __resolution.height + fps_suffix;
+ var fps_suffix = (__client_fps >= 0 ? ` / ${__client_fps} fps` : "");
+ el_grab.innerHTML = el_info.innerHTML = `Stream &ndash; ${__resolution.width}x${__resolution.height}${fps_suffix}`;
} else {
el_grab.innerHTML = el_info.innerHTML = "Stream &ndash; offline";
}
@@ -183,7 +183,7 @@ function Streamer() {
};
var __sendParam = function(name, value) {
- var http = tools.makeRequest("POST", "/kvmd/streamer/set_params?" + name + "=" + value, function() {
+ var http = tools.makeRequest("POST", `/kvmd/streamer/set_params?${name}=${value}`, function() {
if (http.readyState === 4) {
if (http.status !== 200) {
ui.error("Can't configure stream:<br>", http.responseText);
diff --git a/web/kvm/index.html b/web/kvm/index.html
index 20c0340d..e67654a6 100644
--- a/web/kvm/index.html
+++ b/web/kvm/index.html
@@ -576,8 +576,8 @@
<textarea readonly placeholder="No data" id="about-meta"></textarea>
<hr>
<p class="text">
- Please visit our site <a target="_blank" href="https://github.com/pi-kvm">https://github.com/pi-kvm</a> to get documentation,
- source codes, hardware schematics and legal information.
+ Full documentation, source code, hardware schematics and legal information
+ can be found in our <a target="_blank" href="https://github.com/pi-kvm">official website</a>.
</p>
</div>
</div>