vsn 0.1.64 → 0.1.65

package/src/DOM.ts

@@ -7,9 +7,14 @@ import {WrappedWindow} from "./DOM/WrappedWindow";
 import {WrappedDocument} from "./DOM/WrappedDocument";
 import {Scope} from "./Scope";
 import {EventDispatcher} from "./EventDispatcher";
-import {Registry} from "./Registry";
 import {ClassNode} from "./AST/ClassNode";
 
+export enum EQuerySelectDirection {
+    ALL,
+    UP,
+    DOWN
+}
+
 export class DOM extends EventDispatcher {
     protected static _instance: DOM;
     protected _root: Tag;
@@ -44,7 +49,7 @@ export class DOM extends EventDispatcher {
         return this._root;
     }
 
-    public async get(selector: string, create: boolean = false, tag: Tag = null) {
+    public async get(selector: string, create: boolean = false, tag: Tag = null, direction: EQuerySelectDirection = EQuerySelectDirection.DOWN): Promise<TagList> {
         switch (selector) {
             case 'window':
                 return new TagList(this.window);
@@ -53,7 +58,14 @@ export class DOM extends EventDispatcher {
             case 'body':
                 return new TagList(this.root);
             default:
-                const nodes = this.querySelectorAll(selector, tag);
+                let nodes;
+                if (direction === EQuerySelectDirection.DOWN) {
+                    nodes = this.querySelectorAll(selector, tag);
+                } else if (direction === EQuerySelectDirection.UP) {
+                    nodes = [this.querySelectorClosest(selector, tag)];
+                } else {
+                    nodes = this.querySelectorAll(selector);
+                }
                 return await this.getTagsForElements(Array.from(nodes) as Element[], create);
         }
     }
@@ -69,6 +81,10 @@ export class DOM extends EventDispatcher {
             this.root.scope.set(`#${id}`, tag.scope);
     }
 
+    public querySelectorClosest(q: string, tag: Tag = null): HTMLElement {
+        return tag.element.closest(q);
+    }
+
     public querySelectorAll(q: string, tag: Tag = null): NodeList | HTMLElement[] {
         const element: HTMLElement | Document = tag && !q.startsWith('#') ? tag.element : this.rootElement;
         return this.querySelectorElement(element, q);

package/src/Registry.ts

@@ -54,10 +54,15 @@ export class RegistryStore extends EventDispatcher {
     has(key: string) {
         return !!this.store[key];
     }
+
+    get keys(): string[] {
+        return Object.keys(this.store);
+    }
 }
 
 export class Registry extends EventDispatcher {
     protected static _instance: Registry;
+    public readonly functions: RegistryStore;
     public readonly controllers: RegistryStore;
     public readonly classes: RegistryStore;
     public readonly models: RegistryStore;
@@ -69,6 +74,7 @@ export class Registry extends EventDispatcher {
 
     constructor() {
         super();
+        this.functions = new RegistryStore();
         this.controllers = new RegistryStore();
         this.classes = new RegistryStore();
         this.models = new RegistryStore();
@@ -79,6 +85,10 @@ export class Registry extends EventDispatcher {
         this.attributes = new RegistryStore();
     }
 
+    public static function(key: string = null, setup = null) {
+        return register('functions', key, setup);
+    }
+
     public static class(cls: ClassNode) {
         Registry.instance.classes.register(cls.name, cls);
     }

package/src/attributes/RootAttribute.ts

@@ -1,7 +1,6 @@
 import {Attribute} from "../Attribute";
 import {VisionHelper} from "../helpers/VisionHelper";
 import {Registry} from "../Registry";
-import {Scope} from "../Scope";
 
 @Registry.attribute('vsn-root')
 export class RootAttribute extends Attribute {
@@ -10,8 +9,17 @@ export class RootAttribute extends Attribute {
 
     public async setup() {
         this.tag.scope.set('$mobile', VisionHelper.isMobile());
-        if (console && !this.tag.scope.get('console'))
-            this.tag.scope.set('console', Scope.fromObject(console));
+
+        for (const key of Registry.instance.functions.keys) {
+            const fn = Registry.instance.functions.get(key);
+            this.tag.scope.set(key, fn);
+        }
+
+        Registry.instance.functions.on('register', this.registerFunction, this);
         await super.setup();
     }
+
+    public async registerFunction(name: string, fn: Function) {
+        this.tag.scope.set(name, fn);
+    }
 }

package/src/vsn.ts

@@ -25,6 +25,10 @@ export class Vision extends EventDispatcher {
         } else {
             console.warn('No dom, running in CLI mode.');
         }
+        this.registry.functions.register('log', console.log);
+        this.registry.functions.register('warn', console.warn);
+        this.registry.functions.register('error', console.error);
+        this.registry.functions.register('info', console.info);
         this.registry.controllers.register('Object', Object);
         this.registry.controllers.register('WrappedArray', WrappedArray);
         this.registry.controllers.register('Data', DynamicScopeData);

package/test/DOM.spec.ts

@@ -33,4 +33,31 @@ describe('DOM', () => {
             done();
         });
     });
+
+    it("should be able to query elements in all directions", (done) => {
+        document.body.innerHTML = `
+            <div id="root" vsn-set:asd|integer="1">
+                <main id="parent" vsn-set:asd|integer="123">
+                    <div id="testing" vsn-controller:test="TestController" vsn-set:asd="234|integer">
+                        <div id="child" vsn-set:asd|integer="345">
+                            <ul>
+                                <li vsn-set:asd|integer="456"></li>
+                                <li id="grandchild" vsn-set:asd|integer="567"></li>
+                            </ul>
+                        </div>
+                    </div>
+                </main>
+            </div>
+        `;
+        const dom = new DOM(document);
+        dom.once('built', async () => {
+            const root = await dom.exec('#root');
+            const child = await dom.exec('#child');
+            const grandchild = await dom.exec('#grandchild');
+            expect(await child.exec('?<(main).asd')).toBe(123);
+            expect(await child.exec('?>(li)[0].asd')).toBe(456);
+            expect(await dom.exec('?(#grandchild)[0]')).toBe(grandchild);
+            done();
+        });
+    });
 });