vasille 1.2.9 → 2.0.0

package/lib/core/executor.js

@@ -0,0 +1,154 @@
+import { internalError, notOverwritten } from "./errors";
+/**
+ * Represents an executor unit interface
+ * @class Executor
+ */
+export class Executor {
+    /**
+     * Adds a CSS class
+     * @param el {Element} element to manipulate
+     * @param cl {string} class to be added
+     */
+    addClass(el, cl) {
+        throw notOverwritten();
+    }
+    /**
+     * Removes a CSS class
+     * @param el {Element} element to manipulate
+     * @param cl {string} class to be removed
+     */
+    removeClass(el, cl) {
+        throw notOverwritten();
+    }
+    /**
+     * Sets a tag attribute
+     * @param el {Element} element to manipulate
+     * @param name {string} name of attribute
+     * @param value {string} value of attribute
+     */
+    setAttribute(el, name, value) {
+        throw notOverwritten();
+    }
+    /**
+     * Removes a tag attribute
+     * @param el {Element} element to manipulate
+     * @param name {string} name of attribute
+     */
+    removeAttribute(el, name) {
+        throw notOverwritten();
+    }
+    /**
+     * Sets a style attribute
+     * @param el {HTMLElement} element to manipulate
+     * @param prop {string} property name
+     * @param value {string} property value
+     */
+    setStyle(el, prop, value) {
+        throw notOverwritten();
+    }
+    /**
+     * Inserts a child before target
+     * @param target {Element} target element
+     * @param child {Node} element to insert before
+     */
+    insertBefore(target, child) {
+        throw notOverwritten();
+    }
+    /**
+     * Appends a child to element
+     * @param el {Element} element
+     * @param child {Node} child to be inserted
+     */
+    appendChild(el, child) {
+        throw notOverwritten();
+    }
+    /**
+     * Calls a call-back function
+     * @param cb {function} call-back function
+     */
+    callCallback(cb) {
+        throw notOverwritten();
+    }
+}
+/**
+ * Executor which execute any commands immediately
+ * @class InstantExecutor
+ * @extends Executor
+ */
+export class InstantExecutor extends Executor {
+    addClass(el, cl) {
+        el.classList.add(cl);
+    }
+    removeClass(el, cl) {
+        el.classList.remove(cl);
+    }
+    setAttribute(el, name, value) {
+        el.setAttribute(name, value);
+    }
+    removeAttribute(el, name) {
+        el.removeAttribute(name);
+    }
+    setStyle(el, prop, value) {
+        el.style.setProperty(prop, value);
+    }
+    insertBefore(target, child) {
+        const parent = target.parentNode;
+        if (!parent) {
+            throw internalError('element don\'t have a parent node');
+        }
+        parent.insertBefore(child, target);
+    }
+    appendChild(el, child) {
+        el.appendChild(child);
+    }
+    callCallback(cb) {
+        cb();
+    }
+}
+/**
+ * Executor which execute any commands over timeout
+ * @class TimeoutExecutor
+ * @extends InstantExecutor
+ */
+export class TimeoutExecutor extends InstantExecutor {
+    addClass(el, cl) {
+        setTimeout(() => {
+            super.addClass(el, cl);
+        }, 0);
+    }
+    removeClass(el, cl) {
+        setTimeout(() => {
+            super.removeClass(el, cl);
+        }, 0);
+    }
+    setAttribute(el, name, value) {
+        setTimeout(() => {
+            super.setAttribute(el, name, value);
+        }, 0);
+    }
+    removeAttribute(el, name) {
+        setTimeout(() => {
+            super.removeAttribute(el, name);
+        }, 0);
+    }
+    setStyle(el, prop, value) {
+        setTimeout(() => {
+            super.setStyle(el, prop, value);
+        }, 0);
+    }
+    insertBefore(target, child) {
+        setTimeout(() => {
+            super.insertBefore(target, child);
+        }, 0);
+    }
+    appendChild(el, child) {
+        setTimeout(() => {
+            super.appendChild(el, child);
+        }, 0);
+    }
+    callCallback(cb) {
+        setTimeout(cb, 0);
+    }
+}
+export const instantExecutor = new InstantExecutor();
+export const timeoutExecutor = new TimeoutExecutor();

