Accords-Library-Archive
/
gallery.accords-library.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

client/pager: cache state between navigations

This commit is contained in:
rr- 2016-04-14 00:41:02 +02:00
parent 43c657e371
commit a83a896dde
2 changed files with 32 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
client/js/controllers/users_controller.js
View File

@ -53,6 +53,7 @@ class UsersController {
topNavController.activate('users'); topNavController.activate('users');
pageController.run({ pageController.run({
state: ctx.state,
requestPage: page => { requestPage: page => {
return api.get( return api.get(
'/users/?query={text}&page={page}&pageSize=30'.format({ '/users/?query={text}&page={page}&pageSize=30'.format({

43
client/js/views/endless_page_view.js
View File

@ -5,12 +5,6 @@ const events = require('../events.js');
const misc = require('../util/misc.js'); const misc = require('../util/misc.js');
const views = require('../util/views.js'); const views = require('../util/views.js');
function removeConsecutiveDuplicates(a) {
return a.filter((item, pos, ary) => {
return !pos || item != ary[pos - 1];
});
}
class EndlessPageView { class EndlessPageView {
constructor() { constructor() {
this.holderTemplate = views.getTemplate('endless-pager'); this.holderTemplate = views.getTemplate('endless-pager');
@ -26,11 +20,19 @@ class EndlessPageView {
const threshold = window.innerHeight / 3; const threshold = window.innerHeight / 3;
this.minPageShown = null; if (ctx.state && ctx.state.html) {
this.maxPageShown = null; console.log('Loading from state');
this.totalPages = null; this.minPageShown = ctx.state.minPageShown;
this.maxPageShown = ctx.state.maxPageShown;
this.totalPages = ctx.state.totalPages;
this.currentPage = ctx.state.currentPage;
} else {
this.minPageShown = null;
this.maxPageShown = null;
this.totalPages = null;
this.currentPage = null;
}
this.fetching = false; this.fetching = false;
this.currentPage = null;
this.updater = () => { this.updater = () => {
let topPage = null; let topPage = null;
@ -45,7 +47,15 @@ class EndlessPageView {
if (topPage !== this.currentPage) { if (topPage !== this.currentPage) {
page.replace( page.replace(
ctx.clientUrl.format({page: topPage}), ctx.clientUrl.format({page: topPage}),
null, {
minPageShown: this.minPageShown,
maxPageShown: this.maxPageShown,
totalPages: this.totalPages,
currentPage: this.currentPage,
html: pagesHolder.innerHTML,
scrollX: window.scrollX,
scrollY: window.scrollY,
},
false, false,
false); false);
this.currentPage = topPage; this.currentPage = topPage;
@ -66,7 +76,12 @@ class EndlessPageView {
} }
}; };
this.loadPage(pagesHolder, ctx, ctx.initialPage, true); if (ctx.state && ctx.state.html) {
pagesHolder.innerHTML = ctx.state.html;
window.scroll(ctx.state.scrollX, ctx.state.scrollY);
} else {
this.loadPage(pagesHolder, ctx, ctx.initialPage, true);
}
window.addEventListener('scroll', this.updater, true); window.addEventListener('scroll', this.updater, true);
} }
@ -102,6 +117,10 @@ class EndlessPageView {
pagesHolder.appendChild(pageNode); pagesHolder.appendChild(pageNode);
} else { } else {
pagesHolder.prependChild(pageNode); pagesHolder.prependChild(pageNode);
// note: with probability of 75%, if the user has scrolled
// with a mouse wheel, chrome 49 doesn't give a slightest
// fuck about this and loads all the way to page 1 at once
window.scroll( window.scroll(
window.scrollX, window.scrollX,
window.scrollY + pageNode.offsetHeight); window.scrollY + pageNode.offsetHeight);