@leafer-in/editor 1.9.11 → 1.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer-in/editor",
-  "version": "1.9.11",
+  "version": "1.10.0",
   "description": "@leafer-in/editor",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -34,10 +34,10 @@
     "leaferjs"
   ],
   "peerDependencies": {
-    "@leafer-ui/draw": "^1.9.11",
-    "@leafer-ui/core": "^1.9.11",
-    "@leafer-in/resize": "^1.9.11",
-    "@leafer-ui/interface": "^1.9.11",
-    "@leafer-in/interface": "^1.9.11"
+    "@leafer-ui/draw": "^1.10.0",
+    "@leafer-ui/core": "^1.10.0",
+    "@leafer-in/resize": "^1.10.0",
+    "@leafer-ui/interface": "^1.10.0",
+    "@leafer-in/interface": "^1.10.0"
   }
 }

package/src/Editor.ts

@@ -153,6 +153,13 @@ export class Editor extends Group implements IEditor {
         this.update()
     }
 
+
+    // editTool
+
+    public getEditTool(name: string): IEditTool {
+        return this.editToolList[name] = this.editToolList[name] || EditToolCreator.get(name, this)
+    }
+
     public updateEditTool(): void {
         this.unloadEditTool()
 
@@ -168,7 +175,7 @@ export class Editor extends Group implements IEditor {
             }
 
             if (EditToolCreator.list[name]) {
-                const tool = this.editTool = this.editToolList[name] = this.editToolList[name] || EditToolCreator.get(name, this)
+                const tool = this.editTool = this.getEditTool(name)
                 this.editBox.load()
                 tool.load()
                 this.update()
@@ -287,12 +294,16 @@ export class Editor extends Group implements IEditor {
 
     public emitGroupEvent(type: string, group?: IGroup): void {
         const event = new EditorGroupEvent(type, { editTarget: group })
-        if (!group || !group.syncEventer) this.emitEvent(event) // 单选时，元素会自动将事件传递给 editor，避免重复触发
+        this.emitEvent(event)
         if (group) group.emitEvent(event)
     }
 
     // inner
 
+    public getInnerEditor(name: string): IInnerEditor {
+        return this.editToolList[name] = this.editToolList[name] || EditToolCreator.get(name, this)
+    }
+
     public openInnerEditor(target?: IUI, nameOrSelect?: string | boolean, select?: boolean): void {
         let name: string
         if (isString(nameOrSelect)) name = nameOrSelect
@@ -314,7 +325,7 @@ export class Editor extends Group implements IEditor {
             if (EditToolCreator.list[name]) {
                 this.editTool.unload()
                 this.innerEditing = true
-                this.innerEditor = this.editToolList[name] = this.editToolList[name] || EditToolCreator.get(name, this)
+                this.innerEditor = this.getInnerEditor(name)
                 this.innerEditor.editTarget = target
 
                 this.emitInnerEvent(InnerEditorEvent.BEFORE_OPEN)
@@ -340,7 +351,7 @@ export class Editor extends Group implements IEditor {
     public emitInnerEvent(type: string): void {
         const { innerEditor } = this, { editTarget } = innerEditor
         const event = new InnerEditorEvent(type, { editTarget, innerEditor })
-        if (!editTarget.syncEventer) this.emitEvent(event) // 单选时，元素会自动将事件传递给 editor，避免重复触发
+        this.emitEvent(event)
         editTarget.emitEvent(event)
     }
 

package/src/display/EditBox.ts

@@ -111,10 +111,11 @@ export class EditBox extends Group implements IEditBox {
 
     public load(): void {
         const { target, mergeConfig, single, rect, circle, resizePoints, resizeLines } = this
-        const { stroke, strokeWidth, resizeLine, ignorePixelSnap } = mergeConfig
+        const { stroke, strokeWidth, ignorePixelSnap } = mergeConfig
 
         const pointsStyle = this.getPointsStyle()
         const middlePointsStyle = this.getMiddlePointsStyle()
+        const resizeLinesStyle = this.getResizeLinesStyle()
 
         this.visible = !target.locked
 
@@ -124,14 +125,14 @@ export class EditBox extends Group implements IEditBox {
             resizeP = resizePoints[i]
             resizeP.set(this.getPointStyle((i % 2) ? middlePointsStyle[((i - 1) / 2) % middlePointsStyle.length] : pointsStyle[(i / 2) % pointsStyle.length]))
             resizeP.rotation = ((i - (i % 2 ? 1 : 0)) / 2) * 90
-            if (i % 2) resizeLines[(i - 1) / 2].set({ pointType: 'resize', rotation: (i - 1) / 2 * 90, ...(resizeLine || {}) } as IEditPointInputData)
+            if (i % 2) resizeLines[(i - 1) / 2].set({ pointType: 'resize', rotation: (i - 1) / 2 * 90, ...(resizeLinesStyle[((i - 1) / 2) % resizeLinesStyle.length] || {}) } as IEditPointInputData)
         }
 
         // rotate
         circle.set(this.getPointStyle(mergeConfig.circle || mergeConfig.rotatePoint || pointsStyle[0]))
 
         // rect
-        rect.set({ stroke, strokeWidth, editConfig, ...(mergeConfig.rect || {}) })
+        rect.set({ stroke, strokeWidth, opacity: 1, editConfig, ...(mergeConfig.rect || {}) })
 
         // 编辑框作为底部虚拟元素， 在 unload() 中重置
         const rectThrough = isNull(mergeConfig.rectThrough) ? single : mergeConfig.rectThrough
@@ -271,7 +272,7 @@ export class EditBox extends Group implements IEditBox {
 
     public getPointStyle(userStyle?: IBoxInputData): IBoxInputData {
         const { stroke, strokeWidth, pointFill, pointSize, pointRadius } = this.mergedConfig
-        const defaultStyle = { fill: pointFill, stroke, strokeWidth, around: 'center', strokeAlign: 'center', width: pointSize, height: pointSize, cornerRadius: pointRadius, offsetX: 0, offsetY: 0, editConfig } as IBoxInputData
+        const defaultStyle = { fill: pointFill, stroke, strokeWidth, around: 'center', strokeAlign: 'center', opacity: 1, width: pointSize, height: pointSize, cornerRadius: pointRadius, offsetX: 0, offsetY: 0, editConfig } as IBoxInputData
         return userStyle ? Object.assign(defaultStyle, userStyle) : defaultStyle
     }
 
@@ -285,6 +286,11 @@ export class EditBox extends Group implements IEditBox {
         return isArray(middlePoint) ? middlePoint : (middlePoint ? [middlePoint] : this.getPointsStyle())
     }
 
+    public getResizeLinesStyle(): IBoxInputData[] {
+        const { resizeLine } = this.mergedConfig
+        return isArray(resizeLine) ? resizeLine : [resizeLine]
+    }
+
 
     // drag
 
@@ -330,7 +336,7 @@ export class EditBox extends Group implements IEditBox {
     // 操作事件共用
 
     public onTransformStart(e: IUIEvent): void {
-        if (this.moving) this.editor.opacity = this.mergedConfig.hideOnMove ? 0 : 1 // move
+        if (this.moving || this.gesturing) this.editor.opacity = this.mergedConfig.hideOnMove ? 0 : 1 // move
         if (this.resizing) ResizeEvent.resizingKeys = this.editor.leafList.keys // 记录正在resize中的元素列表
 
         const { dragStartData, target } = this
@@ -358,7 +364,11 @@ export class EditBox extends Group implements IEditBox {
             e.stop()
             if (isString(this.mergedConfig.moveable)) {
                 this.gesturing = this.moving = true
-                e.type === MoveEvent.START ? this.onTransformStart(e) : this.transformTool.onMove(e)
+                switch (e.type) {
+                    case MoveEvent.START: this.onTransformStart(e); break
+                    case MoveEvent.END: this.onTransformEnd(e); break
+                    default: this.transformTool.onMove(e)
+                }
             }
         }
     }
@@ -368,7 +378,11 @@ export class EditBox extends Group implements IEditBox {
             e.stop()
             if (isString(this.mergedConfig.resizeable)) {
                 this.gesturing = this.resizing = true
-                e.type === ZoomEvent.START ? this.onTransformStart(e) : this.transformTool.onScale(e)
+                switch (e.type) {
+                    case ZoomEvent.START: this.onTransformStart(e); break
+                    case ZoomEvent.END: this.onTransformEnd(e); break
+                    default: this.transformTool.onScale(e)
+                }
             }
         }
     }
@@ -378,19 +392,15 @@ export class EditBox extends Group implements IEditBox {
             e.stop()
             if (isString(this.mergedConfig.rotateable)) {
                 this.gesturing = this.rotating = true
-                e.type === RotateEvent.START ? this.onTransformStart(e) : this.transformTool.onRotate(e)
+                switch (e.type) {
+                    case ZoomEvent.START: this.onTransformStart(e); break
+                    case ZoomEvent.END: this.onTransformEnd(e); break
+                    default: this.transformTool.onRotate(e)
+                }
             }
         }
     }
 
-    public onGestureStart(e: IUIEvent): void {
-        if (this.canGesture && (e as MoveEvent).moveType !== 'drag') this.onTransformStart(e)
-    }
-
-    public onGestureEnd(e: IUIEvent): void {
-        if (this.canGesture && (e as MoveEvent).moveType !== 'drag') this.onTransformEnd(e)
-    }
-
     // 键盘
 
     public isHoldRotateKey(e: IUIEvent): boolean { // 按住ctrl在控制点上变旋转功能
@@ -487,12 +497,9 @@ export class EditBox extends Group implements IEditBox {
                     [[KeyEvent.HOLD, KeyEvent.UP], this.onKey, this],
                     [KeyEvent.DOWN, this.onArrow, this],
 
-                    [MoveEvent.BEFORE_MOVE, this.onMove, this, true],
-                    [ZoomEvent.BEFORE_ZOOM, this.onScale, this, true],
-                    [RotateEvent.BEFORE_ROTATE, this.onRotate, this, true],
-
-                    [[MoveEvent.START, ZoomEvent.START, RotateEvent.START], this.onGestureStart, this],
-                    [[MoveEvent.END, ZoomEvent.END, RotateEvent.END], this.onGestureEnd, this],
+                    [[MoveEvent.START, MoveEvent.BEFORE_MOVE, MoveEvent.END], this.onMove, this, true],
+                    [[ZoomEvent.START, ZoomEvent.BEFORE_ZOOM, ZoomEvent.END], this.onScale, this, true],
+                    [[RotateEvent.START, RotateEvent.BEFORE_ROTATE, RotateEvent.END], this.onRotate, this, true]
                 ])
             )
         })

package/src/display/Stroker.ts

@@ -84,8 +84,8 @@ export class Stroker extends UI implements IStroker {
 
                     }
 
-                    if (stroke) isString(stroke) ? Paint.stroke(stroke, this, canvas) : Paint.strokes(stroke, this, canvas)
-                    if (fill) isString(fill) ? Paint.fill(fill, this, canvas) : Paint.fills(fill, this, canvas)
+                    if (stroke) isString(stroke) ? Paint.stroke(stroke, this, canvas, options) : Paint.strokes(stroke, this, canvas, options)
+                    if (fill) isString(fill) ? Paint.fill(fill, this, canvas, options) : Paint.fills(fill, this, canvas, options)
                 }
             }
 

package/src/helper/EditDataHelper.ts

@@ -147,6 +147,9 @@ export const EditDataHelper = {
             scaleY = sign(scaleY) * lockScale
         }
 
+        isFinite(scaleX) || (scaleX = 1)
+        isFinite(scaleY) || (scaleY = 1)
+
         return { origin, scaleX, scaleY, direction, lockRatio, around }
     },
 

package/types/index.d.ts

@@ -96,6 +96,7 @@ declare class Editor extends Group implements IEditor {
     setBright(value: boolean): void;
     update(): void;
     updateEditBox(): void;
+    getEditTool(name: string): IEditTool;
     updateEditTool(): void;
     unloadEditTool(): void;
     getEditSize(_ui: IUI): IEditSize;
@@ -119,6 +120,7 @@ declare class Editor extends Group implements IEditor {
     checkOpenedGroups(): void;
     checkDeepSelect(): void;
     emitGroupEvent(type: string, group?: IGroup): void;
+    getInnerEditor(name: string): IInnerEditor;
     openInnerEditor(target?: IUI, nameOrSelect?: string | boolean, select?: boolean): void;
     closeInnerEditor(onlyInnerEditor?: boolean): void;
     emitInnerEvent(type: string): void;
@@ -182,6 +184,7 @@ declare class EditBox extends Group implements IEditBox {
     getPointStyle(userStyle?: IBoxInputData): IBoxInputData;
     getPointsStyle(): IBoxInputData[];
     getMiddlePointsStyle(): IBoxInputData[];
+    getResizeLinesStyle(): IBoxInputData[];
     onDragStart(e: DragEvent): void;
     onDrag(e: DragEvent): void;
     onDragEnd(e: DragEvent): void;
@@ -190,8 +193,6 @@ declare class EditBox extends Group implements IEditBox {
     onMove(e: MoveEvent): void;
     onScale(e: ZoomEvent): void;
     onRotate(e: RotateEvent): void;
-    onGestureStart(e: IUIEvent): void;
-    onGestureEnd(e: IUIEvent): void;
     isHoldRotateKey(e: IUIEvent): boolean;
     protected onKey(e: KeyEvent): void;
     onArrow(e: IKeyEvent): void;