Merge remote-tracking branch 'origin/normal-changes'

TheBrandwick · Aug 2, 2024 · ac19016 · ac19016
2 parents 509e354 + be3763e
commit ac19016
Show file tree

Hide file tree

Showing 10 changed files with 63 additions and 59 deletions.
diff --git a/apps/image-editor/index.d.ts b/apps/image-editor/index.d.ts
@@ -1,4 +1,4 @@
-// Type definitions for TOAST UI Image Editor v3.15.12
+// Type definitions for TOAST UI Image Editor v3.15.15
 // TypeScript Version: 3.2.2
 
 declare namespace tuiImageEditor {

diff --git a/apps/image-editor/package.json b/apps/image-editor/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@jaymanyoo/tui-image-editor",
-  "version": "3.15.12",
+  "version": "3.15.15",
   "description": "TOAST UI ImageEditor",
   "keywords": [
     "nhn",

diff --git a/apps/image-editor/src/js/imageEditor.js b/apps/image-editor/src/js/imageEditor.js
@@ -484,13 +484,13 @@ class ImageEditor {
    * @private
    */
   _onObjectActivated(props) {
-    const canvas = this._graphics.getCanvas();
-    const objects = canvas.getObjects();
-    let imageLayer = null;
-    imageLayer = objects[0];
-    if (props?.id === imageLayer.__fe_id) {
-      this.discardSelection();
-    }
+    // const canvas = this._graphics.getCanvas();
+    // const objects = canvas.getObjects();
+    // let imageLayer = null;
+    // imageLayer = objects[0];
+    // if (props?.id === imageLayer.__fe_id) {
+    //   this.discardSelection();
+    // }
     /**
      * The event when object is selected(aka activated).
      * @event ImageEditor#objectActivated
@@ -647,17 +647,17 @@ class ImageEditor {
    * @private
    */
   execute(commandName, ...args) {
-    const canvas = this._graphics.getCanvas();
-    const objects = canvas.getObjects();
-    let imageLayer = null;
-    imageLayer = objects[0];
-    if (
-      imageLayer?.length > 0 &&
-      args[0] === imageLayer?.__fe_id &&
-      commandName === 'changeTextStyle'
-    ) {
-      this.discardSelection();
-    }
+    // const canvas = this._graphics.getCanvas();
+    // const objects = canvas.getObjects();
+    // let imageLayer = null;
+    // imageLayer = objects[0];
+    // if (
+    //   imageLayer?.length > 0 &&
+    //   args[0] === imageLayer?.__fe_id &&
+    //   commandName === 'changeTextStyle'
+    // ) {
+    //   this.discardSelection();
+    // }
 
     // Inject an Graphics instance as first parameter
     const theArgs = [this._graphics].concat(args);
@@ -1268,13 +1268,13 @@ class ImageEditor {
    * });
    */
   changeTextStyle(id, styleObj, isSilent) {
-    const canvas = this._graphics.getCanvas();
-    const objects = canvas.getObjects();
-    let imageLayer = null;
-    imageLayer = objects[0];
-    if (id === imageLayer?.__fe_id) {
-      this.discardSelection();
-    }
+    // const canvas = this._graphics.getCanvas();
+    // const objects = canvas.getObjects();
+    // let imageLayer = null;
+    // imageLayer = objects[0];
+    // if (id === imageLayer?.__fe_id) {
+    //   this.discardSelection();
+    // }
     const executeMethodName = isSilent ? 'executeSilent' : 'execute';
 
     return this[executeMethodName](commands.CHANGE_TEXT_STYLE, id, styleObj);

diff --git a/apps/image-editor/src/js/ui/rotate.js b/apps/image-editor/src/js/ui/rotate.js
@@ -1,8 +1,8 @@
-import Range from '@/ui/tools/range';
+// import Range from '@/ui/tools/range';
 import Submenu from '@/ui/submenuBase';
 import templateHtml from '@/ui/template/submenu/rotate';
 import { toInteger, assignmentForDestroy } from '@/util';
-import { defaultRotateRangeValues } from '@/consts';
+// import { defaultRotateRangeValues } from '@/consts';
 
 const CLOCKWISE = 30;
 const COUNTERCLOCKWISE = -30;
@@ -26,22 +26,23 @@ class Rotate extends Submenu {
 
     this._els = {
       rotateButton: this.selector('.tie-rotate-button'),
-      rotateRange: new Range(
-        {
-          slider: this.selector('.tie-rotate-range'),
-          input: this.selector('.tie-rotate-range-value'),
-        },
-        defaultRotateRangeValues
-      ),
     };
   }
 
+  // rotateRange: new Range(
+  //   {
+  //     slider: this.selector('.tie-rotate-range'),
+  //     input: this.selector('.tie-rotate-range-value'),
+  //   },
+  //   defaultRotateRangeValues
+  // ),
+
   /**
    * Destroys the instance.
    */
   destroy() {
     this._removeEvent();
-    this._els.rotateRange.destroy();
+    // this._els.rotateRange.destroy();
 
     assignmentForDestroy(this);
   }
@@ -50,14 +51,18 @@ class Rotate extends Submenu {
     let resultAngle = angle;
 
     if (type === 'rotate') {
-      resultAngle = parseInt(this._els.rotateRange.value, 10) + angle;
+      let newAngle = this._els?.rotateRange?.value;
+      if (!newAngle) {
+        newAngle = 0;
+      }
+      resultAngle = parseInt(newAngle, 10) + angle;
     }
 
     this._setRangeBarRatio(resultAngle);
   }
 
-  _setRangeBarRatio(angle) {
-    this._els.rotateRange.value = angle;
+  _setRangeBarRatio() {
+    // this._els?.rotateRange?.value = angle;
   }
 
   /**
@@ -72,7 +77,7 @@ class Rotate extends Submenu {
     // {rotate, setAngle}
     this.actions = actions;
     this._els.rotateButton.addEventListener('click', this.eventHandler.rotationAngleChanged);
-    this._els.rotateRange.on('change', this._changeRotateForRange.bind(this));
+    // this._els.rotateRange.on('change', this._changeRotateForRange.bind(this));
   }
 
   /**
@@ -81,7 +86,7 @@ class Rotate extends Submenu {
    */
   _removeEvent() {
     this._els.rotateButton.removeEventListener('click', this.eventHandler.rotationAngleChanged);
-    this._els.rotateRange.off();
+    // this._els.rotateRange.off();
   }
 
   /**
@@ -103,7 +108,10 @@ class Rotate extends Submenu {
    */
   _changeRotateForButton(event) {
     const button = event.target.closest('.tui-image-editor-button');
-    const angle = this._els.rotateRange.value;
+    let angle = this._els?.rotateRange?.value;
+    if (!angle) {
+      angle = 0;
+    }
 
     if (button) {
       const rotateType = this.getButtonType(button, ['counterclockwise', 'clockwise']);

diff --git a/apps/image-editor/src/js/ui/shape.js b/apps/image-editor/src/js/ui/shape.js
@@ -180,6 +180,9 @@ class Shape extends Submenu {
    * @param {number} value - expect value for strokeRange change
    */
   setStrokeValue(value) {
+    if (!value) {
+      value = 1;
+    }
     this._els.strokeRange.value = value;
     this._els.strokeRange.trigger('change');
   }

diff --git a/apps/image-editor/src/js/ui/template/submenu/rotate.js b/apps/image-editor/src/js/ui/template/submenu/rotate.js
@@ -4,7 +4,7 @@
  *   @param {Function} makeSvgIcon - svg icon generator
  * @returns {string}
  */
-export default ({ locale, makeSvgIcon }) => `
+export default ({ makeSvgIcon }) => `
     <ul class="tui-image-editor-submenu-item">
         <li class="tie-rotate-button">
             <div class="tui-image-editor-button clockwise">
@@ -20,13 +20,5 @@ export default ({ locale, makeSvgIcon }) => `
                 <label> -30 </label>
             </div>
         </li>
-        <li class="tui-image-editor-partition only-left-right">
-            <div></div>
-        </li>
-        <li class="tui-image-editor-newline tui-image-editor-range-wrap">
-            <label class="range">${locale.localize('Range')}</label>
-            <div class="tie-rotate-range"></div>
-            <input class="tie-rotate-range-value tui-image-editor-range-value" value="0" />
-        </li>
     </ul>
 `;
diff --git a/apps/image-editor/src/js/ui/template/submenu/text.js b/apps/image-editor/src/js/ui/template/submenu/text.js
@@ -25,7 +25,7 @@ export default ({ locale, makeSvgIcon }) => `
                 </div>
                 <label> ${locale.localize('Underline')} </label>
             </div>
-            <div class="tui-image-editor-button addText">
+             <div class="tui-image-editor-button addText">
                 <div>
                     ${makeSvgIcon(['normal', 'active'], 'text', true)}
                 </div>

diff --git a/apps/image-editor/src/js/ui/text.js b/apps/image-editor/src/js/ui/text.js
@@ -233,6 +233,7 @@ class Text extends Submenu {
           autofocus: false,
         });
       }
+
       const styleObj = {
         bold: { fontWeight: 'bold' },
         italic: { fontStyle: 'italic' },

diff --git a/apps/react-image-editor/package.json b/apps/react-image-editor/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@jaymanyoo/react-image-editor",
-  "version": "3.15.12",
+  "version": "3.15.16",
   "description": "TOAST UI Image-Editor for React",
   "main": "dist/toastui-react-image-editor.js",
   "files": [
@@ -32,7 +32,7 @@
     "webpack-cli": "^5.1.4"
   },
   "dependencies": {
-    "@jaymanyoo/tui-image-editor": "^3.15.11",
+    "@jaymanyoo/tui-image-editor": "^3.15.15",
     "fabric": "^4.2.0"
   }
 }
diff --git a/package-lock.json b/package-lock.json