vsn 0.1.26 → 0.1.29

package/src/SimplePromise.ts

@@ -0,0 +1,219 @@
+import {EventDispatcher} from "./EventDispatcher";
+
+export interface IDeferred<T> {
+    [key: string]: any;
+    promise: SimplePromise<T>;
+    resolve(result?: T): void;
+    reject(reason: string): void;
+}
+
+export type TResolve<T> = (result: T) => void;
+export type TReject = (reason: string) => void;
+export type TResult<T> = T | string | null;
+
+export enum EPromiseStates {
+    PENDING,
+    FULFILLED,
+    REJECTED
+}
+
+export interface IPromise<T> extends EventDispatcher {
+    state: EPromiseStates;
+    result: TResult<T>;
+    then<X = T>(success?: (result?: T) => X, error?: (reason?: string) => string): IPromise<X>;
+    catch(onRejected: (reason: string) => string): IPromise<string>;
+    finally<X = T>(finallyCallback: (result: T | string) => X | string): IPromise<X>;
+}
+
+export function noop<T = any>(result?: T): T { return result as T; }
+
+export class SimplePromise<T> extends EventDispatcher implements IPromise<T> {
+    protected _state: EPromiseStates;
+    protected _result: TResult<T>  = null;
+    private promiseClass: typeof SimplePromise;
+
+    constructor(executor: (resolve: TResolve<T>, reject: TReject) => void) {
+        super();
+        this._state = EPromiseStates.PENDING;
+        this.promiseClass = (Object.getPrototypeOf(this).constructor);
+        try {
+            executor(this._resolve.bind(this), this._reject.bind(this));
+        } catch (e) {
+            this._reject(e);
+        }
+    }
+
+    public get state(): EPromiseStates {
+        return this._state;
+    }
+
+    public get result(): TResult<T> {
+        return this._result;
+    }
+
+    public static defer<T>(): IDeferred<T> {
+        const promise: SimplePromise<T> = new SimplePromise<T>((res, rej) => {});
+
+        return {
+            promise: promise,
+            resolve: promise._resolve.bind(promise),
+            reject: promise._reject.bind(promise)
+        };
+    }
+
+    /*
+     * Returns a Promise object that is resolved with the given value. If the value is a thenable (i.e. has a then
+     * method), the returned promise will "follow" that thenable, adopting its eventual state; otherwise the returned
+     * promise will be fulfilled with the value. Generally, if you don't know if a value is a promise or not,
+     * Promise.resolve(value) it instead and work with the return value as a promise.
+     */
+    public static resolve<T>(result?: T): IPromise<T> {
+        return new SimplePromise<T>((resolve: TResolve<T>): void => {
+            if (result instanceof SimplePromise) {
+                result.then((innerResult: T) => {
+                    resolve(innerResult);
+                });
+            } else {
+                resolve(result);
+            }
+        });
+    }
+
+    /*
+     * Returns a Promise object that is rejected with the given reason.
+     */
+    public static reject(reason: string): IPromise<void> {
+        return new SimplePromise<void>((resolve: TResolve<void>, reject: TReject): void => {
+            reject(reason);
+        });
+    }
+
+    /*
+     * Returns a promise that either fulfills when all of the promises in the iterable argument have fulfilled or
+     * rejects as soon as one of the promises in the iterable argument rejects. If the returned promise fulfills, it is
+     * fulfilled with an array of the values from the fulfilled promises in the same order as defined in the iterable.
+     * If the returned promise rejects, it is rejected with the reason from the first promise in the iterable that
+     * rejected. This method can be useful for aggregating results of multiple promises.
+     */
+    public static all<T>(iter: IPromise<T>[]): IPromise<T[]> {
+        const deferred: IDeferred<T[]> = SimplePromise.defer<T[]>();
+        let done: boolean = true;
+        for (const promise of iter) {
+            if (promise.state == EPromiseStates.PENDING) {
+                done = false;
+                promise.once('fulfilled', (result: T): void => {
+                    SimplePromise.poolResults(iter, deferred);
+                });
+
+                promise.once('rejected', (reason: string): void => {
+                    deferred.reject(reason);
+                });
+            } else if(promise.state == EPromiseStates.REJECTED) {
+                deferred.reject(promise.result as string);
+                done = false;
+                break;
+            }
+        }
+
+        if (done)
+            SimplePromise.poolResults(iter, deferred);
+
+        return deferred.promise;
+    }
+
+    public static poolResults<T>(iter: IPromise<T>[], deferred: IDeferred<T[]>) {
+        let done: boolean = true;
+        const results: T[] = [];
+        for (const p of iter) {
+            if (p.state === EPromiseStates.REJECTED) {
+                deferred.reject(p.result as string);
+                break;
+            } else if (p.state === EPromiseStates.PENDING) {
+                done = false;
+            }
+            results.push(p.result as T);
+        }
+        if (done)
+            deferred.resolve(results);
+    }
+
+    /*
+     * Returns a promise that fulfills or rejects as soon as one of the promises in the iterable fulfills or rejects,
+     * with the value or reason from that promise.
+     */
+    public static race<T>(iter: IPromise<T>[]): IPromise<T> {
+        const deferred: IDeferred<T> = SimplePromise.defer<T>();
+
+        for (const promise of iter) {
+            promise.once('fulfilled', (result: T) => {
+                deferred.resolve(result);
+            });
+
+            promise.once('rejected', (reason: string) => {
+                deferred.reject(reason);
+            });
+        }
+
+        return deferred.promise;
+    }
+
+    /*
+     * Appends fulfillment and rejection handlers to the promise, and returns a new promise resolving to the return
+     * value of the called handler, or to its original settled value if the promise was not handled (i.e. if the
+     * relevant handler onFulfilled or onRejected is not a function).
+     */
+    public then<X = T>(success?: (result: T) => X, error?: (reason: string) => string): IPromise<X> {
+        return new this.promiseClass<X>((resolve: TResolve<X>, reject: TReject): void => {
+            if (this.state === EPromiseStates.FULFILLED) {
+                if (success)
+                    resolve(success(this.result as T));
+            } else if (this.state === EPromiseStates.REJECTED) {
+                if (error)
+                    reject(error(this.result as string));
+            } else {
+                this.once('fulfilled', (result: T): void => {
+                    if (success)
+                        resolve(success(result));
+                });
+
+                this.once('rejected', (reason: string): void => {
+                    if (error)
+                        reject(error(reason));
+                });
+            }
+        });
+    }
+
+    /*
+     * Appends a rejection handler callback to the promise, and returns a new promise resolving to the return value of
+     * the callback if it is called, or to its original fulfillment value if the promise is instead fulfilled.
+     */
+    public catch(onRejected: (reason: string) => string): IPromise<string> {
+        return this.then<string>(undefined, onRejected);
+    }
+
+    /*
+     * Appends a handler to the promise, and returns a new promise which is resolved when the original promise is
+     * resolved. The handler is called when the promise is settled, whether fulfilled or rejected.
+     */
+    public finally<X = T>(finallyCallback: (result: T | string) => X | string): IPromise<X> {
+        const success: (r: T) => X = (result: T): X => finallyCallback(result) as X;
+        const error: (r: string) => string = (reason: string): string => finallyCallback(reason) as string;
+
+        return this.then<X>(success, error);
+    }
+
+    protected _resolve(result: T): void {
+        if (this.state !== EPromiseStates.PENDING) return;
+        this._state = EPromiseStates.FULFILLED;
+        this._result = result;
+        this.dispatch('fulfilled', result);
+    }
+
+    protected _reject(reason: string): void {
+        if (this.state !== EPromiseStates.PENDING) return;
+        this._state = EPromiseStates.REJECTED;
+        this._result = reason;
+        this.dispatch('rejected', reason);
+    }
+}

