dom-render 1.0.44 → 1.0.48

package/events/EventManager.js

@@ -1,4 +1,5 @@
 import { ScriptUtils } from '../utils/script/ScriptUtils';
+import { DomUtils } from '../utils/dom/DomUtils';
 export var eventManager = new (function () {
     function class_1() {
         var _this = this;
@@ -6,8 +7,9 @@ export var eventManager = new (function () {
         this.eventNames = [
             'click', 'mousedown', 'mouseup', 'dblclick', 'mouseover', 'mouseout', 'mousemove', 'mouseenter', 'mouseleave', 'contextmenu',
             'keyup', 'keydown', 'keypress',
-            'change', 'input', 'submit', 'resize'
+            'change', 'input', 'submit', 'resize', 'focus', 'blur'
         ];
+        this.eventParam = this.attrPrefix + 'event';
         this.attrNames = [
             this.attrPrefix + 'value',
             this.attrPrefix + 'value-link',
@@ -15,17 +17,21 @@ export var eventManager = new (function () {
             this.attrPrefix + 'style',
             this.attrPrefix + 'class',
             this.attrPrefix + 'window-event-popstate',
-            this.attrPrefix + 'on-init'
+            this.attrPrefix + 'on-init',
+            this.eventParam
         ];
         this.eventNames.forEach(function (it) {
             _this.attrNames.push(_this.attrPrefix + 'event-' + it);
         });
         window.addEventListener('popstate', function (e) {
             document.querySelectorAll('[dr-window-event-popstate]').forEach(function (it) {
-                var _a;
                 var script = it.getAttribute('dr-window-event-popstate');
                 if (script) {
-                    (_a = Function("\"use strict\"; const $target = this.$target;  " + script + " ").bind(Object.assign({ $target: it }, it.obj))()) !== null && _a !== void 0 ? _a : {};
+                    ScriptUtils.eval("const $target = this.__render.target;  " + script + " ", Object.assign(it.obj, {
+                        __render: Object.freeze({
+                            target: it
+                        })
+                    }));
                 }
             });
         });
@@ -44,8 +50,9 @@ export var eventManager = new (function () {
     class_1.prototype.applyEvent = function (obj, childNodes, config) {
         var _this = this;
         this.eventNames.forEach(function (it) {
-            _this.addDrEvent(obj, it, childNodes);
+            _this.addDrEvents(obj, it, childNodes);
         });
+        this.addDrEventPram(obj, this.eventParam, childNodes);
         this.procAttr(childNodes, this.attrPrefix + 'value', function (it, attribute) {
             var script = attribute;
             if (script) {
@@ -110,68 +117,134 @@ export var eventManager = new (function () {
             }
         });
         this.procAttr(elements, this.attrPrefix + 'attr', function (it, attribute) {
-            var _a;
             var script = attribute;
             if (script) {
                 script = 'return ' + script;
             }
             if (_this.isUsingThisVar(script, varName) || varName === undefined) {
-                var data = (_a = Function("\"use strict\"; const $target=this.$target; " + script + " ").bind(Object.assign({ $target: it }, obj))()) !== null && _a !== void 0 ? _a : {};
-                for (var _i = 0, _b = Object.entries(data); _i < _b.length; _i++) {
-                    var _c = _b[_i], key = _c[0], value = _c[1];
+                var data = ScriptUtils.eval("const $target=this.__render.target; " + script + " ", Object.assign(obj, {
+                    __render: Object.freeze({
+                        target: it
+                    })
+                }));
+                for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
+                    var _b = _a[_i], key = _b[0], value = _b[1];
                     it.setAttribute(key, String(value));
                 }
             }
         });
         this.procAttr(elements, this.attrPrefix + 'style', function (it, attribute) {
-            var _a;
             var script = attribute;
             if (script) {
                 script = 'return ' + script;
             }
             if (_this.isUsingThisVar(script, varName) || varName === undefined) {
-                var data = (_a = Function("\"use strict\"; const $target = this.$target;  " + script + " ").bind(Object.assign({ $target: it }, obj))()) !== null && _a !== void 0 ? _a : {};
-                for (var _i = 0, _b = Object.entries(data); _i < _b.length; _i++) {
-                    var _c = _b[_i], key = _c[0], value = _c[1];
+                var data = ScriptUtils.eval("const $target = this.__render.target;  " + script + " ", Object.assign(obj, {
+                    __render: Object.freeze({
+                        target: it
+                    })
+                }));
+                if (typeof data === 'string') {
+                    if (it instanceof HTMLElement) {
+                        it.removeAttribute('style');
+                        it.setAttribute('style', data);
+                    }
+                }
+                else if (Array.isArray(data)) {
                     if (it instanceof HTMLElement) {
-                        it.style[key] = String(value);
+                        it.removeAttribute('style');
+                        it.setAttribute('style', data.join(';'));
+                    }
+                }
+                else {
+                    for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
+                        var _b = _a[_i], key = _b[0], value = _b[1];
+                        if (it instanceof HTMLElement) {
+                            it.style[key] = String(value);
+                        }
                     }
                 }
             }
         });
         this.procAttr(elements, this.attrPrefix + 'class', function (it, attribute) {
-            var _a;
             var script = attribute;
             if (script) {
                 script = 'return ' + script;
             }
             if (_this.isUsingThisVar(script, varName) || varName === undefined) {
-                var data = (_a = Function("\"use strict\"; const $target = this.$target;  " + script + " ").bind(Object.assign({ $target: it }, obj))()) !== null && _a !== void 0 ? _a : {};
-                for (var _i = 0, _b = Object.entries(data); _i < _b.length; _i++) {
-                    var _c = _b[_i], key = _c[0], value = _c[1];
+                var data = ScriptUtils.eval("const $target = this.$target;  " + script + " ", Object.assign(obj, {
+                    __render: Object.freeze({
+                        target: it
+                    })
+                }));
+                if (typeof data === 'string') {
                     if (it instanceof HTMLElement) {
-                        if (value) {
-                            it.classList.add(key);
-                        }
-                        else {
-                            it.classList.remove(key);
+                        it.removeAttribute('class');
+                        it.setAttribute('class', data);
+                    }
+                }
+                else if (Array.isArray(data)) {
+                    if (it instanceof HTMLElement) {
+                        it.removeAttribute('class');
+                        it.setAttribute('class', data.join(' '));
+                    }
+                }
+                else {
+                    for (var _i = 0, _a = Object.entries(data); _i < _a.length; _i++) {
+                        var _b = _a[_i], key = _b[0], value = _b[1];
+                        if (it instanceof HTMLElement) {
+                            if (value) {
+                                it.classList.add(key);
+                            }
+                            else {
+                                it.classList.remove(key);
+                            }
                         }
                     }
                 }
             }
         });
     };
-    class_1.prototype.addDrEvent = function (obj, eventName, elements) {
+    class_1.prototype.addDrEvents = function (obj, eventName, elements) {
         var attr = this.attrPrefix + 'event-' + eventName;
         this.procAttr(elements, attr, function (it, attribute) {
             var script = attribute;
             it.addEventListener(eventName, function (event) {
-                var _a;
-                var f = Function("\"use strict\"; const $target=event.target; const $event=event; " + script + " ");
-                var data = (_a = f.bind(Object.assign(obj))()) !== null && _a !== void 0 ? _a : {};
+                ScriptUtils.eval("const $event=this.__render.event;  const $target=$event.target; " + script + " ", Object.assign(obj, {
+                    __render: Object.freeze({
+                        event: event
+                    })
+                }));
             });
         });
     };
+    class_1.prototype.addDrEventPram = function (obj, attr, elements) {
+        this.procAttr(elements, attr, function (it, attribute, attributes) {
+            var bind = attributes[attr + ':bind'];
+            if (bind) {
+                var script_1 = attribute;
+                var params_1 = {};
+                var prefix_1 = attr + ':';
+                Object.entries(attributes).filter(function (_a) {
+                    var k = _a[0], v = _a[1];
+                    return k.startsWith(prefix_1);
+                }).forEach(function (_a) {
+                    var k = _a[0], v = _a[1];
+                    params_1[k.slice(prefix_1.length)] = v;
+                });
+                bind.split(',').forEach(function (eventName) {
+                    it.addEventListener(eventName.trim(), function (event) {
+                        ScriptUtils.eval("const $params = this.__render.params; const $event=this.__render.event; const $target=$event.target;  " + script_1 + " ", Object.assign(obj, {
+                            __render: Object.freeze({
+                                event: event,
+                                params: params_1
+                            })
+                        }));
+                    });
+                });
+            }
+        });
+    };
     class_1.prototype.procAttr = function (elements, attrName, callBack) {
         if (elements === void 0) { elements = new Set(); }
         var sets = new Set();
@@ -189,8 +262,9 @@ export var eventManager = new (function () {
         });
         sets.forEach(function (it) {
             var attr = it.getAttribute(attrName);
+            var attrs = DomUtils.getAttributeToObject(it);
             if (attr) {
-                callBack(it, attr);
+                callBack(it, attr, attrs);
             }
         });
     };

package/lifecycle/OnBeforeReturnGet.d.ts

@@ -0,0 +1,3 @@
+export interface OnBeforeReturnGet {
+    onBeforeReturnGet(name: string, value: any, fullPath?: string[]): void;
+}

package/lifecycle/OnBeforeReturnGet.js

@@ -0,0 +1 @@
+export {};

package/lifecycle/OnBeforeReturnSet.d.ts

@@ -0,0 +1,3 @@
+export interface OnBeforeReturnSet {
+    onBeforeReturnSet(name: string, value: any, fullPath?: string[]): void;
+}

package/lifecycle/OnBeforeReturnSet.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dom-render",
-  "version": "1.0.44",
+  "version": "1.0.48",
   "main": "DomRender.js",
   "license": "MIT",
   "description": "dom-render",

package/types/Types.d.ts

@@ -1,3 +1,6 @@
 export interface ConstructorType<T> {
     new (...args: any[]): T;
 }
+export declare class Shield {
+    [name: string]: any;
+}

package/types/Types.js

@@ -1 +1,6 @@
-export {};
+var Shield = (function () {
+    function Shield() {
+    }
+    return Shield;
+}());
+export { Shield };

package/utils/dom/DomUtils.d.ts

@@ -5,9 +5,9 @@ export declare type Attr = {
 export declare class DomUtils {
     static selectorElements(selector: string, element?: Element | Document): Element[];
     static selectorNodes(selector: string, element?: Element | Document): NodeListOf<Element>;
-    static removeAttribute(result: HTMLElement, attrs: string[]): void;
-    static setAttribute(result: HTMLElement, attrs: string[]): void;
-    static setAttributeAttr(result: HTMLElement, attrs: Attr[]): void;
-    static getAttributeToObject(input: HTMLElement): any;
+    static removeAttribute(result: Element, attrs: string[]): void;
+    static setAttribute(result: Element, attrs: string[]): void;
+    static setAttributeAttr(result: Element, attrs: Attr[]): void;
+    static getAttributeToObject(input: Element): any;
     static getStyleToObject(input: HTMLElement): any;
 }

package/utils/dom/DomUtils.js

@@ -26,7 +26,9 @@ var DomUtils = (function () {
     };
     DomUtils.getAttributeToObject = function (input) {
         var attribute = {};
-        input.getAttributeNames().forEach(function (ait) { return attribute[ait] = input.getAttribute(ait); });
+        input.getAttributeNames().forEach(function (ait) {
+            attribute[ait] = input.getAttribute(ait);
+        });
         return attribute;
     };
     DomUtils.getStyleToObject = function (input) {

package/Shield.d.ts

@@ -1,3 +0,0 @@
-export declare class Shield {
-    [name: string]: any;
-}

package/Shield.js

@@ -1,6 +0,0 @@
-var Shield = (function () {
-    function Shield() {
-    }
-    return Shield;
-}());
-export { Shield };

package/dist/Shield.d.ts

@@ -1,3 +0,0 @@
-export declare class Shield {
-    [name: string]: any;
-}