mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Maintain bottom-most scroll position when resizing conversation area, once again.

Browse source 
Related with #278. Redone to include keeping scroll at the bottom when resizing the window, as suggested in #305, and to better fit the current code structure.
This commit is contained in:
adambar 2015-07-14 23:11:11 +02:00 • committed by lilia
parent 56b6375f97
commit 1498d90b58
2 changed files with 22 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

18
js/views/conversation_view.js
View file

@ -216,25 +216,21 @@
return this.$('.bottom-bar form').submit(); return this.$('.bottom-bar form').submit();
} }
var $discussionContainer = this.$('.discussion-container'), this.view.measureScrollPosition();
$bottomBar = this.$('.bottom-bar'),
$messageList = this.$('.message-list');
var scrollPosition = $messageList.scrollTop() + $messageList.outerHeight(),
scrollHeight = $messageList[0].scrollHeight,
shouldStickToBottom = scrollPosition === scrollHeight;
window.autosize(this.$messageField); window.autosize(this.$messageField);
var $discussionContainer = this.$('.discussion-container'),
$bottomBar = this.$('.bottom-bar');
$bottomBar.outerHeight(this.$messageField.outerHeight() + 1); $bottomBar.outerHeight(this.$messageField.outerHeight() + 1);
var $bottomBarNewHeight = $bottomBar.outerHeight(); var $bottomBarNewHeight = $bottomBar.outerHeight();
$discussionContainer.outerHeight(this.$el.outerHeight() - $bottomBarNewHeight - this.$('#header').outerHeight()); $discussionContainer.outerHeight(this.$el.outerHeight() - $bottomBarNewHeight - this.$('#header').outerHeight());
if (shouldStickToBottom) { this.view.scrollToBottomIfNeeded();
$messageList.scrollTop(scrollHeight);
}
}, },
forceUpdateMessageFieldSize: function (event) { forceUpdateMessageFieldSize: function (event) {
this.view.scrollToBottomIfNeeded();
window.autosize.update(this.$messageField); window.autosize.update(this.$messageField);
this.updateMessageFieldSize(event); this.updateMessageFieldSize(event);
} }

15
js/views/message_list_view.js
View file

@ -17,6 +17,10 @@
'use strict'; 'use strict';
window.Whisper = window.Whisper || {}; window.Whisper = window.Whisper || {};
var scrollPosition,
scrollHeight,
shouldStickToBottom;
Whisper.MessageListView = Whisper.ListView.extend({ Whisper.MessageListView = Whisper.ListView.extend({
tagName: 'ul', tagName: 'ul',
className: 'message-list', className: 'message-list',
@ -25,9 +29,20 @@
'add': 'scrollToBottom', 'add': 'scrollToBottom',
'update *': 'scrollToBottom' 'update *': 'scrollToBottom'
}, },
measureScrollPosition: function() {
scrollPosition = this.$el.scrollTop() + this.$el.outerHeight();
scrollHeight = this.el.scrollHeight;
shouldStickToBottom = scrollPosition === scrollHeight;
},
scrollToBottomIfNeeded: function() {
if (shouldStickToBottom) {
this.$el.scrollTop(scrollHeight);
}
},
scrollToBottom: function() { scrollToBottom: function() {
// TODO: Avoid scrolling if user has manually scrolled up? // TODO: Avoid scrolling if user has manually scrolled up?
this.$el.scrollTop(this.el.scrollHeight); this.$el.scrollTop(this.el.scrollHeight);
this.measureScrollPosition();
}, },
addAll: function() { addAll: function() {
Whisper.ListView.prototype.addAll.apply(this, arguments); // super() Whisper.ListView.prototype.addAll.apply(this, arguments); // super()