package/src/Tag.ts

@@ -122,7 +122,7 @@ export class Tag extends DOMObject {
         for (const attr of this.attributes) {
             attr.mutate(mutation);
         }
-        this.trigger('mutate', mutation);
+        this.dispatch('mutate', mutation);
     }
 
     public get(attr: string) {
@@ -254,11 +254,11 @@ export class Tag extends DOMObject {
         if (obj instanceof Controller) {
             obj.init(this.scope, this, this.element);
         } else {
-            this.scope.wrap(obj, triggerUpdates, updateFromWrapped);
             obj['$scope'] = this.scope;
             obj['$tag'] = this;
             obj['$el'] = this.element;
         }
+        this.scope.wrap(obj, triggerUpdates, updateFromWrapped);
         return obj;
     }
 
@@ -348,7 +348,7 @@ export class Tag extends DOMObject {
                 if (defer && attrClass.canDefer) {
                     await attrObj.defer();
                     this.deferredAttributes.push(attrObj);
-                    attrObj.bind('state', this.onAttributeStateChange.bind(this));
+                    attrObj.on('state', this.onAttributeStateChange.bind(this));
                 }
             }
         }

package/src/Types.ts

@@ -1,9 +1,14 @@
 import {Registry} from "./Registry";
 
 export class Types {
+    @Registry.type('any')
+    public static any(value: any): any {
+        return value as any;
+    }
+
     @Registry.type('string')
     public static string(value: string) {
-        return value;
+        return `${value}`;
     }
 
     @Registry.type('integer')

package/src/Validators.ts

@@ -0,0 +1,45 @@
+import {Registry} from "./Registry";
+
+export class Validators {
+    public static readonly _emailRegex = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
+
+    @Registry.validator('email')
+    public static email(value: any): string[] {
+        const errors: string[] = [];
+
+        if(value != null && !this._emailRegex.test(value))
+            errors.push('Please enter a valid email address');
+
+        return errors;
+    }
+
+    @Registry.validator('required')
+    public static required(value: any): string[] {
+        const errors: string[] = [];
+
+        if(value == null || value.length == 0)
+            errors.push('This field is required');
+
+        return errors;
+    }
+
+    @Registry.validator('positive')
+    public static positive(value: any): string[] {
+        const errors: string[] = [];
+
+        if(value != null && value < 0)
+            errors.push('Please enter a positive number');
+
+        return errors;
+    }
+
+    @Registry.validator('negative')
+    public static negative(value: any): string[] {
+        const errors: string[] = [];
+
+        if(value != null && value > 0)
+            errors.push('Please enter a negative number');
+
+        return errors;
+    }
+}

package/src/attributes/Bind.ts

@@ -1,7 +1,8 @@
-import {Scope, ScopeReference} from "../Scope";
+import {Scope} from "../Scope";
 import {Attribute} from "../Attribute";
 import {Tree} from "../AST";
 import {Registry} from "../Registry";
+import {ScopeReference} from "../Scope/ScopeReference";
 
 @Registry.attribute('vsn-bind')
 export class Bind extends Attribute {
@@ -19,7 +20,7 @@ export class Bind extends Attribute {
     }
 
     public async setup() {
-        this.property = this.getAttributeBinding();
+        this.property = this.getAttributeBinding(this.property);
         const mods = this.getAttributeModifiers();
         if (mods.length) {
             if (mods.indexOf('from') > -1) {
@@ -53,7 +54,7 @@ export class Bind extends Attribute {
     public async connect() {
         if (this.doUpdateTo) {
             this.updateTo();
-            this.boundScope.bind(`change:${this.key}`, this.updateTo, this);
+            this.boundScope.on(`change:${this.key}`, this.updateTo, this);
         }
         await super.connect();
     }
@@ -90,7 +91,6 @@ export class Bind extends Attribute {
 
     public mutate(mutation: MutationRecord) {
         super.mutate(mutation);
-
         if (!this.doUpdateFrom) return;
 
         // Element innerText binding

package/src/attributes/ClassConstructor.ts

@@ -8,6 +8,7 @@ export class ClassConstructor extends Attribute {
     public static readonly scoped: boolean = true;
     protected attributeKey: string;
     protected className: string;
+    protected defaultClassName: string;
 
     public async setup() {
         const parentScope: Scope = this.tag.parentTag.scope;
@@ -15,7 +16,7 @@ export class ClassConstructor extends Attribute {
             return;
 
         this.attributeKey = this.getAttributeBinding();
-        this.className = this.getAttributeValue();
+        this.className = this.getAttributeValue(this.defaultClassName);
 
         const cls = await Registry.instance.classes.get(this.className);
         this.instantiateClass(cls);

package/src/attributes/JSONAttribute.ts

@@ -1,6 +1,7 @@
 import {Registry} from "../Registry";
 import {Attribute} from "../Attribute";
-import {Scope, ScopeReference} from "../Scope";
+import {Scope} from "../Scope";
+import {ScopeReference} from "../Scope/ScopeReference";
 
 @Registry.attribute('vsn-json')
 export class JSONAttribute extends Attribute {

package/src/attributes/List.ts

@@ -1,6 +1,6 @@
 import {Attribute} from "../Attribute";
 import {Tag} from "../Tag";
-import {WrappedArray} from "../Scope";
+import {WrappedArray} from "../Scope/WrappedArray";
 import {Tree} from "../AST";
 import {ElementHelper} from "../helpers/ElementHelper";
 import {Registry} from "../Registry";
@@ -84,10 +84,10 @@ export class List extends Attribute {
             this.items = new WrappedArray(this.items);
         }
 
-        (this.items as WrappedArray<any>).bind('add', (item) => {
+        (this.items as WrappedArray<any>).on('add', (item) => {
             this.add(item);
         });
-        (this.items as WrappedArray<any>).bind('remove', (item) => {
+        (this.items as WrappedArray<any>).on('remove', (item) => {
             this.remove(item);
         });
 
@@ -137,6 +137,6 @@ export class List extends Attribute {
             tag.wrap(obj);
         }
 
-        this.tag.trigger('add', obj);
+        this.tag.dispatch('add', obj);
     }
 }

package/src/attributes/Radio.ts

@@ -1,6 +1,7 @@
 import {Registry} from "../Registry";
 import {Attribute} from "../Attribute";
-import {Scope, ScopeReference} from "../Scope";
+import {Scope} from "../Scope";
+import {ScopeReference} from "../Scope/ScopeReference";
 
 
 @Registry.attribute('vsn-radio')
@@ -31,7 +32,7 @@ export class Radio extends Attribute {
     }
 
     public async connect() {
-        this.boundScope.bind(`change:${this.key}`, this.checkSelected, this);
+        this.boundScope.on(`change:${this.key}`, this.checkSelected, this);
         this.tag.addEventHandler('change', this.getAttributeModifiers(), this.handleEvent.bind(this));
         await this.checkSelected();
         await super.connect();

package/src/attributes/ScopeChange.ts

@@ -1,6 +1,6 @@
 import {Attribute} from "../Attribute";
 import {Tree} from "../AST";
-import {ScopeReference} from "../Scope";
+import {ScopeReference} from "../Scope/ScopeReference";
 import {Registry} from "../Registry";
 
 @Registry.attribute('vsn-scope-change')
@@ -18,7 +18,7 @@ export abstract class ScopeChange extends Attribute {
     public async connect() {
         const binding = this.getAttributeBinding();
         const ref: ScopeReference = this.tag.scope.getReference(binding, false);
-        (await ref.getScope()).bind(`change:${await ref.getKey()}`, this.handleEvent.bind(this));
+        (await ref.getScope()).on(`change:${await ref.getKey()}`, this.handleEvent.bind(this));
         await super.connect();
     }
 

package/src/attributes/SetAttribute.ts

@@ -1,6 +1,7 @@
-import {Scope, ScopeReference} from "../Scope";
+import {Scope} from "../Scope";
 import {Attribute} from "../Attribute";
 import {Registry} from "../Registry";
+import {ScopeReference} from "../Scope/ScopeReference";
 
 @Registry.attribute('vsn-set')
 export class SetAttribute extends Attribute {

package/src/attributes/StandardAttribute.ts

@@ -22,7 +22,7 @@ export class StandardAttribute extends Attribute {
     }
 
     public async connect() {
-        this.tag.scope.bind(`change:${this.key}`, this.updateTo.bind(this));
+        this.tag.scope.on(`change:${this.key}`, this.updateTo.bind(this));
         await super.connect();
     }
 

package/src/attributes/StyleAttribute.ts

@@ -1,6 +1,7 @@
 import {Registry} from "../Registry";
 import {Attribute} from "../Attribute";
-import {Scope, ScopeReference} from "../Scope";
+import {Scope} from "../Scope";
+import {ScopeReference} from "../Scope/ScopeReference";
 
 
 @Registry.attribute('vsn-styles')
@@ -28,7 +29,7 @@ export class StyleAttribute extends Attribute {
     }
 
     public async connect() {
-        this.styleScope.bind(`change`, this.handleEvent.bind(this));
+        this.styleScope.on(`change`, this.handleEvent.bind(this));
         await super.connect();
     }
 

package/src/attributes/TypeAttribute.ts

@@ -1,5 +1,5 @@
 import {Attribute} from "../Attribute";
-import {ScopeReference} from "../Scope";
+import {ScopeReference} from "../Scope/ScopeReference";
 import {Registry} from "../Registry";
 
 @Registry.attribute('vsn-type')

package/src/vsn.ts

@@ -1,7 +1,5 @@
 import {DOM} from "./DOM";
-import {EventDispatcher} from "simple-ts-event-dispatcher";
-import {WrappedArray} from "./Scope";
-import {DataModel} from "simple-ts-models";
+import {WrappedArray} from "./Scope/WrappedArray";
 import {Registry} from "./Registry";
 import "./Types";
 import "./Formats";
@@ -9,6 +7,10 @@ import {Configuration} from "./Configuration";
 import {VisionHelper} from "./helpers/VisionHelper";
 import {Tree} from "./AST";
 import {Query} from "./Query";
+import {EventDispatcher} from "./EventDispatcher";
+import {DynamicScopeData} from "./Scope/DynamicScopeData";
+import {Controller} from "./Controller";
+import {property} from "./Scope/properties/Property";
 
 export class Vision extends EventDispatcher {
     protected static _instance: Vision;
@@ -28,7 +30,7 @@ export class Vision extends EventDispatcher {
         }
         this.registry.classes.register('Object', Object);
         this.registry.classes.register('WrappedArray', WrappedArray);
-        this.registry.classes.register('DataModel', DataModel);
+        this.registry.classes.register('Data', DynamicScopeData);
 
         if (VisionHelper.window) {
             window['Vision'] = Vision;
@@ -72,6 +74,15 @@ export * from './Registry';
 export * from './Attribute';
 export * from './AST';
 export {DOM} from './DOM';
-export {WrappedArray, Scope, ScopeReference} from './Scope';
+export {Scope} from './Scope';
+export {ScopeReference} from './Scope/ScopeReference';
+export {WrappedArray} from './Scope/WrappedArray';
 export {Controller} from './Controller';
+export {Property, property} from './Scope/properties/Property';
+export {Field} from './Model/Field';
+export {Model} from './Model';
+export {EventDispatcher} from './EventDispatcher';
+export {MessageList} from './MessageList';
+export {SimplePromise} from './SimplePromise';
+export {Tag} from './Tag';
 export const vision: Vision = Vision.instance;

package/test/AST/ArithmeticAssignmentNode.spec.ts

@@ -0,0 +1,47 @@
+import {SimplePromise} from "../../src/SimplePromise";
+import {DOM} from "../../src/DOM";
+import {Tree} from "../../src/AST";
+import {Scope} from "../../src/Scope";
+
+
+describe('ArithmeticAssignmentNode', () => {
+    it("should support simple arithmetic with numbers", async () => {
+        const tree = new Tree(`
+            a = 1;
+            a += 10;
+            b = a + 1;
+            b -= 10;
+            c = a + 1;
+            c /= 2;
+            d = a + 1;
+            d *= 2;
+        `);
+        const scope = new Scope();
+        await tree.evaluate(scope, null, null);
+        expect(scope.get("a")).toBe(11);
+        expect(scope.get("b")).toBe(2);
+        expect(scope.get("c")).toBe(6);
+        expect(scope.get("d")).toBe(24);
+    });
+
+    it("should support simple arithmetic with numbers inside nested objects", async () => {
+        const tree = new Tree(`
+            z = {};
+            a = 100;
+            z.z = {};
+            z.z.a = 10;
+            z.a = 1;
+            z.b = 15;
+            z.a += z.z.a;
+            z.b *= a + z.a + z.b;
+            z.z.b = z.z.a + z.a;
+            z.z.b *= z.z.a;
+        `);
+        const scope = new Scope();
+        await tree.evaluate(scope, null, null);
+        expect(await Tree.apply('z.z.a', scope, null, null)).toBe(10);
+        expect(await Tree.apply('z.a', scope, null, null)).toBe(11);
+        expect(await Tree.apply('z.b', scope, null, null)).toBe(1890);
+        expect(await Tree.apply('z.z.b', scope, null, null)).toBe(210);
+    });
+});

package/test/AST.spec.ts

@@ -1,7 +1,8 @@
-import {Promise as SimplePromise, IDeferred} from 'simple-ts-promise';
-import {Scope, WrappedArray} from "../src/Scope";
+import {WrappedArray} from '../src/Scope/WrappedArray';
+import {Scope} from "../src/Scope";
 import {Tree} from "../src/AST";
 import {DOM} from "../src/DOM";
+import {IDeferred, SimplePromise} from "../src/SimplePromise";
 
 describe('Tree', () => {
     let scope: Scope = null,

package/test/Controller.spec.ts

@@ -0,0 +1,44 @@
+import {Controller} from '../src/Controller';
+import {DOM} from "../src/DOM";
+import {SimplePromise} from "../src/SimplePromise";
+import {Registry} from "../src/Registry";
+import {property} from "../src/Scope/properties/Property";
+import {Property} from "../src/vsn";
+
+@Registry.controller('ControllerTestController')
+class TestController extends Controller {
+    @property()
+    public test: string;
+
+    @property(Property, {
+        type: 'integer',
+        min: 0,
+        max: 100,
+        validators: [
+            'positive',
+        ]
+    })
+    public positive_integer: number;
+
+    isValid(): boolean {
+        return this.test === 'test';
+    }
+}
+
+describe('Controller', () => {
+    it("methods should be callable from vsn-script", async () => {
+        document.body.innerHTML = `
+            <div vsn-controller:test="ControllerTestController" vsn-set:test.test="notTest" vsn-bind="test.test"></div>
+        `;
+        const dom = new DOM(document);
+        const deferred = SimplePromise.defer();
+        dom.once('built', async () => {
+            expect(await dom.eval('test.test')).toBe('notTest');
+            expect(await dom.eval('test.isValid()')).toBe(false);
+            await dom.eval('test.test = "test"');
+            expect(await dom.eval('test.isValid()')).toBe(true);
+            deferred.resolve();
+        });
+        await deferred.promise;
+    });
+});