@fps-games/editor 0.2.0-beta.4 → 0.2.1-beta.2

package/node_modules/@playcanvas/pcui/dist/module/src/binding/BindingBase/index.mjs

@@ -0,0 +1,215 @@
+import { Events } from '@playcanvas/observer';
+
+/**
+ * Base class for data binding between {@link IBindable} {@link Element}s and Observers.
+ */
+class BindingBase extends Events {
+    /**
+     * Creates a new binding.
+     *
+     * @param args - The arguments.
+     */
+    constructor(args) {
+        super();
+        this._observers = [];
+        this._paths = [];
+        this._applyingChange = false;
+        this._linked = false;
+        this._element = args.element;
+        this._history = args.history;
+        this._historyPrefix = args.historyPrefix;
+        this._historyPostfix = args.historyPostfix;
+        this._historyName = args.historyName;
+        this._historyCombine = args.historyCombine ?? false;
+    }
+    // Returns the path at the specified index
+    // or the path at the first index if it doesn't exist.
+    _pathAt(paths, index) {
+        return paths[index] || paths[0];
+    }
+    /**
+     * Links the specified observers to the specified paths.
+     *
+     * @param observers - The observer(s).
+     * @param paths - The path(s). The behavior of the binding depends on how many paths are passed.
+     * If an equal amount of paths and observers are passed then the binding will map each path to each observer at each index.
+     * If more observers than paths are passed then the path at index 0 will be used for all observers.
+     * If one observer and multiple paths are passed then all of the paths will be used for the observer (e.g. for curves).
+     */
+    link(observers, paths) {
+        if (this._observers) {
+            this.unlink();
+        }
+        this._observers = Array.isArray(observers) ? observers : [observers];
+        this._paths = Array.isArray(paths) ? paths : [paths];
+        this._linked = true;
+    }
+    /**
+     * Unlinks the observers and paths.
+     */
+    unlink() {
+        this._observers = [];
+        this._paths = [];
+        this._linked = false;
+    }
+    /**
+     * Clones the binding. To be implemented by derived classes.
+     */
+    clone() {
+        throw new Error('BindingBase#clone: Not implemented');
+    }
+    /**
+     * Sets a value to the linked observers at the linked paths.
+     *
+     * @param value - The value
+     */
+    setValue(value) {
+    }
+    /**
+     * Sets an array of values to the linked observers at the linked paths.
+     *
+     * @param values - The values.
+     */
+    setValues(values) {
+    }
+    /**
+     * Adds (inserts) a value to the linked observers at the linked paths.
+     *
+     * @param value - The value.
+     */
+    addValue(value) {
+    }
+    /**
+     * Adds (inserts) multiple values to the linked observers at the linked paths.
+     *
+     * @param values - The values.
+     */
+    addValues(values) {
+    }
+    /**
+     * Removes a value from the linked observers at the linked paths.
+     *
+     * @param value - The value.
+     */
+    removeValue(value) {
+    }
+    /**
+     * Removes multiple values from the linked observers from the linked paths.
+     *
+     * @param values - The values.
+     */
+    removeValues(values) {
+    }
+    /**
+     * Sets the element.
+     */
+    set element(value) {
+        this._element = value;
+    }
+    /**
+     * Gets the element.
+     */
+    get element() {
+        return this._element;
+    }
+    /**
+     * Sets whether the binding is currently applying a change, either to the observers or the element.
+     */
+    set applyingChange(value) {
+        if (this._applyingChange === value)
+            return;
+        this._applyingChange = value;
+        this.emit('applyingChange', value);
+    }
+    /**
+     * Gets whether the binding is currently applying a change, either to the observers or the element.
+     */
+    get applyingChange() {
+        return this._applyingChange;
+    }
+    /**
+     * Gets whether the binding is linked to observers.
+     */
+    get linked() {
+        return this._linked;
+    }
+    /**
+     * Sets whether to combine history actions when applying changes to observers. This is assuming
+     * a history module is being used.
+     */
+    set historyCombine(value) {
+        this._historyCombine = value;
+    }
+    /**
+     * Gets whether to combine history actions when applying changes to observers.
+     */
+    get historyCombine() {
+        return this._historyCombine;
+    }
+    /**
+     * Sets the name of the history action when applying changes to observers.
+     */
+    set historyName(value) {
+        this._historyName = value;
+    }
+    /**
+     * Gets the name of the history action when applying changes to observers.
+     */
+    get historyName() {
+        return this._historyName;
+    }
+    /**
+     * Sets the string to prefix {@link historyName} with.
+     */
+    set historyPrefix(value) {
+        this._historyPrefix = value;
+    }
+    /**
+     * Gets the string to prefix {@link historyName} with.
+     */
+    get historyPrefix() {
+        return this._historyPrefix;
+    }
+    /**
+     * Sets the string to postfix {@link historyName} with.
+     */
+    set historyPostfix(value) {
+        this._historyPostfix = value;
+    }
+    /**
+     * Gets the string to postfix {@link historyName} with.
+     */
+    get historyPostfix() {
+        return this._historyPostfix;
+    }
+    /**
+     * Sets whether history is enabled for the binding. A valid history object must have been provided first.
+     */
+    set historyEnabled(value) {
+        if (this._history) {
+            // @ts-ignore
+            this._history.enabled = value;
+        }
+    }
+    /**
+     * Gets whether history is enabled for the binding.
+     */
+    get historyEnabled() {
+        // @ts-ignore
+        return this._history && this._history.enabled;
+    }
+    /**
+     * Gets the linked observers.
+     */
+    get observers() {
+        return this._observers;
+    }
+    /**
+     * Gets the linked paths.
+     */
+    get paths() {
+        return this._paths;
+    }
+}
+
+export { BindingBase };

