summaryrefslogtreecommitdiff
path: root/web/share/js
diff options
context:
space:
mode:
Diffstat (limited to 'web/share/js')
-rw-r--r--web/share/js/kvm/hid.js9
-rw-r--r--web/share/js/kvm/msd.js49
-rw-r--r--web/share/js/kvm/ocr.js9
-rw-r--r--web/share/js/kvm/stream.js18
-rw-r--r--web/share/js/tools.js35
5 files changed, 58 insertions, 62 deletions
diff --git a/web/share/js/kvm/hid.js b/web/share/js/kvm/hid.js
index 30cb8690..89a3134c 100644
--- a/web/share/js/kvm/hid.js
+++ b/web/share/js/kvm/hid.js
@@ -198,12 +198,9 @@ export function Hid(__getGeometry, __recorder) {
};
self.setKeymaps = function(state) {
- let selected = tools.storage.get("hid.pak.keymap", state.keymaps["default"]);
- let html = "";
- for (let variant of state.keymaps.available) {
- html += `<option value=${variant} ${variant === selected ? "selected" : ""}>${variant}</option>`;
- }
- $("hid-pak-keymap-selector").innerHTML = html;
+ 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() {
diff --git a/web/share/js/kvm/msd.js b/web/share/js/kvm/msd.js
index 3eb646cf..fb5c755b 100644
--- a/web/share/js/kvm/msd.js
+++ b/web/share/js/kvm/msd.js
@@ -38,7 +38,9 @@ export function Msd() {
var __init__ = function() {
$("msd-led").title = "Unknown state";
+ tools.selector.addOption($("msd-image-selector"), "\u2500 Not selected \u2500", "");
$("msd-image-selector").onchange = __selectImage;
+
tools.el.setOnClick($("msd-download-button"), __clickDownloadButton);
tools.el.setOnClick($("msd-remove-button"), __clickRemoveButton);
@@ -336,12 +338,17 @@ export function Msd() {
};
var __applyStateImageSelector = function() {
+ let s = __state;
let el = $("msd-image-selector");
- if (!__prepareSelector(el, "Not selected")) {
+ if (!(s && s.online)) {
+ el.options.length = 1; // Cleanup
+ return;
+ }
+ if (s.storage.uploading || s.storage.downloading) {
return;
}
+ el.options.length = 1;
- let s = __state;
let selected = "";
for (let name of Object.keys(s.storage.images).sort()) {
@@ -363,42 +370,26 @@ export function Msd() {
};
var __makeImageSelectorInfo = function(image) {
- let title = `\xA0\xA0\xA0\xA0\xA0\u2570 ${tools.formatSize(image.size)}`;
- title += (image.complete ? "" : ", broken");
+ let info = `\xA0\xA0\xA0\xA0\xA0\u2570 ${tools.formatSize(image.size)}`;
+ info += (image.complete ? "" : ", broken");
if (image.in_storage !== undefined && !image.in_storage) {
- title += ", out of storage";
+ info += ", out of storage";
}
let dt = new Date(image.mod_ts * 1000);
dt = new Date(dt.getTime() - (dt.getTimezoneOffset() * 60000));
- title += " \u2500 " + dt.toISOString().slice(0, -8).replaceAll("-", ".").replace("T", "-");
- return title;
+ info += " \u2500 " + dt.toISOString().slice(0, -8).replaceAll("-", ".").replace("T", "-");
+ return info;
};
var __applyStatePartSelector = function() {
- let el = $("msd-new-part-selector");
- if (!__prepareSelector(el, "Internal")) {
- return;
- }
- for (let name of Object.keys(__state.storage.parts).sort()) {
- if (name != "" && __state.storage.parts[name].writable) {
- tools.selector.addOption(el, name, name);
- }
- }
- tools.hidden.setVisible($("msd-new-part"), (el.options.length > 1));
- };
-
- var __prepareSelector = function(el, first) {
let s = __state;
- let online = (s && s.online);
- if (!online) {
- el.options.length = 1; // Cleanup
- return false;
- }
- if (s.storage.uploading || s.storage.downloading) {
- return false;
+ if (!(s && s.online) || s.storage.uploading || s.storage.downloading) {
+ return;
}
- tools.selector.initDefault(el, first, "");
- return true;
+ let el = $("msd-new-part-selector");
+ let parts = Object.keys(s.storage.parts).sort().filter(name => (name === "" || s.storage.parts[name].writable));
+ tools.selector.setValues(el, parts, "\u2500 Internal \u2500");
+ tools.hidden.setVisible($("msd-new-part"), (parts.length > 1));
};
__init__();
diff --git a/web/share/js/kvm/ocr.js b/web/share/js/kvm/ocr.js
index ee234893..eef26c5a 100644
--- a/web/share/js/kvm/ocr.js
+++ b/web/share/js/kvm/ocr.js
@@ -73,12 +73,9 @@ export function Ocr(__getGeometry) {
self.setState = function(state) {
let enabled = (state && state.ocr.enabled && navigator.clipboard && !tools.browser.is_mobile);
if (enabled) {
- let selected = tools.storage.get("stream.ocr.lang", state.ocr.langs["default"]);
- let html = "";
- for (let variant of state.ocr.langs.available) {
- html += `<option value=${variant} ${variant === selected ? "selected" : ""}>${variant}</option>`;
- }
- $("stream-ocr-lang-selector").innerHTML = html;
+ let el = $("stream-ocr-lang-selector");
+ tools.selector.setValues(el, state.ocr.langs.available);
+ tools.selector.setSelectedValue(el, tools.storage.get("stream.ocr.lang", state.ocr.langs["default"]));
}
tools.feature.setEnabled($("stream-ocr"), enabled);
$("stream-ocr-led").className = (enabled ? "led-gray" : "hidden");
diff --git a/web/share/js/kvm/stream.js b/web/share/js/kvm/stream.js
index 0239a27b..9a73ea56 100644
--- a/web/share/js/kvm/stream.js
+++ b/web/share/js/kvm/stream.js
@@ -176,19 +176,13 @@ export function Streamer() {
}
if (state.features.resolution) {
- if ($("stream-resolution-selector").resolutions !== state.limits.available_resolutions) {
- let resolutions_html = "";
- for (let variant of state.limits.available_resolutions) {
- resolutions_html += `<option value="${variant}">${variant}</option>`;
- }
- if (!state.limits.available_resolutions.includes(resolution_str)) {
- resolutions_html += `<option value="${resolution_str}">${resolution_str}</option>`;
- }
- $("stream-resolution-selector").innerHTML = resolutions_html;
- $("stream-resolution-selector").resolutions = state.limits.available_resolutions;
+ let el = $("stream-resolution-selector");
+ if (!state.limits.available_resolutions.includes(resolution_str)) {
+ state.limits.available_resolutions.push(resolution_str);
}
- document.querySelector(`#stream-resolution-selector [value="${resolution_str}"]`).selected = true;
- tools.el.setEnabled($("stream-resolution-selector"), true);
+ tools.selector.setValues(el, state.limits.available_resolutions);
+ tools.selector.setSelectedValue(el, resolution_str);
+ tools.el.setEnabled(el, true);
}
} else {
diff --git a/web/share/js/tools.js b/web/share/js/tools.js
index 4d082eea..ca31f1f8 100644
--- a/web/share/js/tools.js
+++ b/web/share/js/tools.js
@@ -253,15 +253,8 @@ export var tools = new function() {
self.selector = new function() {
return {
- "initDefault": function(el, title, value) {
- if (el.options.length === 0) {
- self.selector.addOption(el, `\u2500 ${title} \u2500`, value);
- } else {
- el.options.length = 1;
- }
- },
- "addOption": function(el, title, value) {
- el.add(new Option(title, value, false, false));
+ "addOption": function(el, title, value, selected=false) {
+ el.add(new Option(title, value, selected, selected));
},
"addComment": function(el, title) {
let option = new Option(title, ".".repeat(30), false, false); // Kinda magic value
@@ -274,6 +267,30 @@ export var tools = new function() {
self.selector.addComment(el, "\u2500".repeat(30));
}
},
+
+ "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;
+ }
+ },
};
};
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-23 18:12:05 +0000