aboutsummaryrefslogtreecommitdiff
path: root/html/import_frame.js
diff options
context:
space:
mode:
Diffstat (limited to 'html/import_frame.js')
-rw-r--r--html/import_frame.js73
1 files changed, 35 insertions, 38 deletions
diff --git a/html/import_frame.js b/html/import_frame.js
index 4075433..c0eb2f0 100644
--- a/html/import_frame.js
+++ b/html/import_frame.js
@@ -9,6 +9,7 @@
* IMPORTS_START
* IMPORT get_remote_storage
* IMPORT by_id
+ * IMPORT clone_template
* IMPORT nice_name
* IMPORT make_once
* IMPORTS_END
@@ -16,48 +17,38 @@
let storage;
-const import_li_template = by_id("import_li_template");
-import_li_template.removeAttribute("id");
-
-function import_li_id(prefix, item)
-{
- return `ili_${prefix}_${item}`;
-}
-
-let import_ul = by_id("import_ul");
+let import_list = by_id("import_list");
let import_chbxs_colliding = undefined;
+let entry_objects = undefined;
let settings_import_map = undefined;
-function add_import_li(prefix, name)
+function add_import_entry(prefix, name)
{
- let li = import_li_template.cloneNode(true);
- let name_span = li.firstElementChild;
- let chbx = name_span.nextElementSibling;
- let warning_span = chbx.nextElementSibling;
+ const cloned_template = clone_template("import_entry");
+ Object.assign(cloned_template, {prefix, name});
- li.setAttribute("data-prefix", prefix);
- li.setAttribute("data-name", name);
- li.id = import_li_id(prefix, name);
- name_span.textContent = nice_name(prefix, name);
+ cloned_template.name_span.textContent = nice_name(prefix, name);
if (storage.get(prefix, name) !== undefined) {
- import_chbxs_colliding.push(chbx);
- warning_span.textContent = "(will overwrite existing setting!)";
+ import_chbxs_colliding.push(cloned_template.chbx);
+ cloned_template.warning.textContent = "!";
}
- import_ul.appendChild(li);
+ import_list.appendChild(cloned_template.entry);
+
+ return cloned_template;
}
function check_all_imports()
{
- for (let li of import_ul.children)
- li.firstElementChild.nextElementSibling.checked = true;
+ for (const entry_object of entry_objects)
+ entry_object.chbx.checked = true;
}
function uncheck_all_imports()
{
- for (let li of import_ul.children)
- li.firstElementChild.nextElementSibling.checked = false;
+ for (const entry_object of entry_objects)
+ entry_object.chbx.checked = false;
}
function uncheck_colliding_imports()
@@ -68,17 +59,13 @@ function uncheck_colliding_imports()
function commit_import()
{
- for (let li of import_ul.children) {
- let chbx = li.firstElementChild.nextElementSibling;
-
- if (!chbx.checked)
+ for (const entry_object of entry_objects) {
+ if (!entry_object.chbx.checked)
continue;
- let prefix = li.getAttribute("data-prefix");
- let name = li.getAttribute("data-name");
- let key = prefix + name;
- let value = settings_import_map.get(key);
- storage.set(prefix, name, value);
+ const key = entry_object.prefix + entry_object.name;
+ const value = settings_import_map.get(key);
+ storage.set(entry_object.prefix, entry_object.name, value);
}
deactivate();
@@ -105,38 +92,48 @@ function show_error(errormsg, errordetail)
}
const import_selection_radio = by_id("import_selection_radio");
+const existing_settings_note = by_id("existing_settings_note");
function show_selection(settings)
{
import_selection_radio.checked = true;
- let old_children = import_ul.children;
+ let old_children = import_list.children;
while (old_children[0] !== undefined)
- import_ul.removeChild(old_children[0]);
+ import_list.removeChild(old_children[0]);
import_chbxs_colliding = [];
+ entry_objects = [];
settings_import_map = new Map();
for (let setting of settings) {
let [key, value] = Object.entries(setting)[0];
let prefix = key[0];
let name = key.substring(1);
- add_import_li(prefix, name);
+ entry_objects.push(add_import_entry(prefix, name));
settings_import_map.set(key, value);
}
+
+ const op = import_chbxs_colliding.length > 0 ? "remove" : "add";
+ existing_settings_note.classList[op]("hide");
}
function deactivate()
{
/* Let GC free some memory */
import_chbxs_colliding = undefined;
+ entry_objects = undefined;
settings_import_map = undefined;
if (exports.onclose)
exports.onclose();
}
-const exports = {show_loading, show_error, show_selection, deactivate};
+const wrapper = by_id("import_table_wrapper");
+const style_table = (...cls) => cls.forEach(c => wrapper.classList.add(c));
+
+const exports =
+ {show_loading, show_error, show_selection, deactivate, style_table};
async function init()
{