@leafer/layout 1.0.0-rc.9 → 1.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer/layout",
-  "version": "1.0.0-rc.9",
+  "version": "1.0.1",
   "description": "@leafer/layout",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -15,17 +15,18 @@
     "type": "git",
     "url": "https://github.com/leaferjs/leafer.git"
   },
-  "homepage": "https://github.com/leaferjs/leafer/tree/main/packages/layout",
+  "homepage": "https://github.com/leaferjs/leafer/tree/main/packages/display-module/layout",
   "bugs": "https://github.com/leaferjs/leafer/issues",
   "keywords": [
     "leafer",
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/math": "1.0.0-rc.9",
-    "@leafer/platform": "1.0.0-rc.9"
+    "@leafer/math": "1.0.1",
+    "@leafer/helper": "1.0.1",
+    "@leafer/platform": "1.0.1"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-rc.9"
+    "@leafer/interface": "1.0.1"
   }
 }

package/src/LeafLayout.ts

@@ -1,9 +1,13 @@
-import { ILeaf, ILeafLayout, ILocationType, IBoundsType, IBoundsData, IMatrixData, ILayoutBoundsData, ILayoutData, IPointData } from '@leafer/interface'
-import { Bounds, BoundsHelper, Matrix, MatrixHelper } from '@leafer/math'
+import { ILeaf, ILeafLayout, ILocationType, IBoundsType, IBoundsData, IMatrixData, ILayoutBoundsData, IPointData } from '@leafer/interface'
+import { Bounds, BoundsHelper, MatrixHelper, PointHelper } from '@leafer/math'
+import { LeafHelper } from '@leafer/helper'
 import { Platform } from '@leafer/platform'
 
 