package/node_modules/@playcanvas/pcui/dist/module/src/binding/BindingElementToObservers/index.mjs

@@ -0,0 +1,297 @@
+import { BindingBase } from '../BindingBase/index.mjs';
+
+/**
+ * Provides one way binding between an {@link IBindable} element and Observers. Any changes from
+ * the element will be propagated to the observers.
+ */
+class BindingElementToObservers extends BindingBase {
+    /**
+     * Clone the binding and return a new instance.
+     */
+    clone() {
+        return new BindingElementToObservers({
+            history: this._history,
+            historyPrefix: this._historyPrefix,
+            historyPostfix: this._historyPostfix,
+            historyName: this._historyName,
+            historyCombine: this._historyCombine
+        });
+    }
+    _getHistoryActionName(paths) {
+        return `${this._historyPrefix || ''}${this._historyName || paths[0]}${this._historyPostfix || ''}`;
+    }
+    // Sets the value (or values of isArrayOfValues is true)
+    // to the observers
+    _setValue(value, isArrayOfValues) {
+        if (this.applyingChange)
+            return;
+        if (!this._observers.length)
+            return;
+        this.applyingChange = true;
+        // make copy of observers if we are using history
+        // so that we can undo on the same observers in the future
+        const observers = this._observers.slice();
+        const paths = this._paths.slice();
+        const context = {
+            observers,
+            paths
+        };
+        const execute = () => {
+            this._setValueToObservers(observers, paths, value, isArrayOfValues);
+            this.emit('history:redo', context);
+        };
+        if (this._history) {
+            let previousValues = [];
+            if (observers.length === 1 && paths.length > 1) {
+                previousValues = paths.map((path) => {
+                    return observers[0].has(path) ? observers[0].get(path) : undefined;
+                });
+            }
+            else {
+                previousValues = observers.map((observer, i) => {
+                    const path = this._pathAt(paths, i);
+                    return observer.has(path) ? observer.get(path) : undefined;
+                });
+            }
+            this.emit('history:init', context);
+            this._history.add({
+                name: this._getHistoryActionName(paths),
+                redo: execute,
+                combine: this._historyCombine,
+                undo: () => {
+                    this._setValueToObservers(observers, paths, previousValues, true);
+                    this.emit('history:undo', context);
+                }
+            });
+        }
+        execute();
+        this.applyingChange = false;
+    }
+    _setValueToObservers(observers, paths, value, isArrayOfValues) {
+        // special case for 1 observer with multiple paths (like curves)
+        // in that case set each value for each path
+        if (observers.length === 1 && paths.length > 1) {
+            for (let i = 0; i < paths.length; i++) {
+                const latest = observers[0].latest();
+                if (!latest)
+                    continue;
+                let history = false;
+                if (latest.history) {
+                    history = latest.history.enabled;
+                    latest.history.enabled = false;
+                }
+                const path = paths[i];
+                const val = value[i];
+                if (value !== undefined) {
+                    this._observerSet(latest, path, val);
+                }
+                else {
+                    latest.unset(path);
+                }
+                if (history) {
+                    latest.history.enabled = true;
+                }
+            }
+            return;
+        }
+        for (let i = 0; i < observers.length; i++) {
+            const latest = observers[i].latest();
+            if (!latest)
+                continue;
+            let history = false;
+            if (latest.history) {
+                history = latest.history.enabled;
+                latest.history.enabled = false;
+            }
+            const path = this._pathAt(paths, i);
+            const val = isArrayOfValues ? value[i] : value;
+            if (value !== undefined) {
+                this._observerSet(latest, path, val);
+            }
+            else {
+                latest.unset(path);
+            }
+            if (history) {
+                latest.history.enabled = true;
+            }
+        }
+    }
+    // Handles setting a value to an observer
+    // in case that value is an array
+    _observerSet(observer, path, value) {
+        // check if the parent of the last field in the path
+        // exists in the observer because if it doesn't
+        // an error is most likely going to be raised by C3
+        const lastIndexDot = path.lastIndexOf('.');
+        if (lastIndexDot > 0 && !observer.has(path.substring(0, lastIndexDot))) {
+            return;
+        }
+        const isArray = Array.isArray(value);
+        // we need to slice an array value before passing it to the 'set'
+        // method otherwise there are cases where the Observer will be modifying
+        // the same array instance
+        observer.set(path, isArray && value ? value.slice() : value);
+    }
+    _addValues(values) {
+        if (this.applyingChange)
+            return;
+        if (!this._observers)
+            return;
+        this.applyingChange = true;
+        // make copy of observers if we are using history
+        // so that we can undo on the same observers in the future
+        const observers = this._observers.slice();
+        const paths = this._paths.slice();
+        const records = [];
+        for (let i = 0; i < observers.length; i++) {
+            const path = this._pathAt(paths, i);
+            const observer = observers[i];
+            values.forEach((value) => {
+                if (observer.get(path).indexOf(value) === -1) {
+                    records.push({
+                        observer: observer,
+                        path: path,
+                        value: value
+                    });
+                }
+            });
+        }
+        const execute = () => {
+            for (const record of records) {
+                const latest = record.observer.latest();
+                if (!latest)
+                    continue;
+                const path = record.path;
+                let history = false;
+                if (latest.history) {
+                    history = latest.history.enabled;
+                    latest.history.enabled = false;
+                }
+                latest.insert(path, record.value);
+                if (history) {
+                    latest.history.enabled = true;
+                }
+            }
+        };
+        if (this._history && records.length) {
+            this._history.add({
+                name: this._getHistoryActionName(paths),
+                redo: execute,
+                combine: this._historyCombine,
+                undo: () => {
+                    for (const record of records) {
+                        const latest = record.observer.latest();
+                        if (!latest)
+                            continue;
+                        const path = record.path;
+                        let history = false;
+                        if (latest.history) {
+                            history = latest.history.enabled;
+                            latest.history.enabled = false;
+                        }
+                        latest.removeValue(path, record.value);
+                        if (history) {
+                            latest.history.enabled = true;
+                        }
+                    }
+                }
+            });
+        }
+        execute();
+        this.applyingChange = false;
+    }
+    _removeValues(values) {
+        if (this.applyingChange)
+            return;
+        if (!this._observers)
+            return;
+        this.applyingChange = true;
+        // make copy of observers if we are using history
+        // so that we can undo on the same observers in the future
+        const observers = this._observers.slice();
+        const paths = this._paths.slice();
+        const records = [];
+        for (let i = 0; i < observers.length; i++) {
+            const path = this._pathAt(paths, i);
+            const observer = observers[i];
+            values.forEach((value) => {
+                const ind = observer.get(path).indexOf(value);
+                if (ind !== -1) {
+                    records.push({
+                        observer: observer,
+                        path: path,
+                        value: value,
+                        index: ind
+                    });
+                }
+            });
+        }
+        const execute = () => {
+            for (const record of records) {
+                const latest = record.observer.latest();
+                if (!latest)
+                    continue;
+                const path = record.path;
+                let history = false;
+                if (latest.history) {
+                    history = latest.history.enabled;
+                    latest.history.enabled = false;
+                }
+                latest.removeValue(path, record.value);
+                if (history) {
+                    latest.history.enabled = true;
+                }
+            }
+        };
+        if (this._history && records.length) {
+            this._history.add({
+                name: this._getHistoryActionName(paths),
+                redo: execute,
+                combine: this._historyCombine,
+                undo: () => {
+                    for (const record of records) {
+                        const latest = record.observer.latest();
+                        if (!latest)
+                            continue;
+                        const path = record.path;
+                        let history = false;
+                        if (latest.history) {
+                            history = latest.history.enabled;
+                            latest.history.enabled = false;
+                        }
+                        if (latest.get(path).indexOf(record.value) === -1) {
+                            latest.insert(path, record.value, record.index);
+                        }
+                        if (history) {
+                            latest.history.enabled = true;
+                        }
+                    }
+                }
+            });
+        }
+        execute();
+        this.applyingChange = false;
+    }
+    setValue(value) {
+        this._setValue(value, false);
+    }
+    setValues(values) {
+        // make sure we deep copy arrays because they will not be cloned when set to the observers
+        values = values.slice().map(val => (Array.isArray(val) ? val.slice() : val));
+        this._setValue(values, true);
+    }
+    addValue(value) {
+        this._addValues([value]);
+    }
+    addValues(values) {
+        this._addValues(values);
+    }
+    removeValue(value) {
+        this._removeValues([value]);
+    }
+    removeValues(values) {
+        this._removeValues(values);
+    }
+}
+
+export { BindingElementToObservers };

