danog/telegram-tt
1
0
Fork 0
mirror of https://github.com/danog/telegram-tt.git synced 2025-01-21 21:01:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

Media Viewer: Various improvements and fixes (follow-up) (#1669)

Browse Source
This commit is contained in:
Alexander Zinchuk 2022-01-26 01:49:37 +01:00
parent 17a9965d64
commit b78365d21f
1 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/mediaViewer/MediaViewerSlides.tsx
View File

@ -48,7 +48,7 @@ const DEBOUNCE_ACTIVE = 800;
const MAX_ZOOM = 4;
const MIN_ZOOM = 0.6;
const DOUBLE_TAP_ZOOM = 3;
const CLICK_X_THRESHOLD = 120;
const CLICK_X_THRESHOLD = 40;
let cancelAnimation: Function | undefined;
type Transform = {
@ -106,8 +106,8 @@ const MediaViewerSlides: FC<OwnProps> = ({
const handleToggleFooterVisibility = useCallback((e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
if (!IS_TOUCH_ENV || !hasFooter || (!isPhoto && !isGif)) return;
if (e.clientX < CLICK_X_THRESHOLD) return;
if (e.clientX > window.innerWidth - CLICK_X_THRESHOLD) return;
if (e.pageX < CLICK_X_THRESHOLD) return;
if (e.pageX > window.innerWidth - CLICK_X_THRESHOLD) return;
setIsFooterHidden(!isFooterHidden);
}, [hasFooter, isFooterHidden, isGif, isPhoto]);
@ -140,9 +140,9 @@ const MediaViewerSlides: FC<OwnProps> = ({
const changeSlide = (e: MouseEvent) => {
if (transformRef.current.scale !== 1) return false;
let direction = 0;
if ((e as MouseEvent).clientX < CLICK_X_THRESHOLD) {
if (e.pageX < CLICK_X_THRESHOLD) {
direction = -1;
} else if ((e as MouseEvent).clientX > window.innerWidth - CLICK_X_THRESHOLD) {
} else if (e.pageX > window.innerWidth - CLICK_X_THRESHOLD) {
direction = 1;
}
const mId = getMessageId(activeMessageId, direction);
@ -174,14 +174,7 @@ const MediaViewerSlides: FC<OwnProps> = ({
return captureEvents(containerRef.current, {
isNotPassive: true,
excludedClosestSelector: '.VideoPlayerControls, .MediaViewerFooter',
onCapture: (event) => {
// Avoid conflicts with swipe-to-back gestures
if (event.type === 'touchstart' && IS_IOS) {
const x = (event as RealTouchEvent).touches[0].pageX;
if (x <= IOS_SCREEN_EDGE_THRESHOLD || x >= window.innerWidth - IOS_SCREEN_EDGE_THRESHOLD) {
event.preventDefault();
}
}
onCapture: () => {
lastGestureTime = Date.now();
if (arePropsShallowEqual(transformRef.current, { x: 0, y: 0, scale: 1 })) {
if (!activeSlideRef.current) return;
@ -195,6 +188,13 @@ const MediaViewerSlides: FC<OwnProps> = ({
dragOffsetX,
dragOffsetY,
}) => {
// Avoid conflicts with swipe-to-back gestures
if (IS_IOS) {
const { pageX } = (captureEvent as RealTouchEvent).touches[0];
if (pageX <= IOS_SCREEN_EDGE_THRESHOLD || pageX >= window.innerWidth - IOS_SCREEN_EDGE_THRESHOLD) {
return;
}
}
if (cancelAnimation) {
cancelAnimation();
cancelAnimation = undefined;