@nebularstreams/libmui 2.0.14 → 2.0.15

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nebularstreams/libmui",
   "description": "Micro UI based on Mithril",
-  "version": "2.0.14",
+  "version": "2.0.15",
   "type": "module",
   "main": "src/index.js",
   "scripts": {

package/src/index.js

@@ -21,8 +21,11 @@ import SmileysButton from "./widgets/SmileysButton";
 import startApp from "./app/app"
 import defineWidget from "./util/widgets.utils";
 import {OverflowMenu} from "./util/widgets.core";
-import {confirm, confirmPromise} from "./util/fuckingconfirm.js"
-
+import {confirm, confirmPromise} from "./util/fuckingconfirm"
+import clone from "./util/util.clone"
+import Tokenizer from "./util/util.tokenizer"
+import {CoolContentTicker, CoolGenericTicker, GenericButtonTicker, optionsPrompt} from "./widgets/CoolContentTicker";
+import EmptyButton from "./widgets/EmptyButton";
 
 import {
     VideoUploadButton,
@@ -45,10 +48,11 @@ export {
     ButtonChoiceWidget,
     ButtonNew,
     CardieWidget,
+    ColorJoeWidget,
     ComboPrompt,
     ComboWidget,
-    ColorJoeWidget,
     Empty,
+    EmptyButton,
     Icon,
     InputWidget,
     NoticeWidget,
@@ -79,7 +83,15 @@ export {
     MultiToggleWidget,
     RangeToggleWidget,
 
+    // Content Ticker
+    CoolContentTicker,
+    CoolGenericTicker,
+    GenericButtonTicker,
+    optionsPrompt,
+    Tokenizer,
+
     clearModal,
+    clone,
     confirm,
     confirmPromise,
     defineWidget,

package/src/util/util.tokenizer.js

@@ -215,12 +215,38 @@ function tokenizeUrl(tokenizedUrl, parameters, options) {
         return message || "(not enough parameters)";
     }
 }
+
 function sanitizeFilename(filename) {
     return filename ? filename.trim()
         .toLowerCase()
         .replace(/[^0-9A-Z.-]+/gi, "") : null;
 }
 
+
+const generateFilename = (url, prefix = undefined) => {
+
+    const
+        dateCode = parseInt(md5(url)
+            .substring(24), 16)
+            .toString(32);
+
+    return (prefix ? sanitizeFilename(prefix) + "-" : "") + dateCode;
+
+}; // 2025 --- 24 years layer i'm 50 ! I wonder about my past self ...
+
+const Tokenizer = {
+    tokenize,
+    tokenizeStrict,
+    tokenizeObject,
+    tokenizeKeep,
+    tokenizeWithDefault,
+    tokenizeUrl,
+    getPointedData,
+    sanitizeFilename,
+    generateFilename
+};
+
+export default Tokenizer;
 export {
     tokenize,
     tokenizeStrict,
@@ -229,5 +255,6 @@ export {
     tokenizeWithDefault,
     tokenizeUrl,
     getPointedData,
-    sanitizeFilename
+    sanitizeFilename,
+    generateFilename
 };

package/src/widgets/CoolContentTicker.js

@@ -0,0 +1,239 @@
+import {defineWidget, ButtonNew} from "./Basic.js"
+import {promptName} from "./OverflowUtils"
+import {confirmPromise} from "../util/fuckingconfirm"
+
+const
+    ThematicWrapper = defineWidget(
+        ({attrs, children}) => m(
+            ".buttonchoice.withicon.flexrow.scaff.scaff-b1.fadein.ohidden.fa-" + (attrs.icon || "gear"),
+            {class: (attrs.containerClass || "col-11 grows marg-1"), title: attrs.title},
+            m(
+                ".flexrow.wrap.grows.col-11.ohidden.scaff-left.bg-inputs",
+                {class: attrs.class},
+                children
+            )
+        )
+    ),
+    optionsPrompt = (items, index, onAdd, onDelete, onEdit, allowUpdate) => {
+
+        const item = items[index];
+
+        confirmPromise(
+            null,
+
+            "Choose an action for this preset",
+
+            onAdd && allowUpdate
+                ? ["DELETE", "RENAME", "UPDATE", "CANCEL"]
+                : ["DELETE", "RENAME", "CANCEL"]
+        )
+            .then(({idx}) => {
+
+                if (idx === 0) {
+                    items.splice(index, 1);
+                    if (onDelete) onDelete(index);
+                    m.redraw();
+                } else if (idx === 1) {
+                    setTimeout(() => promptName(
+                        "Rename Preset",
+                        item.title || "",
+                        "type a name for this preset",
+                        (newName) => {
+                            if (newName) {
+                                newName = newName.trim();
+                                if (newName) {
+                                    item.title = newName.substring(0, 24);
+                                    m.redraw();
+                                }
+                            }
+                        }
+                    ), 10);
+                } else if (onAdd && idx === 2) {
+                    onAdd(false, index);
+                }
+            });
+    },
+    GenericButtonTicker = defineWidget(
+        ({attrs, children}) => {
+
+            const
+                {
+                    title, noUpdate, items = [], current, altIndex, onEdit, emptyText,
+                    onAdd, onSelect, onDelete, addText = "Add New",
+                    unconfirm, buttonClass, themeIcon, themeTitle
+                } = attrs,
+
+                allItems = [
+
+                    ...items.map(
+                        (item, index) => m(
+                            "button.grows.marg-1.ellipsis.ohidden.hasShift",
+                            {
+
+                                class: (buttonClass ? buttonClass : "unitheightsmall scaff-b1")
+                                    + (index === current ? " accent" : "")
+                                    + (index === altIndex ? " alt-accent" : ""),
+
+                                title,
+                                onclick: (e) => {
+                                    if (e.metaKey && onEdit) {
+                                        onEdit(item);
+                                    } else if (onAdd && e.shiftKey) {
+                                        if (unconfirm) {
+                                            items.splice(index, 1);
+                                            if (onDelete) onDelete(index);
+                                            m.redraw();
+                                        } else {
+                                            optionsPrompt(items, index, onAdd, onDelete, undefined, !noUpdate);
+                                        }
+                                    } else {
+                                        onSelect(item, index, e.metaKey, e.shiftKey);
+                                    }
+                                }
+                            },
+                            (item.title || item.name || item.text || String(1 + index)).substring(0, 32)
+                        )
+                    ),
+
+                    ...!items.length && emptyText
+                        ? [
+                            m(".grows.marg-1.ellipsis.ohidden.al-center", emptyText)
+                        ] : [],
+
+                    ...onAdd
+                        ? [
+                            m(ButtonNew, {
+                                tabIndex: -1,
+                                icon: attrs.icon || "plus",
+                                title: attrs.addTitle || "Add a new item",
+                                class: "pad-2 pad-h al-center unitheightsmall transp addbut scaff-left bg-window-lo grows",
+                                onClick: (e) => onAdd(e.ctrlKey || e.metaKey),
+                                text: items?.length ? "" : addText
+                            })
+                        ]
+                        : [],
+
+                    ...!themeIcon && attrs.currentWidget && current >= 0 && items[current]
+                        ? attrs.currentWidget(items[current], current) || []
+                        : [],
+
+                    ...children
+                ];
+
+            return themeIcon
+                ? [
+                    m(ThematicWrapper, {
+                        title: themeTitle,
+                        containerClass: attrs.containerClass,
+                        icon: themeIcon
+                    }, allItems),
+                    ...attrs.currentWidget && current >= 0 && items[current] ? attrs.currentWidget(items[current], current) || [] : []
+                ] : allItems;
+        }
+    ),
+    CoolGenericTicker = defineWidget(
+        ({attrs, children}) => {
+
+            const
+                {
+                    nocontainer,
+                    emptyText,
+                    title,
+                    addTitle,
+                    items,
+                    currentIndex,
+                    altIndex,
+                    onEdit,
+                    onDelta,
+                    onSelect,
+                    onAdd,
+                    addText,
+                    icon,
+                    buttonClass
+                } = attrs,
+                itemz = ((items && items.length <= (attrs.max || 15)) || !onDelta)
+                    ? m(GenericButtonTicker, {
+                        addTitle,
+                        emptyText,
+                        title,
+                        items,
+                        current: currentIndex,
+                        altIndex,
+                        onSelect,
+                        onAdd,
+                        onEdit,
+                        addText,
+                        icon,
+                        buttonClass
+                    }, children)
+                    : [
+                        m(ButtonNew, {
+                            tabIndex: -1,
+                            icon: "caret-right",
+                            class: "unitheightsmall grows marg-1 no-marg-left",
+                            onClick: () => onDelta(-1)
+                        }),
+                        ...items
+                            ? [
+                                m(
+                                    ".scaff.unitheightsmall.value.al-center.bg-window-lo.grows.marg-1.no-marg-left ",
+                                    (1 + currentIndex) + " / " + items.length
+                                )
+                            ]
+                            : [],
+                        m(ButtonNew, {
+                            tabIndex: -1,
+                            icon: "caret-left",
+                            class: "unitheightsmall grows marg-1 marg-v",
+                            onClick: () => onDelta(1)
+                        }),
+                        ...onAdd
+                            ? [
+                                m(ButtonNew, {
+                                    tabIndex: -1,
+                                    icon: attrs.icon || "plus",
+                                    class: "unitheightsmall marg-1 marg-v",
+                                    onClick: () => onAdd()
+                                })
+                            ] : []
+                    ];
+
+            return nocontainer
+                ? itemz
+                : items.length || !onAdd ? m(
+                    ".flexrow.wrap.max.minusbar",
+                    {class: (attrs.dynclass ? attrs.dynclass() + " " : "") + attrs.class},
+                    itemz
+                ) : [];
+        }
+    ),
+
+    CoolContentTicker = defineWidget(
+        ({attrs}) => {
+
+            if (!attrs.layer.items) return [];
+
+            const
+                {global, layer, remoteFirst: isRemote, isCue} = attrs,
+                {storyWrapper} = global,
+                {id, items} = layer,
+
+                currentIndex = storyWrapper.getTickerIndex(id, isRemote),
+                altIndex = isRemote ? storyWrapper.getTickerIndex(id, false) : undefined;
+
+            // noinspection JSUnusedGlobalSymbols
+            return m(CoolGenericTicker, {
+                title: attrs.title,
+                onAdd: attrs.onAdd,
+                class: "marg-1 marg-h grows",
+                items,
+                currentIndex,
+                altIndex,
+                current: items[currentIndex] || undefined,
+                onDelta: (direction) => storyWrapper.tickLayer(layer, direction, isRemote, isCue),
+                onSelect: (item, index, force) => storyWrapper.setTickerIndex(layer, index, force, isRemote, isCue)
+            });
+        }
+    );
+
+export {CoolContentTicker, CoolGenericTicker, GenericButtonTicker, optionsPrompt};

package/src/widgets/EmptyButton.js

@@ -0,0 +1,39 @@
+const
+
+	m = require("mithril"),
+	defineWidget = require("util.definewidget"),
+
+	{ ButtonNew, Empty } = require("app.widgets");
+
+const EmptyButton = defineWidget(
+	({ attrs }) => m(
+		Empty,
+		{
+			size: 2,
+			icon: attrs.icon,
+			class: "pad-2"
+		},
+		[
+			...attrs.texts
+				.map((text) => m(".text", text)),
+			...attrs.buttonText ? [
+				m(ButtonNew, {
+					class: "font-125 accentbutton unitheightsmall",
+					icon: attrs.icon || "plus",
+					text: attrs.buttonText,
+					onClick: attrs.onClick
+				})
+			] : [],
+			...attrs.buttonAlt ? [
+				m(ButtonNew, {
+					class: "font-125 accentbutton unitheightsmall",
+					icon: attrs.iconAlt || "plus",
+					text: attrs.buttonTextAlt,
+					onClick: attrs.onClick
+				})
+			] : []
+		]
+	)
+);
+
+module.exports = EmptyButton;