mirror of
https://github.com/whippyshou/mastodon
synced 2024-12-02 08:48:33 +09:00
9d1f8b9d6a
The feature to pin column could hide the rightmost column, which is specified with children property of ColumnsArea. The user is likely to see the column when the property changed, so scroll the area in such cases.
31 lines
771 B
JavaScript
31 lines
771 B
JavaScript
const easingOutQuint = (x, t, b, c, d) => c * ((t = t / d - 1) * t * t * t * t + 1) + b;
|
|
|
|
const scroll = (node, key, target) => {
|
|
const startTime = Date.now();
|
|
const offset = node[key];
|
|
const gap = target - offset;
|
|
const duration = 1000;
|
|
let interrupt = false;
|
|
|
|
const step = () => {
|
|
const elapsed = Date.now() - startTime;
|
|
const percentage = elapsed / duration;
|
|
|
|
if (percentage > 1 || interrupt) {
|
|
return;
|
|
}
|
|
|
|
node[key] = easingOutQuint(0, elapsed, offset, gap, duration);
|
|
requestAnimationFrame(step);
|
|
};
|
|
|
|
step();
|
|
|
|
return () => {
|
|
interrupt = true;
|
|
};
|
|
};
|
|
|
|
export const scrollRight = (node) => scroll(node, 'scrollLeft', node.scrollWidth);
|
|
export const scrollTop = (node) => scroll(node, 'scrollTop', 0);
|