Scrolling fixes (#3200)

* scrolling fixes:
- jumps on free scroll when somebody posts a new message (and old one disappears at top)
- jumps on closing RHS (no compensation of resize)
- scroll blinking on opening/closing RHS (delay before resize compensation)

* fix scroll slipping up on multiple open/close RHS in case when (this.refs.postlist.offsetHeight % Constants.SCROLL_PAGE_FRACTION === 0)
This commit is contained in:
samogot
2016-06-10 16:59:13 +03:00
committed by Joram Wilander
parent 09536af5ad
commit 400bc8b46d
2 changed files with 5 additions and 8 deletions

View File

@@ -68,7 +68,7 @@ export default class PostList extends React.Component {
const childNodes = this.refs.postlistcontent.childNodes;
for (let i = 0; i < childNodes.length; i++) {
// If the node is 1/3 down the page
if (childNodes[i].offsetTop > (this.refs.postlist.scrollTop + (this.refs.postlist.offsetHeight / Constants.SCROLL_PAGE_FRACTION))) {
if (childNodes[i].offsetTop >= (this.refs.postlist.scrollTop + (this.refs.postlist.offsetHeight / Constants.SCROLL_PAGE_FRACTION))) {
this.jumpToPostNode = childNodes[i];
break;
}
@@ -367,9 +367,8 @@ export default class PostList extends React.Component {
}
} else if (this.refs.postlist.scrollHeight !== this.prevScrollHeight) {
window.requestAnimationFrame(() => {
// Only need to jump if we added posts to the top.
if (this.jumpToPostNode && (this.jumpToPostNode.offsetTop !== this.prevOffsetTop)) {
this.refs.postlist.scrollTop += (this.refs.postlist.scrollHeight - this.prevScrollHeight);
if (this.jumpToPostNode) {
this.refs.postlist.scrollTop += (this.jumpToPostNode.offsetTop - this.prevOffsetTop);
}
});
}

View File

@@ -10,8 +10,6 @@ import PostStore from 'stores/post_store.jsx';
import UserStore from 'stores/user_store.jsx';
import * as Utils from 'utils/utils.jsx';
const SIDEBAR_SCROLL_DELAY = 500;
import React from 'react';
export default class SidebarRight extends React.Component {
@@ -55,8 +53,8 @@ export default class SidebarRight extends React.Component {
const isOpen = this.state.searchVisible || this.state.postRightVisible;
const willOpen = nextState.searchVisible || nextState.postRightVisible;
if (!isOpen && willOpen) {
setTimeout(() => PostStore.jumpPostsViewSidebarOpen(), SIDEBAR_SCROLL_DELAY);
if (isOpen !== willOpen) {
PostStore.jumpPostsViewSidebarOpen();
}
}
doStrangeThings() {