github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-05-11 16:52:37 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improve "jump to last" scrolling behaviour

Browse Source
This commit is contained in:
Toby Zerner 2015-01-30 13:05:42 +10:30
parent 12622e6c28
commit 5edc3eba83
4 changed files with 27 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
ember/app/components/discussions/stream-content.js
View File

@ -238,7 +238,7 @@ export default Ember.Component.extend({
}); });
}, },
goToIndex: function(index) { goToIndex: function(index, backwards) {
// Let's start by telling our listeners that we're going to load // Let's start by telling our listeners that we're going to load
// posts at this index. Elsewhere we will listen and consequently // posts at this index. Elsewhere we will listen and consequently
// scroll down to the appropriate position. // scroll down to the appropriate position.
@ -248,11 +248,30 @@ export default Ember.Component.extend({
// are loaded. We will tell our listeners when they are. Again, a // are loaded. We will tell our listeners when they are. Again, a
// listener will scroll down to the appropriate post. // listener will scroll down to the appropriate post.
var controller = this; var controller = this;
this.get('stream').loadNearIndex(index).then(function() { this.get('stream').loadNearIndex(index, backwards).then(function() {
controller.trigger('loadedIndex', index); controller.trigger('loadedIndex', index);
}); });
}, },
goToFirst: function() {
this.send('goToIndex', 0);
},
goToLast: function() {
this.send('goToIndex', this.get('stream.count') - 1, true);
// If the post stream is loading some new posts, then after it's
// done we'll want to immediately scroll down to the bottom of the
// page.
if (! this.get('stream.lastLoaded')) {
this.get('stream').one('postsLoaded', function() {
Ember.run.scheduleOnce('afterRender', function() {
$('html, body').stop(true).scrollTop($('body').height());
});
});
}
},
loadRange: function(start, end, backwards) { loadRange: function(start, end, backwards) {
this.get('stream').loadRange(start, end, backwards); this.get('stream').loadRange(start, end, backwards);
} }

4
ember/app/components/discussions/stream-scrubber.js
View File

@ -382,11 +382,11 @@ export default Ember.Component.extend({
actions: { actions: {
first: function() { first: function() {
this.get('streamContent').send('goToIndex', 0); this.get('streamContent').send('goToFirst');
}, },
last: function() { last: function() {
this.get('streamContent').send('goToIndex', this.get('count') - 1); this.get('streamContent').send('goToLast');
} }
} }
}); });

6
ember/app/models/post-stream.js
View File

@ -109,7 +109,7 @@ export default Ember.ArrayProxy.extend(Ember.Evented, {
}); });
}, },
loadNearIndex: function(index) { loadNearIndex: function(index, backwards) {
// Find the item in the post stream which is nearest to this index. If // Find the item in the post stream which is nearest to this index. If
// it turns out the be the actual post we're trying to load, then we can // it turns out the be the actual post we're trying to load, then we can
// return a resolved promise (i.e. we don't need to make an API // return a resolved promise (i.e. we don't need to make an API
@ -118,10 +118,8 @@ export default Ember.ArrayProxy.extend(Ember.Evented, {
if (item) { if (item) {
if (! item.gap) { if (! item.gap) {
return Ember.RSVP.resolve([item.get('content')]); return Ember.RSVP.resolve([item.get('content')]);
} else {
item.set('direction', 'down').set('loading', true);
} }
return this.loadRange(Math.max(item.indexStart, index - this.get('postLoadCount') / 2), item.indexEnd); return this.loadRange(Math.max(item.indexStart, index - this.get('postLoadCount') / 2), item.indexEnd, backwards);
} }
return Ember.RSVP.reject(); return Ember.RSVP.reject();

4
ember/app/views/discussion.js
View File

@ -56,7 +56,7 @@ export default Ember.View.extend(Ember.Evented, {
// ------------------------------------------------------------------------ // ------------------------------------------------------------------------
// Whenever the controller has switched out the old discussion model for a // Whenever the controller has switched out the old discussion model for a
// new one, we want to // new one, we want to begin loading posts according to the ?start param.
loadStreamContentForNewDiscussion: function() { loadStreamContentForNewDiscussion: function() {
if (this.get('controller.loaded')) { if (this.get('controller.loaded')) {
this.goToNumber(this.get('controller.start')); this.goToNumber(this.get('controller.start'));
@ -93,7 +93,7 @@ export default Ember.View.extend(Ember.Evented, {
label: 'Reply', label: 'Reply',
icon: 'reply', icon: 'reply',
action: function() { action: function() {
view.get('streamContent').send('goToIndex', view.get('controller.stream.count') - 1); view.get('streamContent').send('goToLast');
view.get('controller').send('reply'); view.get('controller').send('reply');
}, },
}); });