From 90ea9df537872e93accd15d48bf541956abb71c8 Mon Sep 17 00:00:00 2001
From: jusax23 <jusax23@gmail.com>
Date: Sun, 11 Dec 2022 21:40:14 +0100
Subject: [PATCH] qol, performance, bugs

---
 main.js | 38 ++++++++++++++++++++++++++++++--------
 1 file changed, 30 insertions(+), 8 deletions(-)

diff --git a/main.js b/main.js
index 49d40dd..43f9949 100644
--- a/main.js
+++ b/main.js
@@ -101,6 +101,10 @@ export class Stear {
         return await elem.call(this, args, this.#frames, layer);
     }
 
+    async callInParent(elem, args, layer, renderParent = this.elem) {
+        return await elem.call(this, args, this.#frames, layer, renderParent);
+    }
+
     /**
      * Render an Element in annother Element.
      * 
@@ -256,7 +260,8 @@ ${Object.entries(json).map(d => "    " + toCssAttr(d[0]) + ": " + d[1] + ";").jo
  * @async
  * @callback utilsCallCallback
  * @param {SFrame} elem
- * @param {*} args
+ * @param {*} [args={}]
+ * @param {boolean} [global=true] 
  * @return {callPromise}
  */
 
@@ -368,13 +373,17 @@ export class SFrame {
 
         async function render(args) {
             if (!renderElem) return;
-            if (lastRender) if ([...(renderParent.children)].includes(lastRender._)) renderParent.removeChild(lastRender._);
+            //if (lastRender) if ([...(renderParent.children)].includes(lastRender._)) renderParent.removeChild(lastRender._);
             let now = renderElem;
-            if (typeof now == "function") now = await now();
+            if (typeof now == "function") {
+                if (lastRender) if ([...(renderParent.children)].includes(lastRender._)) renderParent.removeChild(lastRender._);
+                now = await now();
+            }
             if (!(now instanceof class_)) throw new Error("The Element to render is not an instance of class_");
             await now.build(args);
 
-            renderParent.appendChild(now.render);
+            now.render
+            if (!lastRender || ![...(renderParent.children)].includes(lastRender._)) renderParent.appendChild(now._);
             lastRender = now;
 
             now._.style.zIndex = layer;
@@ -411,8 +420,9 @@ export class SFrame {
                     if (i > -1) frames.splice(i, 1);
                     res(r);
                 },
-                call: (elem, args = {}) => {
-                    return stear.call(elem, args, layer + 1);
+                call: (elem, args = {}, global = true) => {
+                    if (global) return stear.call(elem, args, layer + 1);
+                    else return stear.callInParent(elem, args, layer + 1, renderParent);
                 },
                 close: async () => {
                     await event.onclose();
@@ -504,6 +514,8 @@ export class class_ {
 
     #dynamicState = 0;
 
+    #dynamicStyle = {};
+
     /**
      * Generate a new Stear render Node.
      * 
@@ -519,7 +531,8 @@ export class class_ {
             const key = keys[i];
             if (key == "type") { } else if (key == "style") {
                 Object.entries(settings[key]).forEach(([k, d]) => {
-                    this.#elem.style[k] = d;
+                    if (typeof d == "function") this.#dynamicStyle[k] = d;
+                    else this.#elem.style[k] = d;
                 });
             } else if (key == "find") {
                 this.#find = settings[key];
@@ -566,6 +579,12 @@ export class class_ {
         }
     }
 
+    async updateDynamicStyle(args) {
+        for (const key in this.#dynamicStyle) {
+            this.#elem.style[key] = await this.#dynamicStyle[key](args);
+        }
+    }
+
     async #syncBuild(args) {
         for (let i = 0; i < this.#childs.length; i++) {
             let elem = this.#childs[i];
@@ -587,6 +606,7 @@ export class class_ {
      */
     async build(args) {
         if (!this.#doBuild) return;
+        this.updateDynamicStyle(args);
         if (this.#dynamicState < 0) return void await this.#syncBuild(args);
         this.#build = [];
         for (let i = 0; i < this.#childs.length; i++) {
@@ -632,6 +652,7 @@ export class class_ {
             return this.#elem;
         }
         let out = [];
+        let needReplace = false;
         for (let i = 0; i < this.#build.length; i++) {
             const elem = this.#build[i];
             if (typeof elem == "string" || elem instanceof LanguagePoolString) {
@@ -639,8 +660,9 @@ export class class_ {
             } else {
                 out[i] = elem.render;
             }
+            if (!needReplace &&this.#elem.children[i] != out[i]) needReplace = true;
         }
-        this.#elem.replaceChildren(...out);
+        if (needReplace) this.#elem.replaceChildren(...out);
         if (this.#dynamicState < 0) this.#dynamicState = -2;
         return this.#elem;
     }