-const { toOuterOf, getPoints } = BoundsHelper
+const { getRelativeWorld } = LeafHelper
+const { toOuterOf, getPoints, copy } = BoundsHelper
+const localContent = '_localContentBounds'
+const worldContent = '_worldContentBounds', worldBox = '_worldBoxBounds', worldStroke = '_worldStrokeBounds'
 
 export class LeafLayout implements ILeafLayout {
 
@@ -11,22 +15,36 @@ export class LeafLayout implements ILeafLayout {
 
     public proxyZoom: boolean
 
-    // local
+    // inner
 
+    public get contentBounds(): IBoundsData { return this._contentBounds || this.boxBounds }
+    public set contentBounds(bounds: IBoundsData) { this._contentBounds = bounds }
     public boxBounds: IBoundsData
-    public strokeBounds: IBoundsData
-    public renderBounds: IBoundsData
+    public get strokeBounds(): IBoundsData { return this._strokeBounds || this.boxBounds }
+    public get renderBounds(): IBoundsData { return this._renderBounds || this.boxBounds }
 
-    // auto layout
-    public marginBounds: IBoundsData
-    public contentBounds: IBoundsData
+    public _contentBounds: IBoundsData
+    public _strokeBounds: IBoundsData
+    public _renderBounds: IBoundsData
 
     // local
 
-    public localStrokeBounds?: IBoundsData
-    public localRenderBounds?: IBoundsData
+    public get localContentBounds(): IBoundsData { toOuterOf(this.contentBounds, this.leaf.__localMatrix, this[localContent] || (this[localContent] = {} as IBoundsData)); return this[localContent] }
+    // localBoxBounds: IBoundsData // use leaf.__localBoxBounds
+    public get localStrokeBounds(): IBoundsData { return this._localStrokeBounds || this }
+    public get localRenderBounds(): IBoundsData { return this._localRenderBounds || this }
+
+    protected _localContentBounds?: IBoundsData
+    protected _localStrokeBounds?: IBoundsData
+    protected _localRenderBounds?: IBoundsData
+
+    // world
+
+    public get worldContentBounds(): IBoundsData { toOuterOf(this.contentBounds, this.leaf.__world, this[worldContent] || (this[worldContent] = {} as IBoundsData)); return this[worldContent] }
+    public get worldBoxBounds(): IBoundsData { toOuterOf(this.boxBounds, this.leaf.__world, this[worldBox] || (this[worldBox] = {} as IBoundsData)); return this[worldBox] }
+    public get worldStrokeBounds(): IBoundsData { toOuterOf(this.strokeBounds, this.leaf.__world, this[worldStroke] || (this[worldStroke] = {} as IBoundsData)); return this[worldStroke] }
+    // worldRenderBounds: IBoundsData // use leaf.__world
 
-    // world temp
     protected _worldContentBounds: IBoundsData
     protected _worldBoxBounds: IBoundsData
     protected _worldStrokeBounds: IBoundsData
@@ -64,8 +82,8 @@ export class LeafLayout implements ILeafLayout {
     public affectChildrenSort?: boolean
 
     public strokeSpread: number
-    public renderSpread: number
     public strokeBoxSpread: number
+    public renderSpread: number
     public renderShapeSpread: number
 
     // temp local
@@ -75,16 +93,26 @@ export class LeafLayout implements ILeafLayout {
     public get d() { return 1 }
     public get e() { return this.leaf.__.x }
     public get f() { return this.leaf.__.y }
+    public get x() { return this.e + this.boxBounds.x }
+    public get y() { return this.f + this.boxBounds.y }
+    public get width() { return this.boxBounds.width }
+    public get height() { return this.boxBounds.height }
 
 
     constructor(leaf: ILeaf) {
         this.leaf = leaf
-        this.renderBounds = this.strokeBounds = this.boxBounds = { x: 0, y: 0, width: 0, height: 0 }
-        if (leaf.__local) this.localRenderBounds = this.localStrokeBounds = leaf.__local
+        this.boxBounds = { x: 0, y: 0, width: 0, height: 0 }
+        if (this.leaf.__local) this._localRenderBounds = this._localStrokeBounds = this.leaf.__local
         this.boxChange()
         this.matrixChange()
     }
 
+    public createLocal(): void {
+        const local = this.leaf.__local = { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0, x: 0, y: 0, width: 0, height: 0 }
+        if (!this._localStrokeBounds) this._localStrokeBounds = local
+        if (!this._localRenderBounds) this._localRenderBounds = local
+    }
+
     public update(): void {
         const { leafer } = this.leaf
         if (leafer) {
@@ -102,15 +130,18 @@ export class LeafLayout implements ILeafLayout {
 
     public getTransform(relative: ILocationType | ILeaf = 'world'): IMatrixData {
         this.update()
+        const { leaf } = this
         switch (relative) {
             case 'world':
-                return this.leaf.__world
+                return leaf.__world
             case 'local':
-                return this.leaf.__localMatrix
+                return leaf.__localMatrix
             case 'inner':
                 return MatrixHelper.defaultMatrix
+            case 'page':
+                relative = leaf.zoomLayer
             default:
-                return new Matrix(this.leaf.__world).divideParent(relative.__world)
+                return getRelativeWorld(leaf, relative)
         }
     }
 
@@ -123,6 +154,8 @@ export class LeafLayout implements ILeafLayout {
                 return this.getLocalBounds(type)
             case 'inner':
                 return this.getInnerBounds(type)
+            case 'page':
+                relative = this.leaf.zoomLayer
             default:
                 return new Bounds(this.getInnerBounds(type)).toOuterOf(this.getTransform(relative))
         }
@@ -134,7 +167,6 @@ export class LeafLayout implements ILeafLayout {
                 return this.renderBounds
             case 'content':
                 if (this.contentBounds) return this.contentBounds
-            case 'margin':
             case 'box':
                 return this.boxBounds
             case 'stroke':
@@ -145,13 +177,13 @@ export class LeafLayout implements ILeafLayout {
     public getLocalBounds(type: IBoundsType = 'box'): IBoundsData {
         switch (type) {
             case 'render':
-                if (this.localRenderBounds) return this.localRenderBounds
+                return this.localRenderBounds
             case 'stroke':
-                if (this.localStrokeBounds) return this.localStrokeBounds
-            case 'margin':
+                return this.localStrokeBounds
             case 'content':
+                if (this.contentBounds) return this.localContentBounds
             case 'box':
-                return this.leaf.__localBounds
+                return this.leaf.__localBoxBounds
         }
     }
 
@@ -159,62 +191,56 @@ export class LeafLayout implements ILeafLayout {
         switch (type) {
             case 'render':
                 return this.leaf.__world
+            case 'stroke':
+                return this.worldStrokeBounds
             case 'content':
-                if (this.contentBounds) return this.getWorldContentBounds()
-            case 'margin':
+                if (this.contentBounds) return this.worldContentBounds
             case 'box':
-                return this.getWorldBoxBounds()
-            case 'margin':
-            case 'stroke':
-                return this.getWorldStrokeBounds()
+                return this.worldBoxBounds
         }
     }
 
     public getLayoutBounds(type?: IBoundsType, relative: ILocationType | ILeaf = 'world', unscale?: boolean): ILayoutBoundsData {
         const { leaf } = this
-        let point: IPointData, layout: ILayoutData
-        let bounds: IBoundsData = this.getInnerBounds(type)
+        let point: IPointData, matrix: IMatrixData, bounds: IBoundsData = this.getInnerBounds(type)
 
         switch (relative) {
             case 'world':
                 point = leaf.getWorldPoint(bounds)
-                layout = leaf.__world
+                matrix = leaf.__world
                 break
             case 'local':
                 point = leaf.getLocalPointByInner(bounds)
-                layout = leaf.__ as ILayoutData
+                matrix = leaf.__localMatrix
                 break
             case 'inner':
                 point = bounds
-                layout = MatrixHelper.defaultWorld
+                matrix = MatrixHelper.defaultMatrix
                 break
+            case 'page':
+                relative = leaf.zoomLayer
             default:
                 point = leaf.getWorldPoint(bounds, relative)
-                layout = leaf.__world
+                matrix = getRelativeWorld(leaf, relative, true)
         }
 
-        let { scaleX, scaleY, rotation, skewX, skewY } = layout
-        let { width, height } = bounds
-
-        if (typeof relative === 'object') {
-            const r = relative.__world
-            scaleX /= r.scaleX
-            scaleY /= r.scaleY
-            rotation -= r.rotation
-            skewX -= r.skewX
-            skewY -= r.skewY
-        }
+        const layoutBounds = MatrixHelper.getLayout(matrix) as ILayoutBoundsData
+        copy(layoutBounds, bounds)
+        PointHelper.copy(layoutBounds, point)
 
         if (unscale) {
-            const uScaleX = scaleX < 0 ? -scaleX : scaleX
-            const uScaleY = scaleY < 0 ? -scaleY : scaleY
-            scaleX /= uScaleX
-            scaleY /= uScaleY
-            width *= uScaleX
-            height *= uScaleY
+            const { scaleX, scaleY } = layoutBounds
+            const uScaleX = Math.abs(scaleX)
+            const uScaleY = Math.abs(scaleY)
+            if (uScaleX !== 1 || uScaleY !== 1) {
+                layoutBounds.scaleX /= uScaleX
+                layoutBounds.scaleY /= uScaleY
+                layoutBounds.width *= uScaleX
+                layoutBounds.height *= uScaleY
+            }
         }
 
-        return { x: point.x, y: point.y, scaleX, scaleY, rotation, skewX, skewY, width, height }
+        return layoutBounds
     }
 
     public getLayoutPoints(type?: IBoundsType, relative: ILocationType | ILeaf = 'world'): IPointData[] {
@@ -230,6 +256,8 @@ export class LeafLayout implements ILeafLayout {
                 break
             case 'inner':
                 break
+            case 'page':
+                relative = leaf.zoomLayer
             default:
                 relativeLeaf = relative
         }
@@ -237,47 +265,38 @@ export class LeafLayout implements ILeafLayout {
         return points
     }
 
-    protected getWorldContentBounds(): IBoundsData {
-        this._worldContentBounds || (this._worldContentBounds = {} as IBoundsData)
-        toOuterOf(this.contentBounds, this.leaf.__world, this._worldContentBounds)
-        return this._worldContentBounds
-    }
+    // 独立 / 引用 boxBounds
 
-    protected getWorldBoxBounds(): IBoundsData {
-        this._worldBoxBounds || (this._worldBoxBounds = {} as IBoundsData)
-        toOuterOf(this.boxBounds, this.leaf.__world, this._worldBoxBounds)
-        return this._worldBoxBounds
+    public shrinkContent(): void {
+        const { x, y, width, height } = this.boxBounds
+        this._contentBounds = { x, y, width, height }
     }
 
-    protected getWorldStrokeBounds(): IBoundsData {
-        this._worldStrokeBounds || (this._worldStrokeBounds = {} as IBoundsData)
-        toOuterOf(this.strokeBounds, this.leaf.__world, this._worldStrokeBounds)
-        return this._worldStrokeBounds
+    public spreadStroke(): void {
+        const { x, y, width, height } = this.strokeBounds
+        this._strokeBounds = { x, y, width, height }
+        this._localStrokeBounds = { x, y, width, height }
+        if (!this.renderSpread) this.spreadRenderCancel()
+    }
+    public spreadRender(): void {
+        const { x, y, width, height } = this.renderBounds
+        this._renderBounds = { x, y, width, height }
+        this._localRenderBounds = { x, y, width, height }
     }
 
-    // 独立 / 引用 boxBounds
+    public shrinkContentCancel(): void {
+        this._contentBounds = undefined
+    }
 
     public spreadStrokeCancel(): void {
         const same = this.renderBounds === this.strokeBounds
-        this.strokeBounds = this.boxBounds
-        this.localStrokeBounds = this.leaf.__localBounds
+        this._strokeBounds = this.boxBounds
+        this._localStrokeBounds = this.leaf.__localBoxBounds
         if (same) this.spreadRenderCancel()
     }
     public spreadRenderCancel(): void {
-        this.renderBounds = this.strokeBounds
-        this.localRenderBounds = this.localStrokeBounds
-    }
-
-    public spreadStroke(): void {
-        const { x, y, width, height } = this.strokeBounds
-        this.strokeBounds = { x, y, width, height }
-        this.localStrokeBounds = { x, y, width, height }
-        if (!this.renderSpread) this.spreadRenderCancel()
-    }
-    public spreadRender(): void {
-        const { x, y, width, height } = this.renderBounds
-        this.renderBounds = { x, y, width, height }
-        this.localRenderBounds = { x, y, width, height }
+        this._renderBounds = this._strokeBounds
+        this._localRenderBounds = this._localStrokeBounds
     }
 
 
@@ -324,6 +343,7 @@ export class LeafLayout implements ILeafLayout {
     protected _scaleOrRotationChange() {
         this.affectScaleOrRotation = true
         this.matrixChange()
+        if (!this.leaf.__local) this.createLocal()
     }
 
     public matrixChange(): void {

package/types/index.d.ts

@@ -3,13 +3,23 @@ import { ILeafLayout, ILeaf, IBoundsData, ILocationType, IMatrixData, IBoundsTyp
 declare class LeafLayout implements ILeafLayout {
     leaf: ILeaf;
     proxyZoom: boolean;
+    get contentBounds(): IBoundsData;
+    set contentBounds(bounds: IBoundsData);
     boxBounds: IBoundsData;
-    strokeBounds: IBoundsData;
-    renderBounds: IBoundsData;
-    marginBounds: IBoundsData;
-    contentBounds: IBoundsData;
-    localStrokeBounds?: IBoundsData;
-    localRenderBounds?: IBoundsData;
+    get strokeBounds(): IBoundsData;
+    get renderBounds(): IBoundsData;
+    _contentBounds: IBoundsData;
+    _strokeBounds: IBoundsData;
+    _renderBounds: IBoundsData;
+    get localContentBounds(): IBoundsData;
+    get localStrokeBounds(): IBoundsData;
+    get localRenderBounds(): IBoundsData;
+    protected _localContentBounds?: IBoundsData;
+    protected _localStrokeBounds?: IBoundsData;
+    protected _localRenderBounds?: IBoundsData;
+    get worldContentBounds(): IBoundsData;
+    get worldBoxBounds(): IBoundsData;
+    get worldStrokeBounds(): IBoundsData;
     protected _worldContentBounds: IBoundsData;
     protected _worldBoxBounds: IBoundsData;
     protected _worldStrokeBounds: IBoundsData;
@@ -31,8 +41,8 @@ declare class LeafLayout implements ILeafLayout {
     affectRotation: boolean;
     affectChildrenSort?: boolean;
     strokeSpread: number;
-    renderSpread: number;
     strokeBoxSpread: number;
+    renderSpread: number;
     renderShapeSpread: number;
     get a(): number;
     get b(): number;
@@ -40,7 +50,12 @@ declare class LeafLayout implements ILeafLayout {
     get d(): number;
     get e(): number;
     get f(): number;
+    get x(): number;
+    get y(): number;
+    get width(): number;
+    get height(): number;
     constructor(leaf: ILeaf);
+    createLocal(): void;
     update(): void;
     getTransform(relative?: ILocationType | ILeaf): IMatrixData;
     getBounds(type?: IBoundsType, relative?: ILocationType | ILeaf): IBoundsData;
@@ -49,13 +64,12 @@ declare class LeafLayout implements ILeafLayout {
     getWorldBounds(type?: IBoundsType): IBoundsData;
     getLayoutBounds(type?: IBoundsType, relative?: ILocationType | ILeaf, unscale?: boolean): ILayoutBoundsData;
     getLayoutPoints(type?: IBoundsType, relative?: ILocationType | ILeaf): IPointData[];
-    protected getWorldContentBounds(): IBoundsData;
-    protected getWorldBoxBounds(): IBoundsData;
-    protected getWorldStrokeBounds(): IBoundsData;
-    spreadStrokeCancel(): void;
-    spreadRenderCancel(): void;
+    shrinkContent(): void;
     spreadStroke(): void;
     spreadRender(): void;
+    shrinkContentCancel(): void;
+    spreadStrokeCancel(): void;
+    spreadRenderCancel(): void;
     boxChange(): void;
     localBoxChange(): void;
     strokeChange(): void;