From e7d11c7c1173d07db741301053db78b835a73ab3 Mon Sep 17 00:00:00 2001 From: Wojtek Kosior Date: Fri, 14 Jan 2022 22:48:01 +0100 Subject: add settings page with styling --- html/settings.js | 125 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 125 insertions(+) create mode 100644 html/settings.js (limited to 'html/settings.js') diff --git a/html/settings.js b/html/settings.js new file mode 100644 index 0000000..36eeb47 --- /dev/null +++ b/html/settings.js @@ -0,0 +1,125 @@ +/** + * This file is part of Haketilo. + * + * Function: Driving Haketilo's settings page. + * + * Copyright (C) 2022 Wojtek Kosior + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * As additional permission under GNU GPL version 3 section 7, you + * may distribute forms of that code without the copy of the GNU + * GPL normally required by section 4, provided you include this + * license notice and, in case of non-source distribution, a URL + * through which recipients can access the Corresponding Source. + * If you modify file(s) with this exception, you may extend this + * exception to your version of the file(s), but you are not + * obligated to do so. If you do not wish to do so, delete this + * exception statement from your version. + * + * As a special exception to the GPL, any HTML file which merely + * makes function calls to this code, and for that purpose + * includes it by reference shall be deemed a separate work for + * copyright law purposes. If you modify this code, you may extend + * this exception to your version of the code, but you are not + * obligated to do so. If you do not wish to do so, delete this + * exception statement from your version. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + * + * I, Wojtek Kosior, thereby promise not to sue for violation of this file's + * license. Although I request that you do not make use of this code in a + * proprietary program, I am not going to enforce this in court. + */ + +#IMPORT html/dialog.js + +#FROM html/DOM_helpers.js IMPORT by_id +#FROM html/text_entry_list.js IMPORT blocking_allowing_lists, repo_list +#FROM html/item_list.js IMPORT mapping_list, resource_list +#FROM html/payload_create.js IMPORT payload_create_form + +let tab_names = ["blocking", "mappings", "resources", "new_payload", "repos"]; +let current_tab_name = "new_payload"; + +const [tabs, heads] = [{}, {}]; + +for (const tab_name of tab_names) { + tabs[tab_name] = by_id(`${tab_name}_tab`); + heads[tab_name] = by_id(`${tab_name}_head`); +} + +function switch_to_tab(target_tab_name) { + if (current_tab_name == target_tab_name) + return; + + tabs[current_tab_name].classList.remove("active_tab"); + heads[current_tab_name].classList.remove("active_head"); + + current_tab_name = target_tab_name; + tabs[current_tab_name].classList.add("active_tab"); + heads[current_tab_name].classList.add("active_head"); +} + +for (const [tab_name, head] of Object.entries(heads)) + head.addEventListener("click", () => switch_to_tab(tab_name)); + +async function set_up_blocking_tab() { + const containers = ["editable", "dialog"] + .map(n => by_id(`blocking_${n}_container`)); + + function show_container(idx) { + containers[idx].classList.remove("hide"); + containers[1 - idx].classList.add("hide"); + } + + const dialog_ctx = dialog.make(...[1, 0].map(n => () => show_container(n))); + containers[1].append(dialog_ctx.main_div); + + const [blocking_list, allowing_list] = + await blocking_allowing_lists(dialog_ctx); + + by_id("blocking_list_container").append(blocking_list.main_div); + by_id("allowing_list_container").append(allowing_list.main_div); +} + +async function set_up_mappings_tab() { + tabs["mappings"].append((await mapping_list()).main_div); +} + +async function set_up_resources_tab() { + tabs["resources"].append((await resource_list()).main_div); +} + +function set_up_new_payload_tab() { + tabs["new_payload"].append(payload_create_form().main_div); +} + +async function set_up_repos_tab() { + const containers = ["list", "dialog"] + .map(n => by_id(`repos_${n}_container`)); + + function show_container(idx) { + containers[idx].classList.remove("hide"); + containers[1 - idx].classList.add("hide"); + } + + const dialog_ctx = dialog.make(...[1, 0].map(n => () => show_container(n))); + containers[1].append(dialog_ctx.main_div); + containers[0].append((await repo_list(dialog_ctx)).main_div); +} + +set_up_blocking_tab(); +set_up_mappings_tab(); +set_up_resources_tab(); +set_up_new_payload_tab(); +set_up_repos_tab(); -- cgit v1.2.3