@leafer/display-module - npm Package Compare versions

Comparing version 1.0.0-rc.6 to 1.0.0-rc.7

package.json

 {
   "name": "@leafer/display-module",
-  "version": "1.0.0-rc.6",
+  "version": "1.0.0-rc.7",
   "description": "@leafer/display-module",
@@ -25,8 +25,9 @@ "author": "Chao (Leafer) Wan",
   "dependencies": {
-    "@leafer/event": "1.0.0-rc.6",
-    "@leafer/math": "1.0.0-rc.6"
+    "@leafer/helper": "1.0.0-rc.7",
+    "@leafer/event": "1.0.0-rc.7",
+    "@leafer/math": "1.0.0-rc.7"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-rc.6"
+    "@leafer/interface": "1.0.0-rc.7"
   }
 }

src/BranchRender.ts

@@ -30,3 +30,3 @@ import { ILeaf, ILeaferCanvas, IRenderOptions, IBranchRenderModule } from '@leafer/interface'
 
-                if (this.__hasMirror || options.matrix) {
+                if (this.__worldFlipped || options.matrix) {
                     canvas.copyWorld(tempCanvas, null, null, blendMode)
@@ -53,4 +53,4 @@ } else {
             let mask: boolean
-            const maskCanvas = canvas.getSameCanvas()
-            const contentCanvas = canvas.getSameCanvas()
+            const maskCanvas = canvas.getSameCanvas(false, true)
+            const contentCanvas = canvas.getSameCanvas(false, true)
 
@@ -57,0 +57,0 @@ for (let i = 0, len = children.length; i < len; i++) {

src/LeafBounds.ts

 import { ILeafBoundsModule } from '@leafer/interface'
 import { BoundsHelper } from '@leafer/math'
+import { BranchHelper, LeafHelper } from '@leafer/helper'
 
 
+const { updateMatrix, updateAllMatrix, hasParentAutoLayout } = LeafHelper
+const { updateBounds } = BranchHelper
 const { toOuterOf, copyAndSpread } = BoundsHelper
@@ -11,91 +14,90 @@
 
-        if (this.__layout.boundsChanged) {
+        toOuterOf(this.__layout.renderBounds, this.__world, this.__world)
 
-            let resize: boolean
-            const layout = this.__layout
+        if (this.__layout.resized) {
+            this.__onUpdateSize()
+            this.__layout.resized = false
+        }
 
+    },
 
-            if (layout.boxChanged) {
+    __updateLocalBounds(): void {
 
-                this.__updatePath()
-                this.__updateRenderPath()
+        const layout = this.__layout
 
-                this.__updateBoxBounds()
-                layout.boxChanged = false
-                resize = true
-            }
+        if (layout.boxChanged) {
 
+            this.__updatePath()
+            this.__updateRenderPath()
 
-            if (layout.localBoxChanged) { // position change
+            this.__updateBoxBounds()
+            layout.boxChanged = false
+            layout.resized = true
+        }
 
-                this.__updateLocalBoxBounds()
-                layout.localBoxChanged = false
 
-                if (layout.strokeSpread) layout.strokeChanged = true
-                if (layout.renderSpread) layout.renderChanged = true
-                this.parent?.__layout.boxChange()
-            }
+        if (layout.localBoxChanged) { // position change
 
+            if (this.__local) this.__updateLocalBoxBounds()
+            layout.localBoxChanged = false
 
-            if (layout.strokeChanged) {
+            if (layout.strokeSpread) layout.strokeChanged = true
+            if (layout.renderSpread) layout.renderChanged = true
+            if (this.parent) this.parent.__layout.boxChange()
+        }
 
-                layout.strokeSpread = this.__updateStrokeSpread()
 
-                if (layout.strokeSpread) {
+        if (layout.strokeChanged) {
 
-                    if (layout.strokeBounds === layout.boxBounds) {
-                        layout.spreadStroke()
-                    }
+            layout.strokeSpread = this.__updateStrokeSpread()
 
-                    this.__updateStrokeBounds()
-                    this.__updateLocalStrokeBounds()
+            if (layout.strokeSpread) {
 
-                } else {
-                    layout.spreadStrokeCancel()
+                if (layout.strokeBounds === layout.boxBounds) {
+                    layout.spreadStroke()
                 }
 
-                layout.strokeChanged = false
-                if (layout.renderSpread) layout.renderChanged = true
+                this.__updateStrokeBounds()
+                this.__updateLocalStrokeBounds()
 
-                if (this.parent) this.parent.__layout.strokeChange()
-                resize || (resize = true)
+            } else {
+                layout.spreadStrokeCancel()
             }
 
+            layout.strokeChanged = false
+            if (layout.renderSpread) layout.renderChanged = true
 
-            if (layout.renderChanged) {
+            if (this.parent) this.parent.__layout.strokeChange()
+            layout.resized = true
+        }
 
-                layout.renderSpread = this.__updateRenderSpread()
 
-                if (layout.renderSpread) {
+        if (layout.renderChanged) {
 
-                    if (layout.renderBounds === layout.boxBounds || layout.renderBounds === layout.strokeBounds) {
-                        layout.spreadRender()
-                    }
+            layout.renderSpread = this.__updateRenderSpread()
 
-                    this.__updateRenderBounds()
-                    this.__updateLocalRenderBounds()
+            if (layout.renderSpread) {
 
-                } else {
-                    layout.spreadRenderCancel()
+                if (layout.renderBounds === layout.boxBounds || layout.renderBounds === layout.strokeBounds) {
+                    layout.spreadRender()
                 }
 
-                layout.renderChanged = false
+                this.__updateRenderBounds()
+                this.__updateLocalRenderBounds()
 
-                if (this.parent) this.parent.__layout.renderChange()
+            } else {
+                layout.spreadRenderCancel()
             }
 
+            layout.renderChanged = false
 
-            layout.boundsChanged = false
+            if (this.parent) this.parent.__layout.renderChange()
+        }
 
-            toOuterOf(this.__layout.renderBounds, this.__world, this.__world)
+        layout.boundsChanged = false
 
-            if (resize) this.__onUpdateSize()
-
-        } else {
-            toOuterOf(this.__layout.renderBounds, this.__world, this.__world)
-        }
-
     },
 
     __updateLocalBoxBounds(): void {
+        if (this.__hasAutoLayout) this.__updateAutoLayout()
         toOuterOf(this.__layout.boxBounds, this.__local, this.__local)
@@ -105,7 +107,7 @@ },
     __updateLocalStrokeBounds(): void {
-        toOuterOf(this.__layout.strokeBounds, this.__local, this.__layout.localStrokeBounds)
+        toOuterOf(this.__layout.strokeBounds, this.__localMatrix, this.__layout.localStrokeBounds)
     },
 
     __updateLocalRenderBounds(): void {
-        toOuterOf(this.__layout.renderBounds, this.__local, this.__layout.localRenderBounds)
+        toOuterOf(this.__layout.renderBounds, this.__localMatrix, this.__layout.localRenderBounds)
     },
@@ -123,2 +125,18 @@
 
+
+    __updateAutoLayout(): void {
+        this.__layout.matrixChanged = true
+        if (this.isBranch) {
+            if (this.leafer) this.leafer.layouter.addExtra(this) // add part render
+            if (hasParentAutoLayout(this)) {
+                updateMatrix(this)
+            } else {
+                updateAllMatrix(this)
+                updateBounds(this, this)
+            }
+        } else {
+            updateMatrix(this)
+        }
+    },
+
     __updateNaturalSize(): void {
@@ -128,7 +146,2 @@ const { __: data, __layout: layout } = this
         data.__naturalHeight = layout.boxBounds.height
-
-        if (this.around) {
-            layout.matrixChanged = true
-            this.__updateWorldMatrix()
-        }
     },
@@ -135,0 +148,0 @@

src/LeafDataProxy.ts

@@ -1,2 +0,2 @@
-import { ILeafDataProxyModule, __Value } from '@leafer/interface'
+import { ILeafDataProxyModule, IObject, IValue } from '@leafer/interface'
 import { PropertyEvent } from '@leafer/event'
@@ -7,8 +7,8 @@
 
-    __setAttr(name: string, newValue: __Value): void {
+    __setAttr(name: string, newValue: IValue): void {
         if (this.leafer && this.leafer.created) {
             const oldValue = this.__.__getInput(name)
             if (typeof newValue === 'object' || oldValue !== newValue) {
-                this.__[name] = newValue
-                if (this.proxyData) this.setProxyAttr(name, newValue)
+                (this.__ as IObject)[name] = newValue
+                if (this.__proxyData) this.setProxyAttr(name, newValue)
 
@@ -21,20 +21,11 @@ const { CHANGE } = PropertyEvent
         } else {
-            this.__[name] = newValue
-            if (this.proxyData) this.setProxyAttr(name, newValue)
+            (this.__ as IObject)[name] = newValue
+            if (this.__proxyData) this.setProxyAttr(name, newValue)
         }
     },
 
-    __getAttr(name: string): __Value {
-        if (this.proxyData) return this.getProxyAttr(name)
+    __getAttr(name: string): IValue {
+        if (this.__proxyData) return this.getProxyAttr(name)
         return this.__.__get(name)
-    },
-
-    setProxyAttr(name: string, newValue: __Value): void {
-        if (this.proxyData[name] !== newValue) this.proxyData[name] = newValue
-    },
-
-    getProxyAttr(name: string): __Value {
-        return this.proxyData[name]
     }
-
 }

src/LeafEventer.ts

@@ -59,3 +59,3 @@ import { IEventListener, IEventListenerOptions, IEventListenerMap, IEventListenerItem, IEventListenerId, IEvent, IObject, IEventTarget, ILeafEventerModule } from '@leafer/interface'
         this.on(type, listener, options)
-        return { type, listener, options }
+        return { type, current: this, listener, options }
     },
@@ -66,3 +66,3 @@
         const list = id instanceof Array ? id : [id]
-        list.forEach(item => this.off(item.type, item.listener, item.options))
+        list.forEach(item => item.current.off(item.type, item.listener, item.options))
         list.length = 0
@@ -69,0 +69,0 @@ },

src/LeafMatrix.ts

@@ -1,8 +0,7 @@
-import { ILeafMatrixModule, IPointData } from '@leafer/interface'
-import { OneRadian, MatrixHelper } from '@leafer/math'
+import { ILeafMatrixModule, ILayoutData } from '@leafer/interface'
+import { AroundHelper, MatrixHelper } from '@leafer/math'
 
 
-const { sin, cos } = Math
-const defaultWorld = { ...MatrixHelper.defaultMatrix, scaleX: 1, scaleY: 1, rotation: 0, skewX: 0, skewY: 0 }
-const defaultCenter: IPointData = { x: 0.5, y: 0.5 }
+const { setLayout, multiplyParent, translateInner, defaultWorld } = MatrixHelper
+const { toPoint, tempPoint } = AroundHelper
 
@@ -13,38 +12,4 @@ export const LeafMatrix: ILeafMatrixModule = {
 
-        const pw = this.parent ? this.parent.__world : defaultWorld
-        const r = this.__local
-        const w = this.__world
+        multiplyParent(this.__local || this.__layout, this.parent ? this.parent.__world : defaultWorld, this.__world, !!this.__layout.affectScaleOrRotation, this.__ as ILayoutData)
 
-        if (this.__layout.matrixChanged) this.__updateLocalMatrix()
-
-        if (this.__layout.affectScaleOrRotation) {
-            w.a = r.a * pw.a + r.b * pw.c
-            w.b = r.a * pw.b + r.b * pw.d
-            w.c = r.c * pw.a + r.d * pw.c
-            w.d = r.c * pw.b + r.d * pw.d
-            w.e = r.e * pw.a + r.f * pw.c + pw.e
-            w.f = r.e * pw.b + r.f * pw.d + pw.f
-
-            const data = this.__
-            w.scaleX = pw.scaleX * data.scaleX
-            w.scaleY = pw.scaleY * data.scaleY
-
-            w.rotation = pw.rotation + data.rotation
-            w.skewX = pw.skewX + data.skewX
-            w.skewY = pw.skewY + data.skewY
-        } else {
-            w.a = pw.a
-            w.b = pw.b
-            w.c = pw.c
-            w.d = pw.d
-            w.e = r.e * pw.a + r.f * pw.c + pw.e
-            w.f = r.e * pw.b + r.f * pw.d + pw.f
-
-            w.scaleX = pw.scaleX
-            w.scaleY = pw.scaleY
-
-            w.rotation = pw.rotation
-            w.skewX = pw.skewX
-            w.skewY = pw.skewY
-        }
     },
@@ -54,49 +19,21 @@
 
-        const r = this.__local
-        const layout = this.__layout
+        if (this.__local) {
 
-        if (layout.affectScaleOrRotation) {
+            const layout = this.__layout, local = this.__local, data = this.__
 
-            const { scaleX, scaleY } = this.__
+            if (layout.affectScaleOrRotation) {
 
-            if (layout.affectRotation) {
-
                 if (layout.scaleChanged || layout.rotationChanged) {
-
-                    let { rotation, skewX, skewY } = this.__
-
-                    if (rotation || skewX || skewY) {
-
-                        rotation *= OneRadian
-                        if (skewX) skewX *= OneRadian
-                        if (skewY) skewY *= OneRadian
-
-                        r.a = scaleX * cos(rotation + skewY)
-                        r.b = scaleX * sin(rotation + skewY)
-                        r.c = scaleY * -sin(rotation - skewX)
-                        r.d = scaleY * cos(rotation - skewX)
-
-                    } else {
-
-                        r.a = scaleX
-                        r.b = 0
-                        r.c = 0
-                        r.d = scaleY
-
-                        layout.affectRotation = false
-                    }
-
-                    layout.scaleChanged = false
-                    layout.rotationChanged = false
-
+                    setLayout(local, data as ILayoutData, null, layout.affectRotation)
+                    layout.scaleChanged = layout.rotationChanged = false
                 }
 
-            } else {
+            }
 
-                if (layout.scaleChanged) {
-                    r.a = scaleX
-                    r.d = scaleY
-                    layout.scaleChanged = false
-                }
+            local.e = data.x
+            local.f = data.y
 
+            if (data.around) {
+                toPoint(data.around, layout.boxBounds, tempPoint)
+                translateInner(local, -tempPoint.x, -tempPoint.y)
             }
@@ -106,23 +43,8 @@
 
-        const { x, y, around } = this.__
+        this.__layout.matrixChanged = false
 
-        r.e = x
-        r.f = y
-
-        if (around) {
-            const { width, height } = this.__
-            if (width && height) {
-                const origin = (around === 'center') ? defaultCenter : around
-                const offsetX = width * origin.x, offsetY = height * origin.y
-                r.e -= offsetX * r.a + offsetY * r.c
-                r.f -= offsetX * r.b + offsetY * r.d
-            }
-        }
-
-        this.__layout.matrixChanged = false
     }
 
-
 }
 
 

src/LeafRender.ts

@@ -17,3 +17,3 @@ import { ILeaferCanvas, IRenderOptions, ILeafRenderModule } from '@leafer/interface'
                 const blendMode = this.__.isEraser ? 'destination-out' : this.__.blendMode
-                if (this.__hasMirror || options.matrix) {
+                if (this.__worldFlipped || options.matrix) {
                     canvas.copyWorldByReset(tempCanvas, null, null, blendMode)
@@ -20,0 +20,0 @@ } else {

No alert changes

Worsened metrics

Total package byte prevSize

20071

-8.95%

Dependency count

3

50%

Lines of code

425

-10.9%

Dependency changes

• + Added

  @leafer/helper@1.0.0-rc.7

• + Added

  @leafer/canvas@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/core@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/data@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/debug@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/decorator@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/display@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/event@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/event-ui@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/file@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/helper@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/image@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/interaction@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/interface@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/layout@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/layouter@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/list@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/math@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/path@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/platform@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/plugin@1.0.0-rc.7
  (transitive)

• + Added

  @leafer/task@1.0.0-rc.7
  (transitive)

• - Removed

  @leafer/canvas@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/core@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/data@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/debug@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/decorator@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/display@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/event@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/event-ui@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/file@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/helper@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/image@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/interaction@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/interface@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/layout@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/layouter@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/list@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/math@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/path@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/platform@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/plugin@1.0.0-rc.6
  (transitive)

• - Removed

  @leafer/task@1.0.0-rc.6
  (transitive)

• Updated

  @leafer/event@1.0.0-rc.7

• Updated

  @leafer/math@1.0.0-rc.7