Merge a79c867 into aa75f98

mattermost · Feb 4, 2017 · 1a06338 · 1a06338
2 parents aa75f98 + a79c867
commit 1a06338
Showing 1 changed file with 15 additions and 7 deletions.
diff --git a/webapp/components/post_view/components/post_list.jsx b/webapp/components/post_view/components/post_list.jsx
@@ -25,6 +25,8 @@ import PreferenceStore from 'stores/preference_store.jsx';
 
 import {FormattedDate, FormattedMessage} from 'react-intl';
 
+import loadingGif from 'images/load.gif';
+
 import React from 'react';
 import ReactDOM from 'react-dom';
 
@@ -110,6 +112,12 @@ export default class PostList extends React.Component {
         return this.refs.postlist.clientHeight + this.refs.postlist.scrollTop >= this.refs.postlist.scrollHeight - atBottomMargin;
     }
 
+    isTop() {
+        const atTopMargin = 10;
+
+        return this.refs.postlist.scrollTop - atTopMargin < 0;
+    }
+
     handleScroll() {
         // HACK FOR RHS -- REMOVE WHEN RHS DIES
         const childNodes = this.refs.postlistcontent.childNodes;
@@ -124,6 +132,9 @@ export default class PostList extends React.Component {
         if (!this.jumpToPostNode && childNodes.length > 0) {
             this.jumpToPostNode = childNodes[childNodes.length - 1];
         }
+        if (this.isTop()) {
+            this.loadMorePostsTop();
+        }
 
         // --- --------
 
@@ -183,9 +194,7 @@ export default class PostList extends React.Component {
         }
     }
 
-    loadMorePostsTop(e) {
-        e.preventDefault();
-
+    loadMorePostsTop() {
         if (this.props.isFocusPost) {
             return GlobalActions.emitLoadMorePostsFocusedTopEvent();
         }
@@ -540,11 +549,10 @@ export default class PostList extends React.Component {
                     ref='loadmoretop'
                     className='more-messages-text theme'
                     href='#'
-                    onClick={this.loadMorePostsTop}
                 >
-                    <FormattedMessage
-                        id='posts_view.loadMore'
-                        defaultMessage='Load more messages'
+                    <img
+                        className='post-loading-gif'
+                        src={loadingGif}
                     />
                 </a>
             );