From c051291c6873fb16b367dbb808d29e29565cb533 Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Tue, 29 Oct 2024 18:21:20 +0900
Subject: [PATCH] =?UTF-8?q?=EB=B3=B5=EA=B5=AC=ED=95=A0=20=EC=98=A4?=
 =?UTF-8?q?=EB=B8=8C=EC=A0=9D=ED=8A=B8=20=ED=83=80=EC=9E=85=20common=20js?=
 =?UTF-8?q?=EB=A1=9C=20=EC=9D=B4=EB=8F=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/common/common.js   | 10 ++++++++++
 src/hooks/useCanvas.js | 29 ++++++++++++-----------------
 2 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/src/common/common.js b/src/common/common.js
index decf1aad..a0204047 100644
--- a/src/common/common.js
+++ b/src/common/common.js
@@ -1,3 +1,5 @@
+import { fabric } from 'fabric'
+
 export const MENU = {
   PLAN_DRAWING: 'planDrawing',
   INITIAL_CANVAS_SETTING: 'initialCanvasSetting', // 배치면 초기설정
@@ -152,3 +154,11 @@ export const SAVE_KEY = [
   'uuid',
   'originText',
 ]
+
+export const OBJECT_PROTOTYPE = [
+  fabric.Line.prototype,
+  fabric.Polygon.prototype,
+  fabric.Text.prototype,
+  fabric.IText.prototype,
+  fabric.Triangle.prototype,
+]
diff --git a/src/hooks/useCanvas.js b/src/hooks/useCanvas.js
index 5be247e9..6ffb03fc 100644
--- a/src/hooks/useCanvas.js
+++ b/src/hooks/useCanvas.js
@@ -13,7 +13,7 @@ import { writeImage } from '@/lib/canvas'
 import { useCanvasEvent } from '@/hooks/useCanvasEvent'
 import { useAxios } from '@/hooks/useAxios'
 import { useFont } from '@/hooks/common/useFont'
-import { SAVE_KEY } from '@/common/common'
+import { OBJECT_PROTOTYPE, RELOAD_TYPE_PROTOTYPE, SAVE_KEY } from '@/common/common'
 
 export function useCanvas(id) {
   const [canvas, setCanvas] = useRecoilState(canvasState)
@@ -105,24 +105,19 @@ export function useCanvas(id) {
     fabric.Object.prototype.cornerStrokeColor = '#2BEBC8'
     fabric.Object.prototype.cornerSize = 6
 
-    fabric.Line.prototype.toObject = function (propertiesToInclude) {
-      let source = {}
-      for (let key in this) {
-        if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) {
-          source.key = this[key]
+    // 해당 오브젝트 타입의 경우 저장한 값 그대로 불러와야함
+    OBJECT_PROTOTYPE.forEach((type) => {
+      type.toObject = function (propertiesToInclude) {
+        let source = {}
+        for (let key in this) {
+          if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) {
+            source.key = this[key]
+          }
         }
+        return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source)
       }
-      return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source)
-    }
-    fabric.Polygon.prototype.toObject = function (propertiesToInclude) {
-      let source = {}
-      for (let key in this) {
-        if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) {
-          source.key = this[key]
-        }
-      }
-      return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source)
-    }
+    })
+
     fabric.QLine = QLine
     fabric.QPolygon = QPolygon
     QPolygon.prototype.canvas = canvas