Updates #984: Remember scroll position when using infinite scroll.

CHANGES.md

@@ -47,6 +47,7 @@
 - `hide_open_bookmarks` is now by default `true`.
 
 ### UX/UI changes
+- #984 Improve loading of archived messages via "infinite scroll"
 - Use CSS3 fade transitions to render various elements.
 - Remove `Login` and `Registration` tabs and consolidate into one panel.
 - Show validation error messages on the login form.

src/converse-chatview.js

@@ -483,7 +483,30 @@
                     }
                     this.insertDayIndicator(message_el);
                     this.clearStatusNotification();
-                    this.scrollDown();
+                    this.setScrollPosition(message_el);
+                },
+
+                setScrollPosition (message_el) {
+                    /* Given a newly inserted message, determine whether we
+                     * should keep the scrollbar in place (so as to not scroll
+                     * up when using infinite scroll).
+                     */
+                    if (this.model.get('scrolled')) {
+                        const next_msg_el = u.getNextElement(message_el, ".chat-message");
+                        if (next_msg_el) {
+                            // The currently received message is not new, there
+                            // are newer messages after it. So let's see if we
+                            // should maintain our current scroll position.
+                            if (this.content.scrollTop === 0 || this.model.get('top_visible_message')) {
+                                const top_visible_message = this.model.get('top_visible_message') || next_msg_el;
+
+                                this.model.set('top_visible_message', top_visible_message);
+                                this.content.scrollTop = top_visible_message.offsetTop - 30;
+                            }
+                        }
+                    } else {
+                        this.scrollDown();
+                    }
                 },
 
                 getExtraMessageTemplateAttributes () {
@@ -1008,11 +1031,17 @@
                         scrolled = false;
                         this.onScrolledDown();
                     }
-                    u.safeSave(this.model, {'scrolled': scrolled});
+                    u.safeSave(this.model, {
+                        'scrolled': scrolled,
+                        'top_visible_message': null
+                    });
                 },
 
                 viewUnreadMessages () {
-                    this.model.save('scrolled', false);
+                    this.model.save({
+                        'scrolled': false,
+                        'top_visible_message': null
+                    });
                     this.scrollDown();
                 },