1.1.2

src/Data/Form.js

@@ -1,10 +1,10 @@
 import IUIElement from "../Core/IUIElement.js";
 import { IUI } from "../Core/IUI.js";
+import Modifiable from "./Modifiable.js";
 
 export default IUI.module(class Form extends IUIElement {
     constructor() {
         super();
-        //this.form = {};
     }
 
     static _copy(val){
@@ -34,34 +34,23 @@ export default IUI.module(class Form extends IUIElement {
         this.original = value;
         //var copy = {};
         //Object.assign(copy, value);
-        super.setData(Form._copy(this.original));
+        super.setData(new Modifiable(this.original));//  Form._copy(this.original));
         //super.setData({ ...this.original });
     }
 
   
     async reset() {
         //super.setData({ ...this.original });
-        super.setData(Form._copy(this.original));
+        super.setData(new Modifiable(this.original));//Form._copy(this.original));
         return this;
     }
 
-    // @TODO: Remove this when esiur adds suport to partially modified arrays with modified flag
-    static _areEqual(ar1, ar2)
-    {
-        if (!(ar1 instanceof Array) || !( ar2 instanceof Array))
-            return false;
-
-        if (ar1.length != ar2.length)
-            return false;
-
-        for(var i = 0; i < ar1.length; i++)
-            if (ar1[i] != ar2[i])
-                return false;
-        
-        return true;
-    }
+ 
 
     get diff() {
+
+        return this._data._diff;
+
         if (this.original == null)
             return this._data;
 

src/Data/Include.js

@@ -9,26 +9,35 @@ export default IUI.module(class Include extends IUIElement
         this.refs = {};
     }
 
-    async create()
+    get src(){
+        return this.getAttribute("src");
+    }
+
+    set src(value){
+        this.setAttribute("src", value);
+        this._load(value);
+    }
+
+    async _load(url)
     {
-        //console.log("Create ...", this.getAttribute("src"));
+        if (this._loading)
+            return;
 
-        if (this.getAttribute("src") == "views/studio/realestate.html")
-            console.log("Create include");
+        this._loading = true;
 
-        if (this.hasAttribute("src")) {
+        let src = url.replace(/^\/+|\/+$/g, '');
 
-            let src = this.getAttribute("src").replace(/^\/+|\/+$/g, '');
-            let x = await fetch(src);
+        this.classList.add(this.cssClass + "-loading");
 
-            if (x.status !== 200)
-                return;
+        let x = await fetch(src);
 
+        if (x.status == 200)
+        {
             let t = await x.text();
 
             this.innerHTML = t;
 
-            let xeval = (code) => eval(code);
+            //let xeval = (code) => eval(code);
 
             // call create for the new elements
             var newElements = this.querySelectorAll("*");
@@ -58,11 +67,23 @@ export default IUI.module(class Include extends IUIElement
             }
         }
 
-        //this.updateBindings();
+        this.classList.remove(this.cssClass + "-loading");
+
+        if (window?.app?.loaded)
+        {
+            await IUI.create(this);
+            await IUI.created(this);
+            this.updateBindings();
+            await this.render();
+        }
+
+        this._loading = false;
     }
 
-    get src()
+    async create()
     {
-        return this._src;
+        if (this.hasAttribute("src"))
+            await this._load(this.getAttribute("src"));
     }
+
 });

src/Data/Modifiable.js

@@ -0,0 +1,139 @@
+export default class Modifiable
+{
+    static _copy(val){
+        if (typeof val === 'object' && val !== null)
+        {
+            let rt = {};
+            for(var i in val)
+                if (val[i] instanceof Array)
+                    // copy array
+                    rt[i] = [...val[i]];
+                else
+                    rt[i] = val[i];
+
+            return rt;
+        }
+        else 
+            return val;
+    }
+
+    // @TODO: Remove this when esiur adds suport to partially modified arrays with modified flag
+    static _areEqual(ar1, ar2)
+    {
+        if (!(ar1 instanceof Array) || !( ar2 instanceof Array))
+            return false;
+
+        if (ar1.length != ar2.length)
+            return false;
+
+        for(var i = 0; i < ar1.length; i++)
+            if (ar1[i] != ar2[i])
+                return false;
+        
+        return true;
+    }
+
+    constructor(original){
+
+        this._events = {};
+        this._data = Modifiable._copy(original);
+        this._original = original;
+
+        for(let p in this._data)
+        {
+            if (p.startsWith("_"))
+                continue;
+
+            this._register(":" + p);
+
+            Object.defineProperty(this, p, {
+                get() {
+                  return this._data[p];
+                },
+                set(value) {
+                  this._data[p] = value;
+                  this._emit(":" + p, value);
+                }
+              });
+        }
+
+    }
+
+
+    get _diff() {
+        if (this._original == null)
+            return this._data;
+
+        var rt = {};
+        for (var i in this._data)
+            if (this._data[i] != this._original[i])
+            {
+                if (this._data[i] instanceof Array && Modifiable._areEqual(this._data[i], this._original[i]))
+                    continue;
+                else
+                    rt[i] = this._data[i];
+            }
+            
+        return rt;
+    }
+
+    _register(event)
+    {
+        this._events[event] = [];
+    }
+ 
+
+    _emit(event)
+    {
+        event = event.toLowerCase();
+        var args = Array.prototype.slice.call(arguments, 1);
+        if (this._events[event])
+            for(var i = 0; i < this._events[event].length; i++)
+                if (this._events[event][i].f.apply(this._events[event][i].i, args))
+                    return true;
+
+        return false;
+    }
+
+    _emitArgs(event, args)
+    {
+        event = event.toLowerCase();
+        if (this._events[event])
+            for(var i = 0; i < this._events[event].length; i++)
+                if (this._events[event][i].f.apply(this._events[event][i].i, args))
+                    return true;
+        return this;
+    }
+
+    on(event, fn, issuer)
+    {
+        if (!(fn instanceof Function))
+            return this;
+
+        event = event.toLowerCase();
+        // add
+        if (!this._events[event])
+            this._events[event] = [];
+        this._events[event].push({f: fn, i: issuer == null ? this: issuer});
+        return this;
+    }
+
+    
+    off(event, fn)
+    {
+        event = event.toLowerCase();
+        if (this._events[event])
+        {
+            if (fn)
+            {
+                for(var i = 0; i < this._events[event].length; i++)
+                    if (this._events[event][i].f == fn)
+                        this._events[event].splice(i--, 1);
+            }
+            else
+            {
+                this._events[event] = [];
+            }
+        }
+    }
+}

src/Data/Repeat.js

@@ -263,9 +263,10 @@ export default IUI.module(class Repeat extends IUIElement
         //super._uiBindings = null;
         //super.updateBindings();
    
-        this._emit("modified", { data: value, property: "data" });
+        // @TODO: check if this works for event names starting with ":"
+        this._emit(":data", { data: value });
+        // this._emit("modified", { data: value, property: "data" });
 
-   //     console.log("SetDataEnd " + this.getAttribute("ref") + " " + id);
    
         this._busy = false;
     }