package/lib/core/ivalue.js

@@ -0,0 +1,56 @@
+import { Destroyable } from "./destroyable.js";
+import { notOverwritten } from "./errors";
+/**
+ * Interface which describes a value
+ * @class IValue
+ * @extends Destroyable
+ */
+export class IValue extends Destroyable {
+    /**
+     * @param isEnabled {boolean} initial is enabled state
+     */
+    constructor(isEnabled) {
+        super();
+        this.isEnabled = isEnabled;
+    }
+    /**
+     * Get the encapsulated value
+     * @return {*} the encapsulated value
+     */
+    get $() {
+        throw notOverwritten();
+    }
+    /**
+     * Sets the encapsulated value
+     * @param value {*} value to encapsulate
+     */
+    set $(value) {
+        throw notOverwritten();
+    }
+    /**
+     * Add a new handler to value change
+     * @param handler {function(value : *)} the handler to add
+     */
+    on(handler) {
+        throw notOverwritten();
+    }
+    /**
+     * Removes a handler of value change
+     * @param handler {function(value : *)} the handler to remove
+     */
+    off(handler) {
+        throw notOverwritten();
+    }
+    /**
+     * Enable update handlers triggering
+     */
+    enable() {
+        throw notOverwritten();
+    }
+    /**
+     * disable update handlers triggering
+     */
+    disable() {
+        throw notOverwritten();
+    }
+}

package/lib/core/signal.js

@@ -0,0 +1,50 @@
+/**
+ * Signal is an event generator
+ * @class Signal
+ */
+export class Signal {
+    constructor() {
+        /**
+         * Handler of event
+         * @type {Set}
+         * @private
+         */
+        this.handlers = new Set;
+    }
+    /**
+     * Emit event
+     * @param a1 {*} argument
+     * @param a2 {*} argument
+     * @param a3 {*} argument
+     * @param a4 {*} argument
+     * @param a5 {*} argument
+     * @param a6 {*} argument
+     * @param a7 {*} argument
+     * @param a8 {*} argument
+     * @param a9 {*} argument
+     */
+    emit(a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        this.handlers.forEach(handler => {
+            try {
+                handler(a1, a2, a3, a4, a5, a6, a7, a8, a9);
+            }
+            catch (e) {
+                console.error(`Vasille.js: Handler throw exception: `, e);
+            }
+        });
+    }
+    /**
+     * Subscribe to event
+     * @param func {function} handler
+     */
+    subscribe(func) {
+        this.handlers.add(func);
+    }
+    /**
+     * Unsubscribe from event
+     * @param func {function} handler
+     */
+    unsubscribe(func) {
+        this.handlers.delete(func);
+    }
+}

package/lib/core/slot.js

