From 5adf049095f3c5de7c3faae227684f28fe4e904b Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Mon, 1 Jul 2024 14:26:31 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EB=B6=95=20=EC=99=B8=EA=B3=BD?= =?UTF-8?q?=EC=84=A0=20=EC=9E=90=EB=8F=99=20=EA=B7=B8=EB=A0=A4=EC=A3=BC?= =?UTF-8?q?=EA=B8=B0=20-=20=EB=94=94=EB=B2=84=EA=B9=85=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/useMode.js | 182 ++++++++++++++++++++++++++++++------------- 1 file changed, 128 insertions(+), 54 deletions(-) diff --git a/src/hooks/useMode.js b/src/hooks/useMode.js index 1098643f..cdad9d7f 100644 --- a/src/hooks/useMode.js +++ b/src/hooks/useMode.js @@ -400,76 +400,150 @@ export function useMode() { const handleOuterlines = () => { const newOuterlines = [] for (let i = 0; i < historyLines.current.length; i++) { - const tmp = historyLines.current[i + 1] - if (tmp !== undefined) { - if (tmp.direction === 'right') { + const next = historyLines.current[i + 1] + const prev = historyLines.current[i - 1] ?? historyLines.current[historyLines.current.length - 1] + if (next) { + if (next.direction === 'right') { // 다름 라인이 오른쪽으로 이동 if (historyLines.current[i].direction === 'top') { - newOuterlines.push({ - x1: historyLines.current[i].x1 - 50, - y1: historyLines.current[i].y1 + 50, - x2: historyLines.current[i].x2 - 50, - y2: historyLines.current[i].y2 - 50, - }) + if(prev.direction !== 'right') { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } } else { // bottom - newOuterlines.push({ - x1: historyLines.current[i].x1 - 50, - y1: historyLines.current[i].y1 - 50, - x2: historyLines.current[i].x2 - 50, - y2: historyLines.current[i].y2 + 50, - }) + if(prev?.direction !== 'right') { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 - 50, + y2: historyLines.current[i].y2 + 50, + }) + } } - } else if (tmp.direction === 'left') { + } else if (next.direction === 'left') { if (historyLines.current[i].direction === 'top') { - newOuterlines.push({ - x1: historyLines.current[i].x1 + 50, - y1: historyLines.current[i].y1 + 50, - x2: historyLines.current[i].x2 + 50, - y2: historyLines.current[i].y2 - 50, - }) + if(prev?.direction !== 'left') { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 - 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 - 50, + y2: historyLines.current[i].y2 + 50, + }) + } } else { // bottom - newOuterlines.push({ - x1: historyLines.current[i].x1 + 50, - y1: historyLines.current[i].y1 - 50, - x2: historyLines.current[i].x2 + 50, - y2: historyLines.current[i].y2 + 50, - }) + if(prev?.direction !== 'left') { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 - 50, + y2: historyLines.current[i].y2 - 50, + }) + } + } - } else if (tmp.direction === 'top') { + } else if (next.direction === 'top') { if (historyLines.current[i].direction === 'right') { - newOuterlines.push({ - x1: historyLines.current[i].x1 - 50, - y1: historyLines.current[i].y1 + 50, - x2: historyLines.current[i].x2 + 50, - y2: historyLines.current[i].y2 + 50, - }) + if(prev?.direction !== 'top') { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 + 50, + }) + } } else { // left - newOuterlines.push({ - x1: historyLines.current[i].x1 + 50, - y1: historyLines.current[i].y1 + 50, - x2: historyLines.current[i].x2 - 50, - y2: historyLines.current[i].y2 + 50, - }) + if(prev?.direction !== 'top') { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 - 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 - 50, + y2: historyLines.current[i].y2 + 50, + }) + } } - } else if (tmp.direction === 'bottom') { + } else if (next.direction === 'bottom') { if (historyLines.current[i].direction === 'right') { - newOuterlines.push({ - x1: historyLines.current[i].x1 - 50, - y1: historyLines.current[i].y1 - 50, - x2: historyLines.current[i].x2 + 50, - y2: historyLines.current[i].y2 - 50, - }) + if(prev?.direction !== 'bottom') { + newOuterlines.push({ + x1: historyLines.current[i].x1 - 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 - 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 - 50, + }) + } } else { // left - newOuterlines.push({ - x1: historyLines.current[i].x1 + 50, - y1: historyLines.current[i].y1 - 50, - x2: historyLines.current[i].x2 - 50, - y2: historyLines.current[i].y2 - 50, - }) + if(prev.direction !== 'bottom') { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 + 50, + x2: historyLines.current[i].x2 - 50, + y2: historyLines.current[i].y2 + 50, + }) + } else { + newOuterlines.push({ + x1: historyLines.current[i].x1 + 50, + y1: historyLines.current[i].y1 - 50, + x2: historyLines.current[i].x2 + 50, + y2: historyLines.current[i].y2 - 50, + }) + } } } } else {