communications app, popup lib

2023-04-08 11:46:20 +08:00
parent 449196b491
commit f85d4c9903
25 changed files with 746 additions and 279 deletions
--- a/lib/ui/popup.js
+++ b/lib/ui/popup.js
@ -0,0 +1,45 @@
+import "../../css/popup.scss";
+import { createElement } from "../functions";
+import { createIcon } from "./icon";
+
+function createPopup(title, content, ...buttons) {
+    const mask = createElement('div', 'popup-mask');
+    const container = createElement('div', 'popup-container');
+    const close = () => {
+        mask.classList.add('popup-active');
+        mask.style.opacity = 0;
+        setTimeout(() => mask.remove(), 120);
+    };
+    container.append(
+        createElement('div', header => {
+            header.className = 'popup-header';
+            if (title instanceof HTMLElement) {
+                header.appendChild(title);
+            } else {
+                header.appendChild(createElement('div', t => t.innerText = title));
+            }
+            const cancel = createIcon('fa-regular', 'times');
+            cancel.addEventListener('click', () => close());
+            header.appendChild(cancel);
+        }),
+        createElement('div', 'popup-body', content),
+        createElement('div', 'popup-footer', ...buttons.map(b => {
+            const button = createElement('div', 'popup-button');
+            button.innerText = b.text;
+            if (typeof b.trigger === 'function') {
+                button.addEventListener('click', () => {
+                    if (b.trigger(container) === false) {
+                        return;
+                    }
+                    close();
+                });
+            }
+        }))
+    );
+    mask.appendChild(container);
+    return mask;
+}
+
+export {
+    createPopup
+}