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)
Этот коммит содержится в:
коммит произвёл
Joram Wilander
родитель
09536af5ad
Коммит
400bc8b46d
@@ -68,7 +68,7 @@ export default class PostList extends React.Component {
|
|||||||
const childNodes = this.refs.postlistcontent.childNodes;
|
const childNodes = this.refs.postlistcontent.childNodes;
|
||||||
for (let i = 0; i < childNodes.length; i++) {
|
for (let i = 0; i < childNodes.length; i++) {
|
||||||
// If the node is 1/3 down the page
|
// 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];
|
this.jumpToPostNode = childNodes[i];
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
@@ -367,9 +367,8 @@ export default class PostList extends React.Component {
|
|||||||
}
|
}
|
||||||
} else if (this.refs.postlist.scrollHeight !== this.prevScrollHeight) {
|
} else if (this.refs.postlist.scrollHeight !== this.prevScrollHeight) {
|
||||||
window.requestAnimationFrame(() => {
|
window.requestAnimationFrame(() => {
|
||||||
// Only need to jump if we added posts to the top.
|
if (this.jumpToPostNode) {
|
||||||
if (this.jumpToPostNode && (this.jumpToPostNode.offsetTop !== this.prevOffsetTop)) {
|
this.refs.postlist.scrollTop += (this.jumpToPostNode.offsetTop - this.prevOffsetTop);
|
||||||
this.refs.postlist.scrollTop += (this.refs.postlist.scrollHeight - this.prevScrollHeight);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,8 +10,6 @@ import PostStore from 'stores/post_store.jsx';
|
|||||||
import UserStore from 'stores/user_store.jsx';
|
import UserStore from 'stores/user_store.jsx';
|
||||||
import * as Utils from 'utils/utils.jsx';
|
import * as Utils from 'utils/utils.jsx';
|
||||||
|
|
||||||
const SIDEBAR_SCROLL_DELAY = 500;
|
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
export default class SidebarRight extends React.Component {
|
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 isOpen = this.state.searchVisible || this.state.postRightVisible;
|
||||||
const willOpen = nextState.searchVisible || nextState.postRightVisible;
|
const willOpen = nextState.searchVisible || nextState.postRightVisible;
|
||||||
|
|
||||||
if (!isOpen && willOpen) {
|
if (isOpen !== willOpen) {
|
||||||
setTimeout(() => PostStore.jumpPostsViewSidebarOpen(), SIDEBAR_SCROLL_DELAY);
|
PostStore.jumpPostsViewSidebarOpen();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
doStrangeThings() {
|
doStrangeThings() {
|
||||||
|
|||||||
Ссылка в новой задаче
Block a user