package/node_modules/@playcanvas/pcui/dist/module/src/binding/BindingObserversToElement/index.mjs

@@ -0,0 +1,110 @@
+import { BindingBase } from '../BindingBase/index.mjs';
+
+/**
+ * Provides one way binding between Observers and an {@link IBindable} element and Observers. Any
+ * changes from the observers will be propagated to the element.
+ */
+class BindingObserversToElement extends BindingBase {
+    /**
+     * Creates a new BindingObserversToElement instance.
+     *
+     * @param args - The arguments.
+     */
+    constructor(args = {}) {
+        super(args);
+        this._eventHandles = [];
+        this._updateTimeout = null;
+        this._deferUpdateElement = () => {
+            if (this.applyingChange)
+                return;
+            this.applyingChange = true;
+            this._updateTimeout = window.setTimeout(() => {
+                this._updateElement();
+            });
+        };
+        this._customUpdate = args.customUpdate;
+    }
+    _linkObserver(observer, path) {
+        this._eventHandles.push(observer.on(`${path}:set`, this._deferUpdateElement));
+        this._eventHandles.push(observer.on(`${path}:unset`, this._deferUpdateElement));
+        this._eventHandles.push(observer.on(`${path}:insert`, this._deferUpdateElement));
+        this._eventHandles.push(observer.on(`${path}:remove`, this._deferUpdateElement));
+    }
+    _updateElement() {
+        if (this._updateTimeout) {
+            window.clearTimeout(this._updateTimeout);
+            this._updateTimeout = null;
+        }
+        this._updateTimeout = null;
+        this.applyingChange = true;
+        if (!this._element)
+            return;
+        if (typeof this._customUpdate === 'function') {
+            this._customUpdate(this._element, this._observers, this._paths);
+        }
+        else if (this._observers.length === 1) {
+            if (this._paths.length > 1) {
+                // if using multiple paths for the single observer (e.g. curves)
+                // then return an array of values for each path
+                this._element.value = this._paths.map((path) => {
+                    return this._observers[0].has(path) ? this._observers[0].get(path) : undefined;
+                });
+            }
+            else {
+                this._element.value = (this._observers[0].has(this._paths[0]) ? this._observers[0].get(this._paths[0]) : undefined);
+            }
+        }
+        else {
+            this._element.values = this._observers.map((observer, i) => {
+                const path = this._pathAt(this._paths, i);
+                return observer.has(path) ? observer.get(path) : undefined;
+            });
+        }
+        this.applyingChange = false;
+    }
+    link(observers, paths) {
+        super.link(observers, paths);
+        // don't render changes when we link
+        if (this._element) {
+            const renderChanges = this._element.renderChanges;
+            this._element.renderChanges = false;
+            this._updateElement();
+            this._element.renderChanges = renderChanges;
+        }
+        if (this._observers.length === 1) {
+            if (this._paths.length > 1) {
+                for (let i = 0; i < this._paths.length; i++) {
+                    this._linkObserver(this._observers[0], this._paths[i]);
+                }
+                return;
+            }
+        }
+        for (let i = 0; i < this._observers.length; i++) {
+            this._linkObserver(this._observers[i], this._pathAt(this._paths, i));
+        }
+    }
+    /**
+     * Unlink the binding from its set of observers.
+     */
+    unlink() {
+        for (const event of this._eventHandles) {
+            event.unbind();
+        }
+        this._eventHandles.length = 0;
+        if (this._updateTimeout) {
+            window.clearTimeout(this._updateTimeout);
+            this._updateTimeout = null;
+        }
+        super.unlink();
+    }
+    /**
+     * Clone the BindingObserversToElement instance.
+     */
+    clone() {
+        return new BindingObserversToElement({
+            customUpdate: this._customUpdate
+        });
+    }
+}
+
+export { BindingObserversToElement };