docs

src/UI/CodePreview.js

@@ -0,0 +1,68 @@
+import IUIElement from "../Core/IUIElement.js";
+import { IUI } from "../Core/IUI.js";
+
+export default IUI.module(class CodePreview extends IUIElement {
+    constructor(properties) {
+        super();
+    }
+
+    async create() {
+
+
+        
+        if (this.hasAttribute("debug"))
+            debugger;
+
+        this._code = this.innerHTML;
+        this.textContent = '';
+        
+        // create elements
+        this.bar = document.createElement("div");
+        this.bar.className = this.cssClass + "-bar";
+        this.content = document.createElement("div");
+        this.content.className = this.cssClass + "-content";
+        this.editor =  document.createElement("code");
+        this.editor.className = this.cssClass + "-editor";
+
+        this.editor.innerText = this._code;
+        this.editor.contentEditable = true;
+
+        this.editor.setAttribute("skip", true);
+
+        let self = this;
+        this.editor.addEventListener("input", function() {
+            self._code = self.editor.innerText;
+            self.update();
+        }, false);
+        
+        this.preview = document.createElement("div");
+        this.preview.className = this.cssClass + "-preview";
+        //this.preview.setAttribute(":content", "");
+
+        this.content.append(this.editor);
+        this.content.append(this.preview);
+        
+        this.append(this.bar);
+        this.append(this.content);
+        this.field = this.getAttribute("field");
+
+        await this.update();
+    }
+   
+    
+    async update() {
+        
+        if (this._updating)
+            return;
+
+        this._updating = true;
+        this.preview.innerHTML = this._code;
+
+        await IUI.create(this.preview);
+        await IUI.created(this.preview);
+        IUI.bind(this.preview, this.preview, "preview");
+        await IUI.render(this.preview, this._data, true);
+
+        this._updating = false;
+    }
+});

src/UI/Location.js

@@ -0,0 +1,39 @@
+
+import IUIElement from "../Core/IUIElement.js";
+import { IUI } from "../Core/IUI.js";
+import Link from '../Router/Link.js';
+
+export default IUI.module(class Location extends IUIElement {
+    constructor() {
+        super();
+    }
+
+    create() {
+        let self = this;
+        window.router.on("route", (e) => {
+
+            self.textContent = ''; // clear everything
+
+            
+            let html = "";
+            let route = e.route;
+            
+            var current = document.createElement("div");
+            current.innerHTML = route.caption;
+
+            self.append(current);
+
+            while (route = route.parent) {
+
+                var sep = document.createElement("span");
+                self.prepend(sep);
+                
+                let link = new Link();
+                link.link = route.link;
+                link.innerHTML = route.caption;
+
+                self.prepend(link);
+            }
+        });
+    }
+});

src/UI/Select.js

@@ -220,10 +220,13 @@ export default IUI.module(class Select extends IUIElement {
             app.appendChild(this.menu);
             if (app.loaded)
             {
+
                 ///console.log("Append", this.menu);
                 await this.menu.create();
+                IUI.bind(this.menu, this, "menu");
                 await IUI.create(this.menu);
-                this._make_bindings(this.menu);    
+            
+                //this._make_bindings(this.menu);    
             }
         }
 
@@ -313,30 +316,7 @@ export default IUI.module(class Select extends IUIElement {
         await this.menu.setData(res);
 
 
-        // show results
-        //self.menu.clear();
-
-        
-
-        // for (var i = 0; i < res.length; i++) {
-        //     let nodes = this.template.content.cloneNode(true).childNodes;
-
-        //     while (nodes.length > 0) {
-        //         let n = nodes[0];
-        //         if (n instanceof HTMLElement)
-        //             n.setAttribute(":data", `d[${i}]`);
-        //         self.menu.appendChild(n);
-        //     }
-
-        // }
-
-        // self.menu.updateBindings();
-        //self.menu.setData(res);
-
-
-        //}).catch(x => {
-
-        //});
+       
     }
 
 

src/UI/TabbedTarget.js

@@ -131,9 +131,7 @@ export default IUI.module(class TabbedTarget extends Target {
         this._body.append(item);
 
 
-        //this._bar.appendChild(label);
-        //this._bar.insertAdjacentElement("afterBegin", label);
-
+ 
         this.list.push(item);
         var self = this;
         label.on("check", function (v) {
@@ -141,9 +139,7 @@ export default IUI.module(class TabbedTarget extends Target {
             self.select(item);
         });
 
-        //this._updateSize();
-        //this.updateBindings();
-
+ 
         if (item.selected)
             this.select(item);
 

src/UI/Table.js

@@ -907,7 +907,10 @@ export default IUI.module(class Table extends IUIElement {
 				
 			let cl = column.node.cloneNode(true);// tr.insertCell();
 
-			this._make_bindings(cl)
+			//this._make_bindings(cl)
+
+			IUI.bind(cl, this, "table");
+
 			tr.appendChild(cl);
 
 			if (cl.dataMap != null)

src/UI/Tabs.js

@@ -132,9 +132,7 @@ export default IUI.module(class Tabs extends IUIElement {
         this._body.append(item);
 
 
-        //this._bar.appendChild(label);
-        //this._bar.insertAdjacentElement("afterBegin", label);
-
+ 
         this.list.push(item);
         var self = this;
         label.on("check", function (v) {
@@ -142,9 +140,7 @@ export default IUI.module(class Tabs extends IUIElement {
             self.select(item);
         });
 
-        //this._updateSize();
-        //this.updateBindings();
-
+ 
         if (item.selected)
             this.select(item);
 

src/UI/Window.js

@@ -42,7 +42,6 @@ export default IUI.module(class IUIWindow extends IUIElement {
 
             this.insertAdjacentElement("afterBegin", this._body);
 
-            //super.updateBindings();
         }
         else
             this._body = b[0];