mirror of
https://github.com/danog/telegram-tt.git
synced 2025-01-22 05:11:55 +01:00
Prevent more animations when animations are turned off
This commit is contained in:
parent
aa3a02a4d5
commit
4180e58f3b
@ -6,7 +6,7 @@
|
||||
height: 0 !important;
|
||||
}
|
||||
|
||||
body.animation-level-0 {
|
||||
body.animation-level-0 & {
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
|
@ -2,6 +2,10 @@
|
||||
height: 2.625rem;
|
||||
transition: height 150ms ease-out, opacity 150ms ease-out;
|
||||
|
||||
body.animation-level-0 & {
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
&:not(.open) {
|
||||
height: 0 !important;
|
||||
}
|
||||
|
@ -1,5 +1,8 @@
|
||||
import { getGlobal } from '../lib/teact/teactn';
|
||||
|
||||
import { FocusDirection } from '../types';
|
||||
|
||||
import { ANIMATION_LEVEL_MIN } from '../config';
|
||||
import { dispatchHeavyAnimationEvent } from '../hooks/useHeavyAnimationCheck';
|
||||
import { fastRaf } from './schedulers';
|
||||
import { animateSingle } from './animation';
|
||||
@ -50,6 +53,10 @@ export default function fastSmoothScroll(
|
||||
container.scrollTop = Math.max(0, offsetTop - maxDistance);
|
||||
}
|
||||
|
||||
if (getGlobal().settings.byKey.animationLevel === ANIMATION_LEVEL_MIN) {
|
||||
forceDuration = 0;
|
||||
}
|
||||
|
||||
isAnimating = true;
|
||||
fastRaf(() => {
|
||||
scrollWithJs(container, element, position, margin, forceDuration, forceCurrentContainerHeight);
|
||||
@ -102,6 +109,12 @@ function scrollWithJs(
|
||||
}
|
||||
|
||||
const target = container.scrollTop + path;
|
||||
|
||||
if (forceDuration === 0) {
|
||||
container.scrollTop = target;
|
||||
return;
|
||||
}
|
||||
|
||||
const duration = forceDuration || (
|
||||
MIN_JS_DURATION + (Math.abs(path) / MAX_DISTANCE) * (MAX_JS_DURATION - MIN_JS_DURATION)
|
||||
);
|
||||
|
@ -1,21 +1,31 @@
|
||||
import { getGlobal } from '../lib/teact/teactn';
|
||||
|
||||
import { fastRaf } from './schedulers';
|
||||
import { animate } from './animation';
|
||||
import { IS_IOS } from './environment';
|
||||
import { ANIMATION_LEVEL_MIN } from '../config';
|
||||
|
||||
const DURATION = 300;
|
||||
const DEFAULT_DURATION = 300;
|
||||
|
||||
export default function fastSmoothScrollHorizontal(container: HTMLElement, left: number, duration = DEFAULT_DURATION) {
|
||||
if (getGlobal().settings.byKey.animationLevel === ANIMATION_LEVEL_MIN) {
|
||||
duration = 0;
|
||||
}
|
||||
|
||||
export default function fastSmoothScrollHorizontal(container: HTMLElement, left: number) {
|
||||
// Native way seems to be smoother in Chrome
|
||||
if (!IS_IOS) {
|
||||
container.scrollTo({ left, behavior: 'smooth' });
|
||||
container.scrollTo({
|
||||
left,
|
||||
...(duration && { behavior: 'smooth' }),
|
||||
});
|
||||
} else {
|
||||
fastRaf(() => {
|
||||
scrollWithJs(container, left);
|
||||
scrollWithJs(container, left, duration);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function scrollWithJs(container: HTMLElement, left: number) {
|
||||
function scrollWithJs(container: HTMLElement, left: number, duration: number) {
|
||||
const { scrollLeft, offsetWidth: containerWidth, scrollWidth } = container;
|
||||
let path = left - scrollLeft;
|
||||
|
||||
@ -28,10 +38,16 @@ function scrollWithJs(container: HTMLElement, left: number) {
|
||||
}
|
||||
|
||||
const target = container.scrollLeft + path;
|
||||
|
||||
if (duration === 0) {
|
||||
container.scrollTop = target;
|
||||
return;
|
||||
}
|
||||
|
||||
const startAt = Date.now();
|
||||
|
||||
animate(() => {
|
||||
const t = Math.min((Date.now() - startAt) / DURATION, 1);
|
||||
const t = Math.min((Date.now() - startAt) / duration, 1);
|
||||
|
||||
const currentPath = path * (1 - transition(t));
|
||||
container.scrollLeft = Math.round(target - currentPath);
|
||||
|
Loading…
x
Reference in New Issue
Block a user