web:add shader command

doric-web/src/DoricContext.ts

@@ -27,6 +27,17 @@ export class DoricContext {
         this.rootNode = new DoricStackNode(this)
     }
 
+    targetViewNode(viewId: string) {
+        if (this.rootNode.viewId === viewId) {
+            return this.rootNode
+        }
+        for (let nodes of this.headNodes.values()) {
+            if (nodes.has(viewId)) {
+                return nodes.get(viewId)
+            }
+        }
+    }
+
     get panel() {
         return jsObtainContext(this.contextId)?.entity as Panel
     }
@@ -55,7 +66,6 @@ export class DoricContext {
         this.invokeEntityMethod("__onCreate__")
     }
 
-
     onDestroy() {
         this.invokeEntityMethod("__onDestroy__")
     }

doric-web/src/plugins/ShaderPlugin.ts

@@ -1,23 +1,49 @@
 import { DoricPlugin } from "../DoricPlugin";
-import { DVModel } from "../shader/DoricViewNode";
+import { DoricSuperNode, DoricViewNode, DVModel } from "../shader/DoricViewNode";
 
 export class ShaderPlugin extends DoricPlugin {
     render(ret: DVModel) {
         if (this.context.rootNode.viewId?.length > 0) {
-            if (this.context.rootNode.viewId === ret.id) {
-                this.context.rootNode.blend(ret.props)
-                this.context.rootNode.onBlended()
-            } else {
-                for (let map of this.context.headNodes.values()) {
-                    const viewNode = map.get(ret.id)
-                    viewNode?.blend(ret.props)
-                    viewNode?.onBlended()
-                }
-            }
+            const viewNode = this.context.targetViewNode(ret.id)
+            viewNode?.blend(ret.props)
+            viewNode?.onBlended()
         } else {
             this.context.rootNode.viewId = ret.id
             this.context.rootNode.blend(ret.props)
             this.context.rootNode.onBlended()
         }
     }
+
+    command(options: {
+        viewIds: string[],
+        args: any,
+        name: string
+    }) {
+        let viewNode: DoricViewNode | undefined = undefined
+        for (let viewId of options.viewIds) {
+            if (!viewNode) {
+                viewNode = this.context.targetViewNode(viewId)
+            } else {
+                if (viewNode instanceof DoricSuperNode) {
+                    viewNode = viewNode.getSubNodeById(viewId)
+                }
+            }
+        }
+        if (!viewNode) {
+            return Promise.reject("Cannot find opposite view")
+        } else {
+            const target = viewNode
+            return new Promise((resolve, reject) => {
+                try {
+                    const method = Reflect.get(target, options.name)
+                    if (!method) {
+                        reject(`"Cannot find plugin method in class:${target},method:${options.name}"`)
+                    }
+                    resolve(Reflect.apply(method, target, [options.args]))
+                } catch (err) {
+                    reject(err)
+                }
+            })
+        }
+    }
 }

doric-web/src/shader/DoricRefreshableNode.ts

@@ -20,7 +20,10 @@ export class DoricRefreshableNode extends DoricSuperNode {
         const header = document.createElement('div')
         const content = document.createElement('div')
         header.style.width = "100%"
-        header.style.height = "auto"
+        header.style.height = "100%"
+        header.style.display = "flex"
+        header.style.alignItems = "flex-end"
+        header.style.justifyContent = "center"
         content.style.width = "100%"
         content.style.height = "100%"
         ret.appendChild(header)
@@ -151,4 +154,24 @@ export class DoricRefreshableNode extends DoricSuperNode {
         super.onBlended()
     }
 
+    setRefreshing(v: boolean) {
+        if (!this.headerContainer || !this.headerNode) {
+            return
+        }
+        if (v) {
+            this.view.scrollTo({
+                top: this.headerContainer.offsetHeight - this.headerNode.getHeight(),
+                behavior: "smooth"
+            })
+        } else {
+            this.view.scrollTo({
+                top: this.headerContainer?.offsetHeight,
+                behavior: "smooth"
+            })
+        }
+    }
+
+    setRefreshable(v: boolean) {
+        console.log("setRefreshable", v)
+    }
 }

doric-web/src/shader/DoricViewNode.ts

@@ -99,7 +99,6 @@ export abstract class DoricViewNode {
 
     view!: HTMLElement
 
-
     constructor(context: DoricContext) {
         this.context = context
     }
@@ -146,7 +145,6 @@ export abstract class DoricViewNode {
     }
 
     onBlending() {
-
     }
 
     onBlended() {
@@ -282,6 +280,9 @@ export abstract class DoricViewNode {
                     this.view.style.boxShadow = ""
                 }
                 break
+            case 'alpha':
+                this.view.style.opacity = `${prop}`
+                break
         }
     }
 
@@ -325,6 +326,72 @@ export abstract class DoricViewNode {
         }
         return Reflect.apply(this.context.pureInvokeEntityMethod, this.context, argumentsList)
     }
+
+    /** ++++++++++call from doric ++++++++++*/
+    getWidth() {
+        return this.view.offsetWidth
+    }
+
+    getHeight() {
+        return this.view.offsetHeight
+    }
+
+    setWidth(v: number) {
+        this.view.style.width = toPixelString(v)
+    }
+
+    setHeight(v: number) {
+        this.view.style.height = toPixelString(v)
+    }
+
+    getX() {
+        return this.view.offsetLeft
+    }
+
+    getY() {
+        return this.view.offsetTop
+    }
+
+    setX(v: number) {
+        this.view.style.left = toPixelString(v)
+    }
+
+    setY(v: number) {
+        this.view.style.top = toPixelString(v)
+    }
+
+    getBackgroundColor() {
+        return this.view.style.backgroundColor
+    }
+
+    setBackgroundColor(v: number) {
+        this.backgroundColor = v
+    }
+
+    getAlpha() {
+        return this.view.style.opacity
+    }
+
+    setAlpha(v: number) {
+        this.view.style.opacity = `${v}`
+    }
+
+    getCorners() {
+        return this.view.style.borderRadius
+    }
+
+    setCorners(v: number) {
+        this.view.style.borderRadius = toPixelString(v)
+    }
+
+    getLocationOnScreen() {
+        const rect = this.view.getClientRects()[0]
+        return {
+            x: rect.left,
+            y: rect.top,
+        }
+    }
+    /** ----------call from doric ----------*/
 }