ding-image-editor 3.15.5 → 3.15.7

package/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for TOAST UI Image Editor v3.15.5
+// Type definitions for TOAST UI Image Editor v3.15.6
 // TypeScript Version: 3.2.2
 
 declare namespace tuiImageEditor {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ding-image-editor",
-  "version": "3.15.5",
+  "version": "3.15.7",
   "description": "TOAST UI ImageEditor",
   "keywords": [
     "nhn",

package/src/js/component/shape.js

@@ -226,6 +226,12 @@ export default class Shape extends Component {
 
       this._bindEventOnShape(shapeObj);
 
+      shapeObj.hasBorders = false;
+
+      console.log('shapObe',shapeObj)
+      shapeObj.borderColor ='black'
+      console.log('shapObe',shapeObj)
+
       canvas.add(shapeObj).setActiveObject(shapeObj);
 
       this._resetPositionFillFilter(shapeObj);

package/src/js/component/text.js

@@ -488,7 +488,7 @@ class Text extends Component {
    * @private
    */
   _onFabricSelect(fEvent) {
-    console.log('ssssssss')
+    console.log('sssssssddddddds')
     this.isPrevEditing = true;
 
     this.setSelectedInfo(fEvent.target, true);
@@ -525,6 +525,8 @@ class Text extends Component {
     const e = fEvent.e || {};
     const originPointer = this.getCanvas().getPointer(e);
 
+    console.log('_fireAddText')
+
     if (!obj) {
       this.fire(events.ADD_TEXT, {
         originPosition: {

package/src/js/component/zoom.js

@@ -562,10 +562,49 @@ class Zoom extends Component {
   _onMouseMoveWithHandMode({ e }) {
     const canvas = this.getCanvas();
     const { x, y } = canvas.getPointer(e);
+
+    
     const deltaX = x - this._startHandPoint.x;
     const deltaY = y - this._startHandPoint.y;
 
-    this._movePointOfZoom({ x: deltaX, y: deltaY });
+    console.log('deltaX',deltaX)
+    console.log('deltaY',deltaY)
+
+    const canvasImage = this.getCanvasImage()
+    const bounding = canvasImage.getBoundingRect();
+    console.log( bounding)
+
+    const halfWidth = Math.floor(bounding.width/2);
+    const left = Math.floor(Math.abs(bounding.left))
+    // 左移动
+    if(bounding.left<0 && deltaX>0 && Math.abs(deltaX) >  Math.abs(deltaY) ){
+      this._movePointOfZoom({ x: deltaX, y: 0 });
+    }
+    else if( bounding.left>0 && deltaX>0 && Math.abs(deltaX) >  Math.abs(deltaY) ){
+      this._movePointOfZoom({ x: -bounding.left, y: 0 });
+    }
+
+    // 右移动
+    if(left< halfWidth  && deltaX <0 &&  Math.abs(deltaX) >  Math.abs(deltaY) ){
+      this._movePointOfZoom({ x: deltaX, y: 0 });
+    }else if(left >halfWidth  && deltaX <0 &&  Math.abs(deltaX) >  Math.abs(deltaY) ){
+      this._movePointOfZoom({ x: left-halfWidth, y: 0 });
+    }
+   
+    // 上移动
+    const halfHeight = Math.floor(bounding.height/2);
+    const top = Math.floor(Math.abs(bounding.top))
+    if(bounding.top<0 && deltaY>0 &&  Math.abs(deltaX) < Math.abs(deltaY) ){
+      this._movePointOfZoom({ x: 0, y: deltaY });
+    }else if(bounding.top>0 && deltaY>0 &&  Math.abs(deltaX) < Math.abs(deltaY)){
+      this._movePointOfZoom({ x: 0, y: -bounding.top });
+    }
+    // 下移动
+    if(top<halfHeight && deltaY<0 &&  Math.abs(deltaX) < Math.abs(deltaY)){
+      this._movePointOfZoom({ x: 0, y: deltaY });
+    }else if(top>halfHeight && deltaY<0 &&  Math.abs(deltaX) < Math.abs(deltaY)){
+      this._movePointOfZoom({ x: 0, y: top-halfHeight });
+    }
   }
 
   /**