ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Larger max distance for animateScroll

Browse Source
This commit is contained in:
Alexander Zinchuk 2024-09-19 20:43:53 +02:00
parent e56461a43c
commit f5675ca3fc
4 changed files with 19 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/middle/message/hooks/useFocusMessage.ts
View File

@ -3,6 +3,7 @@ import { addExtraClass } from '../../../../lib/teact/teact-dom';
import type { FocusDirection, ScrollTargetPosition } from '../../../../types';
import { SCROLL_MAX_DISTANCE } from '../../../../config';
import {
requestForcedReflow, requestMeasure, requestMutation,
} from '../../../../lib/fasterdom/fasterdom';
@ -10,7 +11,7 @@ import animateScroll from '../../../../util/animateScroll';
// This is used when the viewport was replaced.
const BOTTOM_FOCUS_OFFSET = 500;
const RELOCATED_FOCUS_OFFSET = 750;
const RELOCATED_FOCUS_OFFSET = SCROLL_MAX_DISTANCE;
const FOCUS_MARGIN = 20;
export default function useFocusMessage(

10
src/config.ts
View File

@ -168,13 +168,13 @@ export const TMP_CHAT_ID = '0';
export const ANIMATION_END_DELAY = 100;
export const FAST_SMOOTH_MIN_DURATION = 300;
export const FAST_SMOOTH_MAX_DURATION = 600;
export const FAST_SMOOTH_MAX_DISTANCE = 750;
export const FAST_SMOOTH_SHORT_TRANSITION_MAX_DISTANCE = 300; // px
export const SCROLL_MIN_DURATION = 300;
export const SCROLL_MAX_DURATION = 600;
export const SCROLL_MAX_DISTANCE = 800;
export const SCROLL_SHORT_TRANSITION_MAX_DISTANCE = 300; // px
// Average duration of message sending animation
export const API_UPDATE_THROTTLE = Math.round((FAST_SMOOTH_MIN_DURATION + FAST_SMOOTH_MAX_DURATION) / 2);
export const API_UPDATE_THROTTLE = Math.round((SCROLL_MIN_DURATION + SCROLL_MAX_DURATION) / 2);
export const API_THROTTLE_RESET_UPDATES = new Set([
'newMessage', 'newScheduledMessage', 'deleteMessages', 'deleteScheduledMessages', 'deleteHistory',
]);

4
src/global/actions/ui/messages.ts
View File

@ -9,8 +9,8 @@ import { FocusDirection } from '../../../types';
import {
ANIMATION_END_DELAY,
FAST_SMOOTH_MAX_DURATION,
RELEASE_DATETIME,
SCROLL_MAX_DURATION,
SERVICE_NOTIFICATIONS_USER_ID,
} from '../../../config';
import { copyHtmlToClipboard } from '../../../util/clipboard';
@ -73,7 +73,7 @@ import {
import { getIsMobile } from '../../../hooks/useAppLayout';
const FOCUS_DURATION = 1500;
const FOCUS_NO_HIGHLIGHT_DURATION = FAST_SMOOTH_MAX_DURATION + ANIMATION_END_DELAY;
const FOCUS_NO_HIGHLIGHT_DURATION = SCROLL_MAX_DURATION + ANIMATION_END_DELAY;
const POLL_RESULT_OPEN_DELAY_MS = 450;
const VERSION_NOTIFICATION_DURATION = 1000 * 60 * 60 * 24 * 3; // 3 days
const SERVICE_NOTIFICATIONS_MAX_AMOUNT = 1e3;

20
src/util/animateScroll.ts
View File

@ -5,10 +5,10 @@ import type { ScrollTargetPosition } from '../types';
import { FocusDirection } from '../types';
import {
FAST_SMOOTH_MAX_DISTANCE,
FAST_SMOOTH_MAX_DURATION,
FAST_SMOOTH_MIN_DURATION,
FAST_SMOOTH_SHORT_TRANSITION_MAX_DISTANCE,
SCROLL_MAX_DISTANCE,
SCROLL_MAX_DURATION,
SCROLL_MIN_DURATION,
SCROLL_SHORT_TRANSITION_MAX_DISTANCE,
} from '../config';
import { requestMeasure, requestMutation } from '../lib/fasterdom/fasterdom';
import { selectCanAnimateInterface } from '../global/selectors';
@ -52,7 +52,7 @@ function createMutateFunction(
element: HTMLElement,
position: ScrollTargetPosition,
margin = 0,
maxDistance = FAST_SMOOTH_MAX_DISTANCE,
maxDistance = SCROLL_MAX_DISTANCE,
forceDirection?: FocusDirection,
forceDuration?: number,
forceNormalContainerHeight?: boolean,
@ -117,10 +117,10 @@ function createMutateFunction(
return;
}
const transition = absPath <= FAST_SMOOTH_SHORT_TRANSITION_MAX_DISTANCE ? shortTransition : longTransition;
const transition = absPath <= SCROLL_SHORT_TRANSITION_MAX_DISTANCE ? shortTransition : longTransition;
const duration = forceDuration || (
FAST_SMOOTH_MIN_DURATION
+ (absPath / FAST_SMOOTH_MAX_DISTANCE) * (FAST_SMOOTH_MAX_DURATION - FAST_SMOOTH_MIN_DURATION)
SCROLL_MIN_DURATION
+ (absPath / SCROLL_MAX_DISTANCE) * (SCROLL_MAX_DURATION - SCROLL_MIN_DURATION)
);
const startAt = Date.now();
@ -158,7 +158,7 @@ export function isAnimatingScroll() {
function calculateScrollFrom(
container: HTMLElement,
scrollTo: number,
maxDistance = FAST_SMOOTH_MAX_DISTANCE,
maxDistance = SCROLL_MAX_DISTANCE,
forceDirection?: FocusDirection,
) {
const { scrollTop } = container;
@ -185,5 +185,5 @@ function shortTransition(t: number) {
}
function longTransition(t: number) {
return 1 - ((1 - t) ** 6.5);
return 1 - ((1 - t) ** 6);
}