mirrors/misskey
1
0
Fork 1
mirror of https://github.com/misskey-dev/misskey.git synced 2026-07-25 09:45:04 +02:00
Code Releases Activity

wip

Browse Source
This commit is contained in:
syuilo
2026-07-09 21:24:33 +09:00
parent 951e22242d
commit cf3b206ef4
2 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
packages/frontend/src/components/MkImageGallery.item.vue
View File

@@ -275,8 +275,8 @@ function onPointermove(ev: PointerEvent) {
verticalSwipeDelta += deltaY;
} else if (isHorizontalSwiping) {
//translation.value.x += deltaX;
horizontalSwipeDelta += deltaX;
emit('horizontalSwipe', currentPointerStartOffset.x - ev.clientX);
horizontalSwipeDelta = ev.clientX - currentPointerStartOffset.x;
emit('horizontalSwipe', horizontalSwipeDelta);
} else {
const isVerticalVector = Math.abs(deltaY) > Math.abs(deltaX);
if (isVerticalVector) {
@@ -305,8 +305,8 @@ function onPointerup(ev: PointerEvent) {
currentPointerId = null;
if (isVerticalSwiping) {
const shouldCloseByUpwardSwipe = verticalSwipeDelta < -200 || (verticalSwipeDelta < 0 && pointerVec.y < -3); // 上の方で離された、または上に向かって強めに弾かれた
const shouldCloseByDownwardSwipe = verticalSwipeDelta > 200 || (verticalSwipeDelta > 0 && pointerVec.y > 3); // 下の方で離された、または下に向かって強めに弾かれた
const shouldCloseByUpwardSwipe = verticalSwipeDelta < -200 || (verticalSwipeDelta < 0 && pointerVec.y < -5); // 上の方で離された、または上に向かって強めに弾かれた
const shouldCloseByDownwardSwipe = verticalSwipeDelta > 200 || (verticalSwipeDelta > 0 && pointerVec.y > 5); // 下の方で離された、または下に向かって強めに弾かれた
if (shouldCloseByUpwardSwipe || shouldCloseByDownwardSwipe) {
emit('close');
return;
@@ -314,8 +314,8 @@ function onPointerup(ev: PointerEvent) {
resetSizeAndTranslation();
} else if (isHorizontalSwiping) {
const shouldNext = horizontalSwipeDelta < -200 || (horizontalSwipeDelta < 0 && pointerVec.x < -3); // 左の方で離された、または左に向かって強めに弾かれた
const shouldPrev = horizontalSwipeDelta > 200 || (horizontalSwipeDelta > 0 && pointerVec.x > 3); // 右の方で離された、または右に向かって強めに弾かれた
const shouldNext = horizontalSwipeDelta < -150 || (horizontalSwipeDelta < 0 && pointerVec.x < -3); // 左の方で離された、または左に向かって強めに弾かれた
const shouldPrev = horizontalSwipeDelta > 150 || (horizontalSwipeDelta > 0 && pointerVec.x > 3); // 右の方で離された、または右に向かって強めに弾かれた
if (shouldNext) {
emit('next');
} else if (shouldPrev) {

12
packages/frontend/src/components/MkImageGallery.vue
View File

@@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div ref="rootEl" :class="$style.root" :style="{ zIndex }">
<div :class="[$style.bg]"></div>
<div ref="mainEl" :class="$style.main">
<div ref="itemsEl" :class="$style.items" :style="{ left: `-${imagesOffset}px` }">
<div ref="itemsEl" :class="$style.items" :style="{ left: `${imagesOffset}px` }">
<div v-for="image in images" :key="image.src" ref="itemEl" :class="$style.item">
<XItem
:image="image"
@@ -56,7 +56,7 @@ const itemsEl = useTemplateRef('itemsEl');
const itemEl = useTemplateRef('itemEl');
const zIndex = os.claimZIndex('high');
const screenWidth = ref(window.innerWidth);
const imagesOffset = ref(currentIndex * window.innerWidth);
const imagesOffset = ref(currentIndex * -window.innerWidth);
let currentScrollLeft = imagesOffset.value;
function onHorizontalSwipe(offset: number) {
@@ -64,10 +64,10 @@ function onHorizontalSwipe(offset: number) {
}
function scrollToCurrentIndex() {
currentScrollLeft = currentIndex * screenWidth.value;
currentScrollLeft = currentIndex * -screenWidth.value;
beginAnimation({
from: { value: imagesOffset.value },
to: { value: currentIndex * screenWidth.value },
to: { value: currentIndex * -screenWidth.value },
duration: 300,
easing: easing_easeInOutQuad,
apply: ({ value }) => {
@@ -83,15 +83,15 @@ function onCancelHorizontalSwipe() {
function onNext() {
if (currentIndex < props.images.length - 1) {
currentIndex++;
scrollToCurrentIndex();
}
scrollToCurrentIndex();
}
function onPrev() {
if (currentIndex > 0) {
currentIndex--;
scrollToCurrentIndex();
}
scrollToCurrentIndex();
}
function onItemClose() {