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