From 7578965300912259b4ccee1cd1e4f5245143598e Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Tue, 13 Aug 2024 10:56:41 +0900
Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EB=B6=95=20=EB=B0=A9=EC=9C=84=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useCanvas.js     |  4 ++++
 src/hooks/useMode.js       | 15 +++++++++++++++
 src/util/qpolygon-utils.js | 20 +++++++++++++++++++-
 3 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/src/hooks/useCanvas.js b/src/hooks/useCanvas.js
index 27c80187..4f5035bc 100644
--- a/src/hooks/useCanvas.js
+++ b/src/hooks/useCanvas.js
@@ -113,6 +113,10 @@ export function useCanvas(id) {
 
     if (target.name === 'trestle') {
       target.on('mousedown', () => {
+        if (target.defense === 'north') {
+          alert('북쪽은 선택 불가합니다.')
+          return
+        }
         if (target.get('selected')) {
           target.set({ strokeWidth: 1 })
           target.set({ strokeDashArray: [5, 5] })
diff --git a/src/hooks/useMode.js b/src/hooks/useMode.js
index 968c76ca..1782dde8 100644
--- a/src/hooks/useMode.js
+++ b/src/hooks/useMode.js
@@ -4293,6 +4293,7 @@ export function useMode() {
         selectable: false,
         fontSize: fontSize,
         name: 'trestle',
+        defense: roof.defense,
         lockMovementX: true, // X 축 이동 잠금
         lockMovementY: true, // Y 축 이동 잠금
         lockRotation: true, // 회전 잠금
@@ -4304,6 +4305,7 @@ export function useMode() {
 
       canvas?.add(trestlePoly)
     })
+    removeHelpPointAndHelpLine()
   }
 
   //배터리 셀 넣기
@@ -4556,6 +4558,19 @@ export function useMode() {
       })
   }
 
+  const removeHelpPointAndHelpLine = () => {
+    const helpPoints = canvas?.getObjects().filter((obj) => obj.name === 'helpPoint')
+    helpPoints.forEach((point) => {
+      canvas?.remove(point)
+    })
+
+    const helpLines = canvas?.getObjects().filter((obj) => obj.name === 'helpLine')
+    helpLines.forEach((line) => {
+      canvas?.remove(line)
+    })
+    canvas?.renderAll()
+  }
+
   return {
     mode,
     setMode,
diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js
index 77af0df5..527aee8d 100644
--- a/src/util/qpolygon-utils.js
+++ b/src/util/qpolygon-utils.js
@@ -1128,6 +1128,24 @@ export const splitPolygonWithLines = (polygon) => {
   })
 
   roofs.forEach((roofPoint, index) => {
+    let defense
+    const direction = getDirectionByPoint(roofPoint[0], roofPoint[roofPoint.length - 1])
+
+    switch (direction) {
+      case 'top':
+        defense = 'east'
+        break
+      case 'right':
+        defense = 'south'
+        break
+      case 'bottom':
+        defense = 'west'
+        break
+      case 'left':
+        defense = 'north'
+        break
+    }
+
     const roof = new QPolygon(roofPoint, {
       fontSize: polygon.fontSize,
       stroke: 'black',
@@ -1135,7 +1153,7 @@ export const splitPolygonWithLines = (polygon) => {
       strokeWidth: 3,
       name: 'roof',
       selectable: false,
-      startDirection: polygon.lines[index].direction,
+      defense: defense,
     })
 
     polygon.canvas.add(roof)