키보드 이벤트 제거
This commit is contained in:
parent
f8641079e6
commit
577ca47b5e
@ -24,7 +24,7 @@ export function useCanvasEvent() {
|
||||
useEffect(() => {
|
||||
canvas?.setZoom(canvasZoom / 100)
|
||||
}, [canvasZoom])
|
||||
|
||||
|
||||
// canvasZoom이 100으로 변경되고 shouldCenter가 true일 때만 중앙 정렬 실행
|
||||
useEffect(() => {
|
||||
if (canvasZoom === 100 && canvas && shouldCenter) {
|
||||
@ -278,27 +278,27 @@ export function useCanvasEvent() {
|
||||
switch (key) {
|
||||
case 'Delete':
|
||||
case 'Backspace':
|
||||
handleDelete()
|
||||
// handleDelete()
|
||||
break
|
||||
case 'Down': // IE/Edge에서 사용되는 값
|
||||
case 'ArrowDown':
|
||||
// "아래 화살표" 키가 눌렸을 때의 동작입니다.
|
||||
moveDown()
|
||||
// moveDown()
|
||||
break
|
||||
case 'Up': // IE/Edge에서 사용되는 값
|
||||
case 'ArrowUp':
|
||||
// "위 화살표" 키가 눌렸을 때의 동작입니다.
|
||||
moveUp()
|
||||
// moveUp()
|
||||
break
|
||||
case 'Left': // IE/Edge에서 사용되는 값
|
||||
case 'ArrowLeft':
|
||||
// "왼쪽 화살표" 키가 눌렸을 때의 동작입니다.
|
||||
moveLeft()
|
||||
// moveLeft()
|
||||
break
|
||||
case 'Right': // IE/Edge에서 사용되는 값
|
||||
case 'ArrowRight':
|
||||
// "오른쪽 화살표" 키가 눌렸을 때의 동작입니다.
|
||||
moveRight()
|
||||
// moveRight()
|
||||
break
|
||||
case 'Enter':
|
||||
// "enter" 또는 "return" 키가 눌렸을 때의 동작입니다.
|
||||
@ -437,22 +437,21 @@ export function useCanvasEvent() {
|
||||
// 주요 도형 객체만 필터링 (roof, arrow 등)
|
||||
const objects = allObjects.filter((obj) => {
|
||||
// 주요 도형 객체만 포함
|
||||
return obj.name === 'roof' ||
|
||||
obj.name === 'arrow' ||
|
||||
obj.name === 'module' ||
|
||||
obj.name === 'dormer' ||
|
||||
obj.name === 'object'
|
||||
return obj.name === 'roof' || obj.name === 'arrow' || obj.name === 'module' || obj.name === 'dormer' || obj.name === 'object'
|
||||
})
|
||||
|
||||
|
||||
console.log('🔍 All objects:', allObjects.length)
|
||||
console.log('🔍 Main objects for centering:', objects.length)
|
||||
console.log('🔍 Main object details:', objects.map(obj => ({
|
||||
name: obj.name,
|
||||
type: obj.type,
|
||||
visible: obj.visible,
|
||||
id: obj.id
|
||||
})))
|
||||
|
||||
console.log(
|
||||
'🔍 Main object details:',
|
||||
objects.map((obj) => ({
|
||||
name: obj.name,
|
||||
type: obj.type,
|
||||
visible: obj.visible,
|
||||
id: obj.id,
|
||||
})),
|
||||
)
|
||||
|
||||
if (objects.length === 0) {
|
||||
console.log('❌ No main objects found for centering')
|
||||
return
|
||||
@ -473,50 +472,50 @@ export function useCanvasEvent() {
|
||||
|
||||
const objectsCenterX = (minX + maxX) / 2
|
||||
const objectsCenterY = (minY + maxY) / 2
|
||||
|
||||
|
||||
// 화면 중앙 좌표 (메뉴 높이 고려하여 Y 위치 조정)
|
||||
const screenCenterX = canvas.getWidth() / 2
|
||||
const menuHeightOffset = 80 // 위쪽 메뉴 높이만큼 위로 조정
|
||||
const screenCenterY = canvas.getHeight() / 2 - menuHeightOffset
|
||||
|
||||
|
||||
// 객체 중심을 화면 중앙으로 이동
|
||||
const deltaX = screenCenterX - objectsCenterX
|
||||
const deltaY = screenCenterY - objectsCenterY
|
||||
|
||||
|
||||
// canvas viewport transform 조정
|
||||
const viewportTransform = canvas.viewportTransform
|
||||
viewportTransform[4] += deltaX
|
||||
viewportTransform[5] += deltaY
|
||||
|
||||
|
||||
canvas.setViewportTransform(viewportTransform)
|
||||
|
||||
|
||||
// 브라우저 스크롤을 중앙으로 조정하여 전체 canvas를 모니터 중앙에 위치
|
||||
const canvasElement = canvas.getElement()
|
||||
const canvasRect = canvasElement.getBoundingClientRect()
|
||||
|
||||
|
||||
// 현재 스크롤 위치
|
||||
const currentScrollTop = window.pageYOffset || document.documentElement.scrollTop
|
||||
const currentScrollLeft = window.pageXOffset || document.documentElement.scrollLeft
|
||||
|
||||
|
||||
// canvas의 현재 화면 위치
|
||||
const canvasScreenTop = canvasRect.top + currentScrollTop
|
||||
const canvasScreenLeft = canvasRect.left + currentScrollLeft
|
||||
|
||||
|
||||
// 모니터 중앙
|
||||
const monitorCenterX = window.innerWidth / 2
|
||||
const monitorCenterY = window.innerHeight / 2
|
||||
|
||||
|
||||
// canvas가 모니터 중앙에 오도록 스크롤 위치 계산
|
||||
const targetScrollLeft = canvasScreenLeft + (canvasRect.width / 2) - monitorCenterX
|
||||
const targetScrollTop = canvasScreenTop + (canvasRect.height / 2) - monitorCenterY + menuHeightOffset
|
||||
|
||||
const targetScrollLeft = canvasScreenLeft + canvasRect.width / 2 - monitorCenterX
|
||||
const targetScrollTop = canvasScreenTop + canvasRect.height / 2 - monitorCenterY + menuHeightOffset
|
||||
|
||||
// 스크롤을 중앙으로 이동
|
||||
window.scrollTo({
|
||||
top: targetScrollTop,
|
||||
left: targetScrollLeft,
|
||||
behavior: 'smooth' // 부드러운 스크롤
|
||||
behavior: 'smooth', // 부드러운 스크롤
|
||||
})
|
||||
|
||||
|
||||
canvas.renderAll()
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user