diff options
author | Nolan Lawson <nolan@nolanlawson.com> | 2017-10-01 18:01:01 -0700 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2017-10-02 03:01:01 +0200 |
commit | c567c874537b733a3e15625ad01eb0ae0ced8f4e (patch) | |
tree | 8a19679f120a44b1db13ad36c4d928922605afad /app/javascript/mastodon/components/scrollable_list.js | |
parent | 47ecd652d3f8256a191401f005d42760e858e6de (diff) |
Toggle contain:strict on fullscreen (#5159)
* Toggle contain:strict on fullscreen * Fix scss lint issue * fix scss whitespace lint issue
Diffstat (limited to 'app/javascript/mastodon/components/scrollable_list.js')
-rw-r--r-- | app/javascript/mastodon/components/scrollable_list.js | 11 |
1 files changed, 10 insertions, 1 deletions
diff --git a/app/javascript/mastodon/components/scrollable_list.js b/app/javascript/mastodon/components/scrollable_list.js index ff0540e5d..c6b588765 100644 --- a/app/javascript/mastodon/components/scrollable_list.js +++ b/app/javascript/mastodon/components/scrollable_list.js @@ -6,6 +6,8 @@ import LoadMore from './load_more'; import IntersectionObserverWrapper from '../features/ui/util/intersection_observer_wrapper'; import { throttle } from 'lodash'; import { List as ImmutableList } from 'immutable'; +import classNames from 'classnames'; +import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from '../features/ui/util/fullscreen'; export default class ScrollableList extends PureComponent { @@ -66,6 +68,7 @@ export default class ScrollableList extends PureComponent { componentDidMount () { this.attachScrollListener(); this.attachIntersectionObserver(); + attachFullscreenListener(this.onFullScreenChange); // Handle initial scroll posiiton this.handleScroll(); @@ -92,6 +95,11 @@ export default class ScrollableList extends PureComponent { componentWillUnmount () { this.detachScrollListener(); this.detachIntersectionObserver(); + detachFullscreenListener(this.onFullScreenChange); + } + + onFullScreenChange = () => { + this.setState({ fullscreen: isFullscreen() }); } attachIntersectionObserver () { @@ -165,6 +173,7 @@ export default class ScrollableList extends PureComponent { render () { const { children, scrollKey, trackScroll, shouldUpdateScroll, isLoading, hasMore, prepend, emptyMessage } = this.props; + const { fullscreen } = this.state; const childrenCount = React.Children.count(children); const loadMore = (hasMore && childrenCount > 0) ? <LoadMore visible={!isLoading} onClick={this.handleLoadMore} /> : null; @@ -172,7 +181,7 @@ export default class ScrollableList extends PureComponent { if (isLoading || childrenCount > 0 || !emptyMessage) { scrollableArea = ( - <div className='scrollable' ref={this.setRef} onMouseMove={this.handleMouseMove} onMouseLeave={this.handleMouseLeave}> + <div className={classNames('scrollable', { fullscreen })} ref={this.setRef} onMouseMove={this.handleMouseMove} onMouseLeave={this.handleMouseLeave}> <div role='feed' className='item-list' onKeyDown={this.handleKeyDown}> {prepend} |