From dd8de100acda322f2124c58163ecde6f1b37d61d Mon Sep 17 00:00:00 2001 From: Wojtek Kosior Date: Tue, 11 Jan 2022 15:43:40 +0100 Subject: add missing payload_create test and styling --- html/base.css | 2 +- html/dialog.js | 64 +++++++++++++++++++++++++----------------------- html/grid.css | 8 ------ html/item_preview.html | 34 ++++++++++++------------- html/payload_create.html | 59 +++++++++++++++++++++++++++++++------------- html/payload_create.js | 31 +++++++++++++++-------- 6 files changed, 114 insertions(+), 84 deletions(-) (limited to 'html') diff --git a/html/base.css b/html/base.css index 6085f5f..e5e4660 100644 --- a/html/base.css +++ b/html/base.css @@ -34,7 +34,7 @@ body { overflow: auto; } -.bold, h1, h2, h3 { +.bold, h1, h2, h3, label { font-weight: bold; } diff --git a/html/dialog.js b/html/dialog.js index 22e8aa9..c4bba5d 100644 --- a/html/dialog.js +++ b/html/dialog.js @@ -42,7 +42,6 @@ */ #FROM html/DOM_helpers.js IMPORT clone_template -#FROM common/lock.js IMPORT make_lock, lock, try_lock, unlock function make(on_dialog_show, on_dialog_hide) { @@ -51,9 +50,7 @@ function make(on_dialog_show, on_dialog_hide) on_dialog_show, on_dialog_hide, shown: false, - queue: 0, - lock: make_lock(), - callback: null + queue: [], }); for (const [id, val] of [["yes", true], ["no", false], ["ok", undefined]]) { @@ -68,33 +65,30 @@ function make(on_dialog_show, on_dialog_hide) function close_dialog(dialog_context, event) { - if (event && event.target.parentElement.classList.contains("hide")) + if ((event && event.target.parentElement.classList.contains("hide")) || + dialog_context.queue.length === 0) return; - const result = event ? event.target.haketilo_dialog_result : undefined; + const [[shown_buts_id, msg, resolve]] = dialog_context.queue.splice(0, 1); - if (dialog_context.queue > 0) - dialog_context.callback(result); + if (dialog_context.queue.length > 0) { + process_queue_item(dialog_context); + } else { + dialog_context.shown = false; + try { + dialog_context.on_dialog_hide(); + } catch(e) { + console.error(e); + } + } + + resolve(event ? event.target.haketilo_dialog_result : undefined); } #EXPORT close_dialog AS close -async function show_dialog(dialog_context, shown_buts_id, msg) +function process_queue_item(dialog_context) { - dialog_context.queue++; - - if (!dialog_context.shown) { - dialog_context.shown = true; - dialog_context.on_dialog_show(); - } - - /* - * We want the dialog to be ready for calling close() right after - * show_dialog() gets called. For this, we want locking to happen - * synchronously if possible. If impossible (lock taken), this means dialog - * is already open, hence it's also ready for close()'ing. - */ - if (!try_lock(dialog_context.lock)) - await lock(dialog_context.lock); + const [shown_buts_id, msg, resolve] = dialog_context.queue[0]; [...dialog_context.msg.childNodes].forEach(n => n.remove()); dialog_context.msg.append(...msg); @@ -102,17 +96,25 @@ async function show_dialog(dialog_context, shown_buts_id, msg) const action = buts_id === shown_buts_id ? "remove" : "add"; dialog_context[buts_id].classList[action]("hide"); } +} - const result = await new Promise(cb => dialog_context.callback = cb); +async function show_dialog(dialog_context, shown_buts_id, msg) +{ + let resolve; + const result_prom = new Promise(cb => resolve = cb); + dialog_context.queue.push([shown_buts_id, msg, resolve]); - if (--dialog_context.queue == 0) { - dialog_context.shown = false; - dialog_context.on_dialog_hide(); + if (!dialog_context.shown) { + process_queue_item(dialog_context); + dialog_context.shown = true; + try { + dialog_context.on_dialog_show(); + } catch(e) { + console.error(e); + } } - unlock(dialog_context.lock); - - return result; + return await result_prom; } const error = (ctx, ...msg) => show_dialog(ctx, "conf_buts", msg); diff --git a/html/grid.css b/html/grid.css index 591772e..aa8fc80 100644 --- a/html/grid.css +++ b/html/grid.css @@ -70,11 +70,3 @@ div.grid_col_both { margin-left: 1em; margin-right: 1em; } - -.grid_form>span { - font-weight: bold; -} - -span.grid_col_2 { - font-weight: initial; -} diff --git a/html/item_preview.html b/html/item_preview.html index a00d299..6cd15a8 100644 --- a/html/item_preview.html +++ b/html/item_preview.html @@ -46,43 +46,43 @@

resource preview

- identifier: + ... - long name: + ... - UUID: + ... - version: + ... - description: + ... - dependencies: +
    - scripts: +
      - source name: + ... - copyright: +

        mapping preview

        - identifier: + ... - long name: + ... - UUID: + ... - version: + ... - description: + ... - payloads: +
        - source name: + ... - copyright: +
          diff --git a/html/payload_create.html b/html/payload_create.html index 0f6927f..062e41c 100644 --- a/html/payload_create.html +++ b/html/payload_create.html @@ -43,29 +43,54 @@ .payload_create_main_view { margin: 0.8em; } - .payload_create_buts { + .payload_create_form { + margin: 0 0.6em; + } + .payload_create_form>* { + margin: 0.3em 0; + } + .payload_create_form>textarea { + resize: vertical; + height: 5em; + } + .payload_create_form>textarea.payload_create_script { + height: 18em; + font-family: monospace; + } + .payload_create_buts, .payload_create_heading { text-align: center; + margin: 0.5em 0; }