@nebularstreams/libmui 3.1.0 → 4.0.0

package/src/widgets/OverflowUtils.js

@@ -1,449 +0,0 @@
-import m from "mithril";
-import defineWidget from "../util/widgets.utils";
-import * as widget from "../util/widgets";
-import {Icon, Notification, ButtonNew} from "./Basic"
-import {OverflowMenu} from "../util/widgets.core";
-import SwitchWidget from "../widgets/SwitchWidget";
-import InputWidget from "../widgets/InputWidget";
-import Notice from "../widgets/NoticeWidget";
-import clone from "../util/util.clone"
-
-function choose(items, config = {
-    icon: "circle", onSelect: () => {
-    }
-}) {
-
-    const
-        {icon, title, field, onSelect, parser = (v) => v} = config,
-        options = items.map((item, index) => ({
-            icon: field && item.icon || icon,
-            // WARNING !!!!!
-            caption: parser(field ? item[field] : item, item),
-            // caption: idField ? item[idField] : item,
-            onClick: (e) => onSelect(item, e, index)
-        }));
-
-    if (Array.isArray(items) && !items.length) {
-        Notification.add("No items available");
-    } else {
-        OverflowMenu(
-            document.body,
-            {title},
-            options
-        )
-            .then(({action}) => action.onClick());
-    }
-}
-
-function promptOptions(items, onchange, options = {}) {
-
-    const
-        {title, field, icon, textNew, textHint, resolve} = options,
-        dialogOptions = Array.isArray(items)
-            ? items.map((item) => ({
-                icon,
-                // WARNING !!!!!
-                caption: field ? item[field] : item,
-                // caption: idField ? item[idField] : item,
-                onClick: (e) => onchange(item, e)
-            }))
-            : Object.keys(items)
-                .map((key) => ({
-                    icon: items[key].icon || icon,
-                    caption: items[key].caption || key,
-                    onClick: (e) => onchange(
-                        resolve && items[key].value !== undefined
-                            ? items[key].value
-                            : items[key],
-                        e)
-                }));
-
-    if (Array.isArray(items) && !items.length) {
-        Notification.add("No items available");
-    } else {
-        OverflowMenu(
-            document.body,
-            {title},
-            [
-                ...textNew && !field
-                    ? [
-                        {
-                            icon: "plus",
-                            caption: textNew,
-                            onClick: () => promptName(
-                                textNew,
-                                "",
-                                textHint,
-                                (value) => {
-                                    if (value) {
-                                        if (value && value.trim()) {
-                                            onchange(value);
-                                            m.redraw();
-                                        }
-                                    }
-                                }
-                            )
-                        }
-                    ]
-                    : [],
-                ...dialogOptions
-            ]
-        )
-            .then(({action}) => action.onClick())
-            .finally(() => {
-            });
-    }
-}
-
-function promptName(title, value, hint, action, state = {}) {
-    setTimeout(() => OverflowMenu(
-        document.body,
-        {title},
-        [
-            {
-                type: "text",
-                hint,
-                value
-            }
-        ]
-    )
-        .then(({value: val}) => {
-            state.refreshKey = String(Date.now());
-            return action(val);
-        }), 100);
-}
-
-const
-    WHAT_DO_UPDATE_LIGHTS = 0,          // 0
-    WHAT_DO_UPDATE_FACE = 1,            // 1
-    WHAT_DO_UPDATE_PARTICLES = 2,       // 4
-    WHAT_DO_UPDATE_SEGMENTATION = 3,
-    WHAT_DO_UPDATE_VAL_VPLANE = 4,
-    WHAT_DO_UPDATE_VAL_PANO = 5,
-    WHAT_DO_UPDATE_VAL_FREE = 6,
-    WHAT_DO_UPDATE_VAL_DRONE = 7,
-    WHAT_DO_UPDATE_VAL_TRANSITION = 8,
-    WHAT_DO_UPDATE_TVFX = 9,
-    WHAT_DO_UPDATE_VAL_FOLLOW = 10,
-
-    PROPERTIES = [
-        ["Lights and Fog", null, ["amblight", "l0", "l1", "l2", "l3", "fog"], WHAT_DO_UPDATE_LIGHTS],
-        ["Face and Accessories", null, ["facekit"], WHAT_DO_UPDATE_FACE],
-        ["Particle settings", null, ["particles"], WHAT_DO_UPDATE_PARTICLES],
-        ["Video Segmentation", "common", ["segcam", "mask", "green"], WHAT_DO_UPDATE_SEGMENTATION, true],
-        ["Video Effects", null, ["fxconfig"], WHAT_DO_UPDATE_TVFX],
-        ["Video Plane", "val", ["xvideo", "yvideo", "zvideo", "rvideo", "svideo", "video"], WHAT_DO_UPDATE_VAL_VPLANE],
-        ["Main Camera", "val", ["ypos", "xpos", "zoom", "yaw", "pitch", "roll", "ai"], WHAT_DO_UPDATE_VAL_PANO],
-        ["Drone Camera", "val", ["free"], WHAT_DO_UPDATE_VAL_FREE],
-        ["Followed Agent", "val", ["track"], WHAT_DO_UPDATE_VAL_FOLLOW],
-        ["Game Camera", "val", ["orbit", "track", "ocam"], WHAT_DO_UPDATE_VAL_DRONE, undefined, true],
-        ["Transition Speed", "val", ["spd"], WHAT_DO_UPDATE_VAL_TRANSITION]
-    ],
-
-    TitleBarWidget = defineWidget(
-        ({attrs}) => m("h2.marg-2.no-marg-bottom", attrs.title)
-    ),
-    EntityTemplates = defineWidget(
-        ({attrs}) => {
-
-            const
-                {type = "changes", meta, onInput, title, options} = attrs,
-                valid = meta.title?.trim().length && meta.description?.trim().length,
-                embedded = options && options.embedded;
-
-            return m(".flexcol.grows.ohidden.fadein", [
-                ...attrs.title ? [
-                    m(TitleBarWidget, {
-                        title
-                    })] : [],
-                m(".flexrow.wrap.grows.pad-3.propsgroup.scrolly", [
-                    ...attrs.notice ? [
-                        m(Notice, {
-                            class: "marg-1 marg-v withbottommargin font-75 col-12",
-                            size: 1,
-                            icon: "info-circle",
-                            text: attrs.notice
-                        })
-                    ] : [],
-                    m(
-                        ".witharia.col-12.pad-1.pad-v",
-                        {"aria-label": type + " name"},
-                        m(InputWidget, {
-                            class: "pad-2 pad-xh " + (valid ? "valid" : "invalid"),
-                            value: meta.title,
-                            maxlength: 64,
-                            onchange: (newvalue) => {
-                                meta.title = newvalue;
-                                m.redraw();
-                            }
-                        })
-                    ),
-                    ...embedded ? []
-                        : [
-                            m(
-                                ".col-12.witharia.pad-1.pad-v",
-                                {"aria-label": "description"},
-                                m(InputWidget, {
-                                    class: "pad-2 pad-xh " + (meta.description ? "valid" : "invalid"),
-                                    value: meta.description,
-                                    maxlength: 240,
-                                    multi: true,
-                                    alwaysmulti: true,
-                                    onchange: (newvalue) => {
-                                        meta.description = newvalue;
-                                        m.redraw();
-                                    }
-                                })
-                            ),
-                            m(
-                                ".col-8.witharia.pad-1.pad-v",
-                                {"aria-label": "tags"},
-                                m(InputWidget, {
-                                    class: "pad-2 pad-xh",
-                                    value: meta.tags,
-                                    maxlength: 128,
-                                    onchange: (newvalue) => {
-                                        meta.tags = newvalue.toLowerCase()
-                                            .split(" ")
-                                            .join(",")
-                                            .split(",")
-                                            .filter((tag) => tag.length)
-                                            .join(",");
-                                    }
-                                })
-                            ),
-                            m(
-                                ".col-4.witharia.pad-1.pad-v",
-                                {"aria-label": "youtube video"},
-                                m(InputWidget, {
-                                    class: "pad-2 pad-xh",
-                                    value: meta.ytref || "",
-                                    hint: "YouTube ID",
-                                    maxlength: 16,
-                                    onchange: (newvalue) => {
-                                        newvalue = newvalue.trim();
-                                        if (newvalue) {
-                                            if (newvalue.indexOf(" ") === -1) {
-                                                meta.ytref = newvalue.trim();
-                                            }
-                                        } else {
-                                            delete meta.ytref;
-                                        }
-                                    }
-                                })
-                            )
-                        ],
-                    m(
-                        ".col-4.witharia.pad-1.pad-v",
-                        {"aria-label": "content attribution"},
-                        m(InputWidget, {
-                            class: "pad-2 pad-xh",
-                            value: meta.author,
-                            hint: "author name",
-                            maxlength: 128,
-                            onchange: (newvalue) => {
-                                meta.author = newvalue;
-                            }
-                        })
-                    ),
-
-                    m(
-                        ".col-4.witharia.pad-1.pad-v",
-                        {"aria-label": "license or author link"},
-                        m(InputWidget, {
-                            class: "pad-2 pad-xh",
-                            hint: "https://...",
-                            value: meta.link,
-                            maxlength: 128,
-                            onchange: (newvalue) => {
-                                meta.link = newvalue;
-                            }
-                        })
-                    ),
-                    m(
-                        ".col-4.witharia.pad-1.pad-v",
-                        {"aria-label": "source domain"},
-                        m(InputWidget, {
-                            class: "pad-2 pad-xh",
-                            value: meta.source,
-                            hint: "example.com",
-                            maxlength: 128,
-                            onchange: (newvalue) => {
-                                meta.source = newvalue;
-                            }
-                        })
-                    ),
-
-                    m(
-                        ".col-12.al-right.marg-2.marg-v",
-                        m(ButtonNew, {
-                            class: "noshrink accentbutton unitheightsmall col-4",
-                            text: "save " + type,
-                            onClick: () => {
-
-                                const isValid = meta.title?.trim().length && (embedded || meta.description?.trim().length);
-
-                                if (isValid) {
-                                    widget.popupMessage(null);
-                                    onInput(meta);
-                                } else {
-                                    Notification.add("Information is incomplete or invalid");
-                                }
-                            }
-                        })
-                    )
-                ])
-            ]);
-        }
-    ),
-    promptEntity = (meta, title, type, options = {}) => new Promise((resolve, reject) => {
-        widget.popupMessage(
-            m(EntityTemplates, {
-                meta,
-                type,
-                title,
-                options,
-                onInput: (newMeta) => resolve(newMeta)
-            }),
-            () => {
-                reject(new Error("cancelled"));
-            }
-        );
-    }),
-    PresetTemplate = defineWidget(
-        ({attrs}) => {
-
-            const
-
-                {parameters, preset, presetComponents, types, globalData, fetcher} = attrs,
-                available = [],
-                sourceAvailable = [],
-                items = types
-                    ? PROPERTIES
-                    : PROPERTIES.filter((cosa) => {
-
-                        const
-                            [, primaryTarget, elements, index, globalSource] = cosa,
-                            target = primaryTarget ? preset[primaryTarget] : preset,
-                            rootSource = globalSource ? globalData : parameters,
-                            source = primaryTarget ? rootSource[primaryTarget] : rootSource;
-
-                        let found = false;
-
-                        if (elements.length) {
-
-                            for (const element of elements) {
-                                if (target && target[element] !== undefined) {
-                                    found = available[index] = true;
-                                }
-                                if (source[element] !== undefined) {
-                                    found = sourceAvailable[index] = true;
-                                }
-                            }
-                            return found;
-                        } else {
-                            found = true;
-                            sourceAvailable[index] = !!source;
-                            available[index] = !!target;
-                        }
-                        return found;
-
-                    });
-
-            return m(
-                "ul.flexrow.wrap.userdialog",
-                items.length
-                    ? items.map((cosa) => {
-
-                        const
-                            [title, primaryTarget, elements, cosaIndex, globalSource, fetchLive] = cosa,
-                            target = types ? undefined : primaryTarget ? preset[primaryTarget] : preset,
-                            rootSource = globalSource ? globalData : parameters,
-                            source = types ? undefined : primaryTarget ? rootSource[primaryTarget] : rootSource,
-                            deleteCurrent = () => {
-                                if (elements.length) {
-                                    for (const field of elements) {
-                                        delete target[field];
-                                    }
-                                } else if (elements.length === 0 && primaryTarget) {
-                                    delete preset[primaryTarget];
-                                }
-                                attrs.redraw && attrs.redraw();
-                            },
-                            updateCurrent = () => {
-                                if (elements.length) {
-                                    if (primaryTarget && !preset[primaryTarget]) preset[primaryTarget] = {};
-                                    const updatedTarget = primaryTarget ? preset[primaryTarget] : preset;
-                                    for (const field of elements) {
-                                        if (source[field] !== undefined) {
-                                            const finalSource = fetchLive && fetcher ? fetcher(updatedTarget[field], cosaIndex) : source[field];
-                                            updatedTarget[field] = clone(finalSource);
-                                        }
-                                    }
-                                } else if (elements.length === 0 && primaryTarget) {
-                                    if (source !== undefined) {
-                                        const finalSource = fetchLive && fetcher ? fetcher(source, cosaIndex) : source;
-                                        preset[primaryTarget] = clone(finalSource);
-                                    }
-                                }
-                                attrs.redraw && attrs.redraw();
-                                Notification.add(`updated ${title} from current scene`);
-                            },
-                            isAvailable = types || available[cosaIndex],
-                            isSourceAvailable = sourceAvailable[cosaIndex];
-
-                        return [
-                            ...presetComponents ? [
-                                m(SwitchWidget, {
-                                    title: `Include ${cosa[0]} in snapshots`,
-                                    class: "grows unitheightsmall" + (presetComponents[cosaIndex] ? " accent" : ""),
-                                    checked: !!presetComponents[cosaIndex],
-                                    onchange: (status) => {
-                                        presetComponents[cosaIndex] = !presetComponents[cosaIndex];
-                                        m.redraw();
-                                        attrs.redraw && attrs.redraw();
-                                    }
-                                }),
-                                m(".grows", {class: isAvailable ? "avail" : "unavail"}, title)
-                            ] : [],
-                            ...!attrs.types ? [
-                                m(ButtonNew, {
-                                    class: "col-3" + (isSourceAvailable ? "avail" : "unavail"),
-                                    icon: "sync", title: `Copy ${title} from current state`,
-                                    onClick: updateCurrent
-                                }),
-                                m(ButtonNew, {
-                                    class: "col-3 " + (isAvailable ? "" : "disabled text-lo"),
-                                    icon: "trash", title: `Delete ${title} in preset`,
-                                    onClick: () => isAvailable && deleteCurrent()
-                                })
-                            ] : [],
-                            m(".flexbreak")
-                        ];
-
-                    })
-                    : m("h3", "Preset is Empty")
-            );
-        }
-    ),
-    promptPreset = (preset, parameters, options = {}) => new Promise((resolve, reject) => {
-        widget.popupMessage(
-            () => m(PresetTemplate, {
-                ...options,
-                preset,
-                parameters,
-                redraw: () => widget.popupMessage.redraw()
-            }),
-            () => {
-                reject(new Error("cancelled"));
-            }
-        );
-    });
-
-export {
-    promptName,
-    promptEntity,
-    promptPreset,
-    promptOptions,
-    choose
-};

