@leafer-in/editor 1.0.1 → 1.0.3

package/src/Editor.ts

@@ -1,5 +1,5 @@
 import { IGroupInputData, IUI, IEventListenerId, IPointData, ILeafList, IEditSize, IGroup, IObject, IAlign, IAxis, IFunction, ILayoutBoundsData } from '@leafer-ui/interface'
-import { Group, Rect, DataHelper, MathHelper, LeafList, Matrix, RenderEvent, LeafHelper } from '@leafer-ui/draw'
+import { Group, Rect, DataHelper, MathHelper, LeafList, Matrix, RenderEvent, LeafHelper, Direction9 } from '@leafer-ui/draw'
 import { DragEvent, RotateEvent, KeyEvent, ZoomEvent, MoveEvent } from '@leafer-ui/core'
 
 import { IEditBox, IEditPoint, IEditor, IEditorConfig, IEditTool, IEditorScaleEvent, IInnerEditor } from '@leafer-in/interface'
@@ -28,7 +28,7 @@ import { EditorGroupEvent } from './event/EditorGroupEvent'
 
 export class Editor extends Group implements IEditor {
 
-    public config = config
+    public config = DataHelper.clone(config)
 
     public get mergeConfig(): IEditorConfig {
         const { element, config } = this
@@ -52,6 +52,7 @@ export class Editor extends Group implements IEditor {
     public get editing(): boolean { return !!this.list.length }
     public innerEditing: boolean
     public get groupOpening(): boolean { return !!this.openedGroupList.length }
+    public resizeDirection?: Direction9
 
     public get multiple(): boolean { return this.list.length > 1 }
     public get single(): boolean { return this.list.length === 1 }
@@ -186,7 +187,7 @@ export class Editor extends Group implements IEditor {
 
         if (e instanceof ZoomEvent) {
 
-            if (resizeable === 'zoom') e.stop(), this.scaleOf(element.getInnerPoint(e), e.scale, e.scale)
+            if (resizeable === 'zoom') e.stop(), this.scaleOf(element.getBoxPoint(e), e.scale, e.scale)
 
         } else {
 
@@ -217,13 +218,13 @@ export class Editor extends Group implements IEditor {
 
         if (e instanceof RotateEvent) {
 
-            if (rotateable === 'rotate') e.stop(), rotation = e.rotation, origin = element.getInnerPoint(e)
+            if (rotateable === 'rotate') e.stop(), rotation = e.rotation, origin = element.getBoxPoint(e)
             else return
 
         } else {
 
             const last = { x: e.x - e.moveX, y: e.y - e.moveY }
-            const data = EditDataHelper.getRotateData(element.boxBounds, direction, e.getInner(element), element.getInnerPoint(last), e.shiftKey ? null : (element.around || element.origin || around || 'center'))
+            const data = EditDataHelper.getRotateData(element.boxBounds, direction, e.getBoxPoint(element), element.getBoxPoint(last), e.shiftKey ? null : (element.around || element.origin || around || 'center'))
             rotation = data.rotation
             origin = data.origin
 

package/src/display/EditBox.ts

@@ -242,6 +242,7 @@ export class EditBox extends Group implements IEditBox {
             editor.opacity = editor.mergeConfig.hideOnMove ? 0 : 1 // move
         } else if ((e.current as IEditPoint).pointType === 'resize') {
             editor.dragStartBounds = { ...editor.element.getLayoutBounds('box', 'local') }
+            editor.resizeDirection = (e.current as IEditPoint).direction
         }
     }
 
@@ -249,6 +250,7 @@ export class EditBox extends Group implements IEditBox {
         this.dragging = false
         this.moving = false
         if (e.current.name === 'rect') this.editor.opacity = 1 // move
+        this.editor.resizeDirection = undefined
 
     }
 

package/src/display/EditSelect.ts

@@ -139,7 +139,7 @@ export class EditSelect extends Group implements IEditSelect {
         if (this.allowDrag(e)) {
             const { editor } = this
             const { stroke, area } = editor.mergeConfig
-            const { x, y } = e.getInner(this)
+            const { x, y } = e.getInnerPoint(this)
 
             this.bounds.set(x, y)
 

package/src/editor/target.ts

@@ -13,6 +13,7 @@ export function onTarget(editor: IEditor, oldValue: IUI | IUI[]): void {
         editor.leafList = target instanceof LeafList ? target : new LeafList(target instanceof Array ? target : target as IUI)
     } else {
         editor.leafList.reset()
+        editor.closeInnerEditor()
     }
 
     editor.emitEvent(new EditorEvent(EditorEvent.SELECT, { editor, value: target, oldValue }))

package/src/helper/EditDataHelper.ts

@@ -86,7 +86,20 @@ export const EditDataHelper = {
         if (lockRatio) {
             const unlockSide = lockRatio === 'corner' && direction % 2
             if (!unlockSide) {
-                const scale = Math.sqrt(Math.abs(scaleX * scaleY))
+                let scale: number
+                switch (direction) {
+                    case top:
+                    case bottom:
+                        scale = scaleY
+                        break
+                    case left:
+                    case right:
+                        scale = scaleX
+                        break
+                    default:
+                        scale = Math.sqrt(Math.abs(scaleX * scaleY))
+
+                }
                 scaleX = scaleX < 0 ? -scale : scale
                 scaleY = scaleY < 0 ? -scale : scale
             }
@@ -115,7 +128,9 @@ export const EditDataHelper = {
         }
 
 
-        toPoint(around || align, boxBounds, origin)
+        toPoint(around || align, boxBounds, origin, true)
+
+        console.log({ origin, scaleX, scaleY, direction, lockRatio, around })
 
         return { origin, scaleX, scaleY, direction, lockRatio, around }
     },
@@ -140,7 +155,7 @@ export const EditDataHelper = {
                 align = 'center'
         }
 
-        toPoint(around || align, bounds, origin)
+        toPoint(around || align, bounds, origin, true)
 
         return { origin, rotation: PointHelper.getRotation(last, origin, current) }
     },
@@ -171,12 +186,12 @@ export const EditDataHelper = {
                 skewY = 1
         }
 
-        const { x, y, width, height } = bounds
+        const { width, height } = bounds
 
-        last.x = x + last.x * width
-        last.y = y + last.y * height
+        last.x = last.x * width
+        last.y = last.y * height
 
-        toPoint(around || align, bounds, origin)
+        toPoint(around || align, bounds, origin, true)
 
         const rotation = PointHelper.getRotation(last, origin, { x: last.x + (skewX ? move.x : 0), y: last.y + (skewY ? move.y : 0) })
         skewX ? skewX = -rotation : skewY = rotation

package/types/index.d.ts

@@ -1,6 +1,6 @@
 export * from '@leafer-in/resize';
-import { IBounds, ILeafList, IUI, IFunction, IEventListenerId, ILeaf, IPointerEvent, ILeaferCanvas, IRenderOptions, IGroup, IObject, IPointData, ILayoutBoundsData, IGroupInputData, IEditSize, IAlign, IAxis, IBox, IBoundsData, IEditorConfig as IEditorConfig$1, IBoxInputData, IKeyEvent, IRect, IRectInputData, IMatrixData, IDragEvent, IAround } from '@leafer-ui/interface';
-import { Group, UI, Matrix, Event, Direction9, Box, Answer } from '@leafer-ui/draw';
+import { IBounds, ILeafList, IUI, IFunction, IEventListenerId, ILeaf, IPointerEvent, ILeaferCanvas, IRenderOptions, IObject, IGroup, IPointData, ILayoutBoundsData, IGroupInputData, IEditSize, IAlign, IAxis, IBox, IBoundsData, IEditorConfig as IEditorConfig$1, IBoxInputData, IKeyEvent, IRect, IRectInputData, IMatrixData, IDragEvent, IAround } from '@leafer-ui/interface';
+import { Group, UI, Direction9, Matrix, Event, Box, Answer } from '@leafer-ui/draw';
 import { PointerEvent, DragEvent, MoveEvent, ZoomEvent, RotateEvent } from '@leafer-ui/core';
 import { IEditSelect, IEditor, IStroker, ISelectArea, IEditorConfig, IEditBox, IEditTool, IInnerEditor, IEditorScaleEvent, IEditorEvent, IEditPoint, IEditPointType, IEditorMoveEvent, IEditorRotateEvent, IEditorSkewEvent, IEditorGroupEvent, IInnerEditorEvent, IUI as IUI$1, IDragEvent as IDragEvent$1, IPointData as IPointData$1, IPathCommandData, IFromToData, IAround as IAround$1 } from '@leafer-in/interface';
 
@@ -48,7 +48,7 @@ declare class EditMask extends UI {
 }
 
 declare class Editor extends Group implements IEditor {
-    config: IEditorConfig;
+    config: IObject;
     get mergeConfig(): IEditorConfig;
     hoverTarget?: IUI;
     target?: IUI | IUI[];
@@ -58,6 +58,7 @@ declare class Editor extends Group implements IEditor {
     get editing(): boolean;
     innerEditing: boolean;
     get groupOpening(): boolean;
+    resizeDirection?: Direction9;
     get multiple(): boolean;
     get single(): boolean;
     get dragging(): boolean;