@@ -0,0 +1,47 @@
+/**
+ * Component slot
+ * @class Slot
+ */
+export class Slot {
+    /**
+     * Sets the runner
+     * @param func {function} the function to run
+     */
+    insert(func) {
+        this.runner = func;
+    }
+    /**
+     * @param a0 {Fragment} node to paste content
+     * @param a1 {*} 1st argument
+     * @param a2 {*} 2nd argument
+     * @param a3 {*} 3rd argument
+     * @param a4 {*} 4th argument
+     * @param a5 {*} 5th argument
+     * @param a6 {*} 6th argument
+     * @param a7 {*} 7th argument
+     * @param a8 {*} 8th argument
+     * @param a9 {*} 9th argument
+     */
+    release(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        if (this.runner) {
+            this.runner(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
+        }
+    }
+    /**
+     * Predefine a handler for a slot
+     * @param func {function(node : Fragment)} Function to run if no handler specified
+     * @param a0 {Fragment} node to paste content
+     * @param a1 {*} 1st argument
+     * @param a2 {*} 2nd argument
+     * @param a3 {*} 3rd argument
+     * @param a4 {*} 4th argument
+     * @param a5 {*} 5th argument
+     * @param a6 {*} 6th argument
+     * @param a7 {*} 7th argument
+     * @param a8 {*} 8th argument
+     * @param a9 {*} 9th argument
+     */
+    predefine(func, a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        (this.runner || func)(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
+    }
+}

package/lib/index.js

@@ -1,22 +1,27 @@
-import { Expression }                                      from "./bind.js";
-import { Destroyable }                                     from "./interfaces/destroyable.js";
-import { IBind }                                           from "./interfaces/ibind.js";
-import { IValue }                                          from "./interfaces/ivalue.js";
-import { ArrayModel, MapModel, ObjectModel, SetModel }     from "./models.js";
-import { App, INode, Extension, Tag, TextNode, Component } from "./node.js";
-import { Pointer, Reference }                              from "./value.js";
-import { ArrayView, MapView, ObjectView, SetView }         from "./views.js";
-
-
-
-export {
-    Expression,
-    Destroyable,
-    IBind, IValue,
-    ArrayModel, MapModel, ObjectModel, SetModel,
-    App, INode, Tag, Extension, TextNode, Component,
-    Pointer, Reference,
-    ArrayView, MapView, ObjectView, SetView
-};
-
-//# sourceMappingURL=index.js.map
+import { Destroyable } from "./core/destroyable";
+import { Executor, InstantExecutor, TimeoutExecutor } from "./core/executor";
+import { Reactive } from "./core/core";
+import { IValue } from "./core/ivalue";
+import { Signal } from "./core/signal";
+import { Slot } from "./core/slot";
+import { ArrayModel } from "./models/array-model";
+import { Listener } from "./models/listener";
+import { MapModel } from "./models/map-model";
+import { ObjectModel } from "./models/object-model";
+import { SetModel } from "./models/set-model";
+import { App, AppNode } from "./node/app";
+import { Interceptor, InterceptorNode } from "./node/interceptor";
+import { Component, Extension, Fragment, INode, Tag } from "./node/node";
+import { Expression } from "./value/expression";
+import { Mirror } from "./value/mirror";
+import { Pointer } from "./value/pointer";
+import { Reference } from "./value/reference";
+import { ArrayView } from "./views/array-view";
+import { BaseView } from "./views/base-view";
+import { MapView } from "./views/map-view";
+import { ObjectView } from "./views/object-view";
+import { RepeatNode } from "./views/repeat-node";
+import { Repeater } from "./views/repeater";
+import { SetView } from "./views/set-view";
+import { Binding } from "./binding/binding";
+export { Destroyable, IValue, Reference, Mirror, Pointer, ArrayModel, MapModel, ObjectModel, SetModel, RepeatNode, Repeater, BaseView, Listener, ArrayView, MapView, ObjectView, SetView, Fragment, INode, Tag, Component, Extension, AppNode, App, Executor, InstantExecutor, TimeoutExecutor, Signal, Slot, Interceptor, InterceptorNode, Expression, Binding, Reactive, };

package/lib/models/array-model.js

@@ -0,0 +1,208 @@
+import { Listener } from "./listener";
+/**
+ * Model based on Array class
+ * @extends Array
+ * @implements IModel
+ */
+export class ArrayModel extends Array {
+    /**
+     * @param data {Array} input data
+     */
+    constructor(data = []) {
+        super();
+        Object.defineProperty(this, 'listener', {
+            value: new Listener,
+            writable: false,
+            configurable: false
+        });
+        for (let i = 0; i < data.length; i++) {
+            super.push(data[i]);
+        }
+    }
+    /* Array members */
+    /**
+     * Gets the last item of array
+     * @return {*} the last item of array
+     */
+    get last() {
+        return this.length ? this[this.length - 1] : null;
+    }
+    /**
+     * Calls Array.fill and notify about changes
+     * @param value {*} value to fill with
+     * @param start {?number} begin index
+     * @param end {?number} end index
+     */
+    fill(value, start, end) {
+        if (!start) {
+            start = 0;
+        }
+        if (!end) {
+            end = this.length;
+        }
+        for (let i = start; i < end; i++) {
+            this.listener.emitRemoved(this[i], this[i]);
+            this[i] = value;
+            this.listener.emitAdded(value, value);
+        }
+        return this;
+    }
+    /**
+     * Calls Array.pop and notify about changes
+     * @return {*} removed value
+     */
+    pop() {
+        const v = super.pop();
+        if (v !== undefined) {
+            this.listener.emitRemoved(v, v);
+        }
+        return v;
+    }
+    /**
+     * Calls Array.push and notify about changes
+     * @param items {...*} values to push
+     * @return {number} new length of array
+     */
+    push(...items) {
+        items.forEach(item => {
+            this.listener.emitAdded(item, item);
+            super.push(item);
+        });
+        return this.length;
+    }
+    /**
+     * Calls Array.shift and notify about changed
+     * @return {*} the shifted value
+     */
+    shift() {
+        const v = super.shift();
+        if (v !== undefined) {
+            this.listener.emitRemoved(v, v);
+        }
+        return v;
+    }
+    /**
+     * Calls Array.splice and notify about changed
+     * @param start {number} start index
+     * @param deleteCount {?number} delete count
+     * @param items {...*}
+     * @return {ArrayModel} a pointer to this
+     */
+    splice(start, deleteCount, ...items) {
+        start = Math.min(start, this.length);
+        deleteCount = deleteCount || this.length - start;
+        const before = this[start + deleteCount];
+        for (let i = 0; i < deleteCount; i++) {
+            const index = start + deleteCount - i - 1;
+            if (this[index] !== undefined) {
+                this.listener.emitRemoved(this[index], this[index]);
+            }
+        }
+        for (let i = 0; i < items.length; i++) {
+            this.listener.emitAdded(before, items[i]);
+        }
+        return new ArrayModel(super.splice(start, deleteCount, ...items));
+    }
+    /**
+     * Calls Array.unshift and notify about changed
+     * @param items {...*} values to insert
+     * @return {number} the length after prepend
+     */
+    unshift(...items) {
+        for (let i = 0; i < items.length; i++) {
+            this.listener.emitAdded(this[i], items[i]);
+        }
+        return super.unshift(...items);
+    }
+    /**
+     * Inserts a value to the end of array
+     * @param v {*} value to insert
+     */
+    append(v) {
+        this.listener.emitAdded(null, v);
+        super.push(v);
+        return this;
+    }
+    /**
+     * Clears array
+     * @return {this} a pointer to this
+     */
+    clear() {
+        this.forEach(v => {
+            this.listener.emitRemoved(v, v);
+        });
+        super.splice(0);
+        return this;
+    }
+    /**
+     * Inserts a value to position `index`
+     * @param index {number} index to insert value
+     * @param v {*} value to insert
+     * @return {this} a pointer to this
+     */
+    insert(index, v) {
+        this.listener.emitAdded(this[index], v);
+        super.splice(index, 0, v);
+        return this;
+    }
+    /**
+     * Inserts a value to the beginning of array
+     * @param v {*} value to insert
+     * @return {this} a pointer to this
+     */
+    prepend(v) {
+        this.listener.emitAdded(this[0], v);
+        super.unshift(v);
+        return this;
+    }
+    /**
+     * Removes a value from an index
+     * @param index {number} index of value to remove
+     * @return {this} a pointer to this
+     */
+    removeAt(index) {
+        if (index > 0 && index < this.length) {
+            this.listener.emitRemoved(this[index], this[index]);
+            super.splice(index, 1);
+        }
+        return this;
+    }
+    /**
+     * Removes the first value of array
+     * @return {this} a pointer to this
+     */
+    removeFirst() {
+        if (this.length) {
+            this.listener.emitRemoved(this[0], this[0]);
+            super.shift();
+        }
+        return this;
+    }
+    /**
+     * Removes the ast value of array
+     * @return {this} a pointer to this
+     */
+    removeLast() {
+        const last = this.last;
+        if (last != null) {
+            this.listener.emitRemoved(this[this.length - 1], last);
+            super.pop();
+        }
+        return this;
+    }
+    /**
+     * Remove the first occurrence of value
+     * @param v {*} value to remove
+     * @return {this}
+     */
+    removeOne(v) {
+        this.removeAt(this.indexOf(v));
+        return this;
+    }
+    enableReactivity() {
+        this.listener.enableReactivity();
+    }
+    disableReactivity() {
+        this.listener.disableReactivity();
+    }
+}

package/lib/models/listener.js

@@ -0,0 +1,130 @@
+/**
+ * Represent a listener for a model
+ * @class Listener
+ */
+export class Listener {
+    constructor() {
+        Object.defineProperties(this, {
+            onAdded: {
+                value: new Set,
+                writable: false,
+                configurable: false
+            },
+            onRemoved: {
+                value: new Set,
+                writable: false,
+                configurable: false
+            },
+            frozen: {
+                value: false,
+                writable: true,
+                configurable: false
+            },
+            queue: {
+                value: [],
+                writable: false,
+                configurable: false
+            }
+        });
+    }
+    /**
+     * Exclude the repeated operation in queue
+     * @private
+     */
+    excludeRepeat(index) {
+        this.queue.forEach((item, i) => {
+            if (item.index === index) {
+                this.queue.splice(i, 1);
+                return true;
+            }
+        });
+        return false;
+    }
+    /**
+     * Emits added event to listeners
+     * @param index {*} index of value
+     * @param value {*} value of added item
+     */
+    emitAdded(index, value) {
+        if (this.frozen) {
+            if (!this.excludeRepeat(index)) {
+                this.queue.push({ sign: true, index, value });
+            }
+        }
+        else {
+            this.onAdded.forEach(handler => {
+                handler(index, value);
+            });
+        }
+    }
+    /**
+     * Emits removed event to listeners
+     * @param index {*} index of removed value
+     * @param value {*} value of removed item
+     */
+    emitRemoved(index, value) {
+        if (this.frozen) {
+            if (!this.excludeRepeat(index)) {
+                this.queue.push({ sign: false, index, value });
+            }
+        }
+        else {
+            this.onRemoved.forEach(handler => {
+                handler(index, value);
+            });
+        }
+    }
+    /**
+     * Adds a handler to added event
+     * @param handler {function} function to run on event emitting
+     */
+    onAdd(handler) {
+        this.onAdded.add(handler);
+    }
+    /**
+     * Adds a handler to removed event
+     * @param handler {function} function to run on event emitting
+     */
+    onRemove(handler) {
+        this.onRemoved.add(handler);
+    }
+    /**
+     * Removes an handler from added event
+     * @param handler {function} handler to remove
+     */
+    offAdd(handler) {
+        this.onAdded.delete(handler);
+    }
+    /**
+     * Removes an handler form removed event
+     * @param handler {function} handler to remove
+     */
+    offRemove(handler) {
+        this.onRemoved.delete(handler);
+    }
+    /**
+     * Run all queued operation and enable reactivity
+     */
+    enableReactivity() {
+        this.queue.forEach(item => {
+            if (item.sign) {
+                this.onAdded.forEach(handler => {
+                    handler(item.index, item.value);
+                });
+            }
+            else {
+                this.onRemoved.forEach(handler => {
+                    handler(item.index, item.value);
+                });
+            }
+        });
+        this.queue.splice(0);
+        this.frozen = false;
+    }
+    /**
+     * Disable the reactivity and enable the queue
+     */
+    disableReactivity() {
+        this.frozen = true;
+    }
+}