mirror of
https://github.com/whippyshou/mastodon
synced 2024-12-01 16:28:29 +09:00
Scroll smoothly to the right (#4735)
This commit is contained in:
parent
7be620775e
commit
f59ed3a4fa
@ -12,6 +12,7 @@ import ColumnLoading from './column_loading';
|
|||||||
import BundleColumnError from './bundle_column_error';
|
import BundleColumnError from './bundle_column_error';
|
||||||
import { Compose, Notifications, HomeTimeline, CommunityTimeline, PublicTimeline, HashtagTimeline, FavouritedStatuses } from '../../ui/util/async-components';
|
import { Compose, Notifications, HomeTimeline, CommunityTimeline, PublicTimeline, HashtagTimeline, FavouritedStatuses } from '../../ui/util/async-components';
|
||||||
|
|
||||||
|
import detectPassiveEvents from 'detect-passive-events';
|
||||||
import { scrollRight } from '../../../scroll';
|
import { scrollRight } from '../../../scroll';
|
||||||
|
|
||||||
const componentMap = {
|
const componentMap = {
|
||||||
@ -47,6 +48,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
this.node.addEventListener('wheel', this.handleWheel, detectPassiveEvents ? { passive: true } : false);
|
||||||
this.lastIndex = getIndex(this.context.router.history.location.pathname);
|
this.lastIndex = getIndex(this.context.router.history.location.pathname);
|
||||||
this.setState({ shouldAnimate: true });
|
this.setState({ shouldAnimate: true });
|
||||||
}
|
}
|
||||||
@ -56,9 +58,13 @@ export default class ColumnsArea extends ImmutablePureComponent {
|
|||||||
this.setState({ shouldAnimate: true });
|
this.setState({ shouldAnimate: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
componentWillUnmount () {
|
||||||
|
this.node.removeEventListener('wheel', this.handleWheel);
|
||||||
|
}
|
||||||
|
|
||||||
handleChildrenContentChange() {
|
handleChildrenContentChange() {
|
||||||
if (!this.props.singleColumn) {
|
if (!this.props.singleColumn) {
|
||||||
scrollRight(this.node);
|
scrollRight(this.node, this.node.scrollWidth - window.innerWidth);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -82,6 +88,14 @@ export default class ColumnsArea extends ImmutablePureComponent {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
handleWheel = () => {
|
||||||
|
if (typeof this._interruptScrollAnimation !== 'function') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._interruptScrollAnimation();
|
||||||
|
}
|
||||||
|
|
||||||
setRef = (node) => {
|
setRef = (node) => {
|
||||||
this.node = node;
|
this.node = node;
|
||||||
}
|
}
|
||||||
|
@ -26,5 +26,5 @@ const scroll = (node, key, target) => {
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
export const scrollRight = (node) => scroll(node, 'scrollLeft', node.scrollWidth);
|
export const scrollRight = (node, position) => scroll(node, 'scrollLeft', position);
|
||||||
export const scrollTop = (node) => scroll(node, 'scrollTop', 0);
|
export const scrollTop = (node) => scroll(node, 'scrollTop', 0);
|
||||||
|
Loading…
Reference in New Issue
Block a user