package/src/widgets/PlusMinusWidget.js

@@ -1,55 +0,0 @@
-import m from "mithril";
-import {ButtonNew, defineWidget} from "./Basic";
-
-const
-	PlusMinus = defineWidget(
-		({attrs}) => {
-			return m(".flexrow.wrap.grows",
-				{
-					...attrs.label && {"aria-label": attrs.label},
-					class: (attrs.label ? "witharia" : "") + " " + (attrs.class || ""),
-					title: attrs.title || ""
-				},
-				[
-					m(ButtonNew, {
-						icon: attrs.iconMinus ?? "minus",
-						class: "unitsizesmall " + (attrs.buttonClass || "transp"),
-						title: attrs.title ? "decrease the " + attrs.title : "",
-						onClick: () => {
-							const {
-								step = 1,
-								min = 0
-							} = attrs;
-							let v = attrs.value || 0;
-							if (Number.isNaN(v)) v = 0;
-							v -= step;
-							if (min !== undefined && v < min) v = min;
-							attrs.onchange(v);
-							m.redraw();
-						}
-					}),
-					m(".currentvalue.al-center.grows.unitheightsmall", {
-						title: attrs.title
-					}, attrs.parser ? attrs.parser(attrs.value) : String(attrs.value || 0)),
-					m(ButtonNew, {
-						icon: attrs.iconPlus ?? "plus",
-						class: "unitsizesmall " + (attrs.buttonClass || "transp"),
-						title: attrs.title ? "increase the " + attrs.title : "",
-						onClick: () => {
-							const {
-								step = 1,
-								max = 0
-							} = attrs;
-
-							let v = attrs.value || 0;
-							if (max !== undefined && v === max) return;
-							v += step;
-							attrs.onchange(v);
-							m.redraw();
-						}
-					})
-				]);
-		}
-	);
-
-export default PlusMinus;