fix(study): Pencil 만 인식 + 더블탭 줌 차단
- isPenLike: 'touch' 제거. pen/mouse 만 허용 → 손가락 stroke/지우개 차단 - 페이지/툴바 영역에 touch-action: manipulation → 버튼 빠른 두 번 탭 시 iOS Safari 더블탭 줌 차단. 지우개/펜 토글 시 화면 확대되던 현상 fix.
This commit is contained in:
@@ -181,10 +181,9 @@
|
||||
}
|
||||
|
||||
function isPenLike(e: PointerEvent): boolean {
|
||||
// pen / mouse / touch 모두 stroke 허용. iPad Apple Pencil 이 'pen' 으로 안 들어오는
|
||||
// 케이스 보고됨 (브라우저/OS 버전에 따라). 우선 입력 가능성을 넓히고, palm rejection 은
|
||||
// Phase 2 에서 동시 다중 pointer 거부 등 다른 방식으로 처리.
|
||||
return e.pointerType === 'pen' || e.pointerType === 'mouse' || e.pointerType === 'touch';
|
||||
// 사용자 요청: Apple Pencil ('pen') 만 인식. 손가락 ('touch') 거부 — palm rejection.
|
||||
// 데스크톱 테스트용 'mouse' 는 허용.
|
||||
return e.pointerType === 'pen' || e.pointerType === 'mouse';
|
||||
}
|
||||
|
||||
// ── 지우개 hit-test ──
|
||||
@@ -412,9 +411,9 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col h-full">
|
||||
<!-- 툴바 -->
|
||||
<div class="flex items-center gap-1 px-2 py-1 border-b border-default bg-surface shrink-0">
|
||||
<div class="flex flex-col h-full" style="touch-action: manipulation;">
|
||||
<!-- 툴바 — touch-action: manipulation 으로 더블탭 줌 차단 -->
|
||||
<div class="flex items-center gap-1 px-2 py-1 border-b border-default bg-surface shrink-0" style="touch-action: manipulation;">
|
||||
<!-- Pen / Eraser 모드 토글 -->
|
||||
<button
|
||||
type="button"
|
||||
|
||||
@@ -108,7 +108,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="h-full flex flex-col relative">
|
||||
<div class="h-full flex flex-col relative" style="touch-action: manipulation;">
|
||||
<!-- 상단 헤더 -->
|
||||
<div class="flex items-center justify-between gap-2 px-3 py-2 border-b border-default bg-surface shrink-0 z-10">
|
||||
<Button href="/study/write" size="sm" variant="ghost" icon={ArrowLeft}>목록</Button>
|
||||
|
||||
Reference in New Issue
Block a user