From 8bc0aa3e7b36380227492d5b779dfc2d3a84319e Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Mon, 2 Jan 2023 09:20:49 +0900
Subject: [PATCH] :art:

---
 packages/frontend/src/components/MkModal.vue | 18 +++++++++---------
 packages/frontend/src/scripts/touch.ts       | 18 ++++--------------
 2 files changed, 13 insertions(+), 23 deletions(-)

diff --git a/packages/frontend/src/components/MkModal.vue b/packages/frontend/src/components/MkModal.vue
index 5c7e7d6411..bc026fae6e 100644
--- a/packages/frontend/src/components/MkModal.vue
+++ b/packages/frontend/src/components/MkModal.vue
@@ -63,17 +63,17 @@ let transformOrigin = $ref('center');
 let showing = $ref(true);
 let content = $ref<HTMLElement>();
 const zIndex = os.claimZIndex(props.zPriority);
-const type = $computed(() => {
-	if (props.preferType === 'auto') {
-		if (!defaultStore.state.disableDrawer && isTouchUsing && deviceKind === 'smartphone') {
-			return 'drawer';
-		} else {
-			return props.src != null ? 'popup' : 'dialog';
-		}
+let type = $ref<ModalTypes>();
+console.log(props.preferType, isTouchUsing, deviceKind);
+if (props.preferType === 'auto') {
+	if (!defaultStore.state.disableDrawer && isTouchUsing && deviceKind === 'smartphone') {
+		type = 'drawer';
 	} else {
-		return props.preferType!;
+		type = props.src != null ? 'popup' : 'dialog';
 	}
-});
+} else {
+	type = props.preferType!;
+}
 let transitionName = $ref(defaultStore.state.animation ? (type === 'drawer') ? 'modal-drawer' : (type === 'popup') ? 'modal-popup' : 'modal' : '');
 let transitionDuration = $ref(defaultStore.state.animation ? 200 : 0);
 
diff --git a/packages/frontend/src/scripts/touch.ts b/packages/frontend/src/scripts/touch.ts
index 5251bc2e27..4afd0e5dd4 100644
--- a/packages/frontend/src/scripts/touch.ts
+++ b/packages/frontend/src/scripts/touch.ts
@@ -1,23 +1,13 @@
-const isTouchSupported = 'maxTouchPoints' in navigator && navigator.maxTouchPoints > 0;
+import { deviceKind } from '@/scripts/device-kind';
 
-export let isTouchUsing = false;
+const isTouchSupported = 'maxTouchPoints' in navigator && navigator.maxTouchPoints > 0;
 
-export let isScreenTouching = false;
+export let isTouchUsing = deviceKind === 'tablet' || deviceKind === 'smartphone';
 
-if (isTouchSupported) {
+if (isTouchSupported && !isTouchUsing) {
 	window.addEventListener('touchstart', () => {
 		// maxTouchPointsなどでの判定だけだと、「タッチ機能付きディスプレイを使っているがマウスでしか操作しない」場合にも
 		// タッチで使っていると判定されてしまうため、実際に一度でもタッチされたらtrueにする
 		isTouchUsing = true;
-
-		isScreenTouching = true;
-	}, { passive: true });
-	
-	window.addEventListener('touchend', () => {
-		// 子要素のtouchstartイベントでstopPropagation()が呼ばれると親要素に伝搬されずタッチされたと判定されないため、
-		// touchendイベントでもtouchstartイベントと同様にtrueにする
-		isTouchUsing = true;
-
-		isScreenTouching = false;
 	}, { passive: true });
 }
-- 
GitLab