From d56d9c2f123700517e742434717f3786a8549f25 Mon Sep 17 00:00:00 2001
From: Christopher Speller <crspeller@gmail.com>
Date: Mon, 9 Nov 2015 09:16:01 -0500
Subject: Jumps up to new messages indicator when new messages present

---
 web/react/components/posts_view.jsx           | 13 +++++++++++++
 web/react/components/posts_view_container.jsx |  2 +-
 2 files changed, 14 insertions(+), 1 deletion(-)

(limited to 'web/react/components')

diff --git a/web/react/components/posts_view.jsx b/web/react/components/posts_view.jsx
index 2b81d1d79..b782268fa 100644
--- a/web/react/components/posts_view.jsx
+++ b/web/react/components/posts_view.jsx
@@ -30,6 +30,9 @@ export default class PostsView extends React.Component {
     static get SIDEBAR_OPEN() {
         return 3;
     }
+    static get SCROLL_TYPE_NEW_MESSAGE() {
+        return 4;
+    }
     isAtBottom() {
         return ((this.refs.postlist.scrollHeight - this.refs.postlist.scrollTop) === this.refs.postlist.clientHeight);
     }
@@ -145,6 +148,7 @@ export default class PostsView extends React.Component {
                     <div
                         id={newSeparatorId}
                         key='unviewed'
+                        ref='newMessageSeparator'
                         className='new-separator'
                     >
                         <hr
@@ -165,6 +169,15 @@ export default class PostsView extends React.Component {
             window.requestAnimationFrame(() => {
                 this.refs.postlist.scrollTop = this.refs.postlist.scrollHeight;
             });
+        } else if (this.props.scrollType === PostsView.SCROLL_TYPE_NEW_MESSAGE) {
+            window.requestAnimationFrame(() => {
+                // If separator exists scroll to it. Otherwise scroll to bottom.
+                if (this.refs.newMessageSeparator) {
+                    this.refs.newMessageSeparator.scrollIntoView();
+                } else {
+                    this.refs.postlist.scrollTop = this.refs.postlist.scrollHeight;
+                }
+            });
         } else if (this.props.scrollType === PostsView.SCROLL_TYPE_POST && this.props.scrollPost) {
             window.requestAnimationFrame(() => {
                 const postNode = ReactDOM.findDOMNode(this.refs[this.props.scrollPost]);
diff --git a/web/react/components/posts_view_container.jsx b/web/react/components/posts_view_container.jsx
index 5059747bd..5037a86cd 100644
--- a/web/react/components/posts_view_container.jsx
+++ b/web/react/components/posts_view_container.jsx
@@ -109,7 +109,7 @@ export default class PostsViewContainer extends React.Component {
         this.setState({
             currentChannelIndex: newIndex,
             currentLastViewed: lastViewed,
-            scrollType: PostsView.SCROLL_TYPE_BOTTOM,
+            scrollType: PostsView.SCROLL_TYPE_NEW_MESSAGE,
             channels,
             postLists});
     }
-- 
cgit v1.2.3-1-g7c22