Assclaw/jfa-go
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

list: refactor loading methods

Browse Source
This commit is contained in:
Harvey Tindall
2025-05-27 10:27:02 +01:00
parent 37bdf50bb0
commit 364b010ceb
3 changed files with 86 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ts/modules/accounts.ts
+4 -14
View File
@@ -1232,25 +1232,15 @@ export class accountsList extends PaginatedList {
this.registerURLListener(); this.registerURLListener();
} }
reload = (callback?: () => void) => { reload = (callback?: (resp: paginatedDTO) => void) => {
this._reload( this._reload(callback);
(req: XMLHttpRequest) => {
if (req.readyState != 4) return;
if (req.status != 200) return;
if (callback) callback();
}
);
this.loadTemplates(); this.loadTemplates();
} }
loadMore = (callback?: () => void, loadAll: boolean = false) => { loadMore = (loadAll: boolean = false, callback?: () => void) => {
this._loadMore( this._loadMore(
loadAll, loadAll,
(req: XMLHttpRequest) => { callback
if (req.readyState != 4) return;
if (req.status != 200) return;
if (callback) callback();
}
); );
}; };
ts/modules/activity.ts
+6 -10
View File
@@ -537,7 +537,7 @@ export class activityList extends PaginatedList {
(window as any).act = this; (window as any).act = this;
this._container = document.getElementById("activity-card-list") this._container = document.getElementById("activity-card-list")
document.addEventListener("activity-reload", this.reload); document.addEventListener("activity-reload", () => this.reload());
let searchConfig: SearchConfiguration = { let searchConfig: SearchConfiguration = {
filterArea: this._c.filterArea, filterArea: this._c.filterArea,
@@ -564,20 +564,16 @@ export class activityList extends PaginatedList {
this._sortDirection.addEventListener("click", () => this.ascending = !this.ascending); this._sortDirection.addEventListener("click", () => this.ascending = !this.ascending);
} }
reload = () => { reload = (callback?: (resp: paginatedDTO) => void) => {
this._reload(); this._reload(callback);
} }
loadMore = (callback?: () => void, loadAll: boolean = false) => { loadMore = (loadAll: boolean = false, callback?: () => void) => {
this._loadMore( this._loadMore(
loadAll, loadAll,
(req: XMLHttpRequest) => { callback
if (req.readyState != 4) return;
if (req.status != 200) return;
if (callback) callback();
}
); );
} };
get ascending(): boolean { get ascending(): boolean {
return this._ascending; return this._ascending;
ts/modules/list.ts
+53 -73
View File
@@ -157,10 +157,10 @@ export abstract class PaginatedList {
this._counter = new RecordCounter(this._c.recordCounter); this._counter = new RecordCounter(this._c.recordCounter);
this._hasLoaded = false; this._hasLoaded = false;
this._c.loadMoreButton.onclick = () => this.loadMore(null, false); this._c.loadMoreButton.onclick = () => this.loadMore(false);
this._c.loadAllButton.onclick = () => { this._c.loadAllButton.onclick = () => {
addLoader(this._c.loadAllButton, true); addLoader(this._c.loadAllButton, true);
this.loadMore(null, true); this.loadMore(true);
}; };
/* this._keepSearchingButton.onclick = () => { /* this._keepSearchingButton.onclick = () => {
addLoader(this._keepSearchingButton, true); addLoader(this._keepSearchingButton, true);
@@ -202,7 +202,7 @@ export abstract class PaginatedList {
(this._visible.length == 0 && !this.lastPage) || (this._visible.length == 0 && !this.lastPage) ||
loadAll loadAll
) { ) {
this.loadMore(() => {}, loadAll); this.loadMore(loadAll);
} }
} }
this._previousVisibleItemCount = this._visible.length; this._previousVisibleItemCount = this._visible.length;
@@ -212,7 +212,7 @@ export abstract class PaginatedList {
searchConfig.searchServer = (params: PaginatedReqDTO, newSearch: boolean) => { searchConfig.searchServer = (params: PaginatedReqDTO, newSearch: boolean) => {
this._searchParams = params; this._searchParams = params;
if (newSearch) this.reload(); if (newSearch) this.reload();
else this.loadMore(null, false); else this.loadMore(false);
if (previousServerSearch) previousServerSearch(params, newSearch); if (previousServerSearch) previousServerSearch(params, newSearch);
}; };
@@ -310,53 +310,56 @@ export abstract class PaginatedList {
return bottomIdx; return bottomIdx;
} }
// Removes all elements, and reloads the first page. private _load = (itemLimit: number, page: number, pre?: (resp: paginatedDTO) => void, post?: (resp: paginatedDTO) => void, failCallback?: (req: XMLHttpRequest) => void) => {
// FIXME: Share more code between reload and loadMore, and go over the logic, it's messy.
public abstract reload: () => void;
protected _reload = (
callback?: (req: XMLHttpRequest) => void
) => {
this._lastLoad = Date.now(); this._lastLoad = Date.now();
this.lastPage = false;
this._counter.reset();
this._counter.getTotal(this._c.totalEndpoint);
// Reload all currently visible elements, i.e. Load a new page of size (limit*(page+1)).
let limit = this._c.itemsPerPage;
if (this._page != 0) {
limit *= this._page+1;
}
let params = this._search.inServerSearch ? this._searchParams : this.defaultParams(); let params = this._search.inServerSearch ? this._searchParams : this.defaultParams();
params.limit = limit; params.limit = itemLimit;
params.page = 0; params.page = page;
if (params.sortByField == "") {
params.sortByField = this._c.defaultSortField;
params.ascending = this._c.defaultSortAscending;
}
_post(this._c.getPageEndpoint, params, (req: XMLHttpRequest) => { _post(this._c.getPageEndpoint, params, (req: XMLHttpRequest) => {
if (req.readyState != 4) return; if (req.readyState != 4) return;
if (req.status != 200) { if (req.status != 200) {
if (this._c.pageLoadCallback) this._c.pageLoadCallback(req); if (this._c.pageLoadCallback) this._c.pageLoadCallback(req);
if (callback) callback(req); if (failCallback) failCallback(req);
return; return;
} }
this._hasLoaded = true; this._hasLoaded = true;
// Allow refreshes every 15s
this._c.refreshButton.disabled = true;
setTimeout(() => this._c.refreshButton.disabled = false, 15000);
let resp = req.response as paginatedDTO; let resp = req.response as paginatedDTO;
if (pre) pre(resp);
this.lastPage = resp.last_page; this.lastPage = resp.last_page;
this._c.replaceWithNewItems(resp); // this._c.replaceWithNewItems(resp);
// this._c.appendNewItems(resp);
this._counter.loaded = this._search.ordering.length; this._counter.loaded = this._search.ordering.length;
if (post) post(resp);
if (this._c.pageLoadCallback) this._c.pageLoadCallback(req);
}, true);
}
// Removes all elements, and reloads the first page.
public abstract reload: (callback?: (resp: paginatedDTO) => void) => void;
protected _reload = (callback?: (resp: paginatedDTO) => void) => {
this.lastPage = false;
this._counter.reset();
this._counter.getTotal(this._c.totalEndpoint);
// Reload all currently visible elements, i.e. Load a new page of size (limit*(page+1)).
let limit = this._c.itemsPerPage;
if (this._page != 0) {
limit *= this._page+1;
}
this._load(
limit,
0,
(_0: paginatedDTO) => {
// Allow refreshes every 15s
this._c.refreshButton.disabled = true;
setTimeout(() => this._c.refreshButton.disabled = false, 15000);
},
(resp: paginatedDTO) => {
this._search.onSearchBoxChange(true, false, false); this._search.onSearchBoxChange(true, false, false);
if (this._search.inSearch) { if (this._search.inSearch) {
// this._c.loadAllButton.classList.remove("unfocused"); // this._c.loadAllButton.classList.remove("unfocused");
@@ -365,54 +368,31 @@ export abstract class PaginatedList {
this.setVisibility(this._search.ordering, true); this.setVisibility(this._search.ordering, true);
// this._search.showHideNotFoundPanel(false); // this._search.showHideNotFoundPanel(false);
} }
if (this._c.pageLoadCallback) this._c.pageLoadCallback(req); if (callback) callback(resp);
if (callback) callback(req); },
}, true); );
} }
// Loads the next page. If "loadAll", all pages will be loaded until the last is reached. // Loads the next page. If "loadAll", all pages will be loaded until the last is reached.
public abstract loadMore: (callback: () => void, loadAll: boolean) => void; public abstract loadMore: (loadAll?: boolean, callback?: () => void) => void;
protected _loadMore = ( protected _loadMore = (loadAll: boolean = false, callback?: (resp: paginatedDTO) => void) => {
loadAll: boolean = false,
callback?: (req: XMLHttpRequest) => void
) => {
this._lastLoad = Date.now();
this._c.loadMoreButton.disabled = true; this._c.loadMoreButton.disabled = true;
const timeout = setTimeout(() => { const timeout = setTimeout(() => {
this._c.loadMoreButton.disabled = false; this._c.loadMoreButton.disabled = false;
}, 1000); }, 1000);
this._page += 1; this._page += 1;
let params = this._search.inServerSearch ? this._searchParams : this.defaultParams(); this._load(
params.limit = this._c.itemsPerPage; this._c.itemsPerPage,
params.page = this._page; this._page,
if (params.sortByField == "") { (resp: paginatedDTO) => {
params.sortByField = this._c.defaultSortField;
params.ascending = this._c.defaultSortAscending;
}
_post(this._c.getPageEndpoint, params, (req: XMLHttpRequest) => {
if (req.readyState != 4) return;
if (req.status != 200) {
if (this._c.pageLoadCallback) this._c.pageLoadCallback(req);
if (callback) callback(req);
return;
}
let resp = req.response as paginatedDTO;
// Check before setting this.lastPage so we have a chance to cancel the timeout. // Check before setting this.lastPage so we have a chance to cancel the timeout.
if (resp.last_page) { if (resp.last_page) {
clearTimeout(timeout); clearTimeout(timeout);
removeLoader(this._c.loadAllButton); removeLoader(this._c.loadAllButton);
} }
},
this.lastPage = resp.last_page; (resp: paginatedDTO) => {
this._c.appendNewItems(resp);
this._counter.loaded = this._search.ordering.length;
if (this._search.inSearch || loadAll) { if (this._search.inSearch || loadAll) {
if (this.lastPage) { if (this.lastPage) {
loadAll = false; loadAll = false;
@@ -425,15 +405,15 @@ export abstract class PaginatedList {
this.setVisibility(this._search.ordering, true, true); this.setVisibility(this._search.ordering, true, true);
this._search.setNotFoundPanelVisibility(false); this._search.setNotFoundPanelVisibility(false);
} }
if (this._c.pageLoadCallback) this._c.pageLoadCallback(req); if (callback) callback(resp);
if (callback) callback(req); },
}, true) );
} }
loadNItems = (n: number) => { loadNItems = (n: number) => {
const cb = () => { const cb = () => {
if (this._counter.loaded > n) return; if (this._counter.loaded > n) return;
this.loadMore(cb, false); this.loadMore(false, cb);
} }
cb(); cb();
} }
@@ -477,7 +457,7 @@ export abstract class PaginatedList {
const cb = () => { const cb = () => {
if (this._visible.length < endIdx && !this.lastPage) { if (this._visible.length < endIdx && !this.lastPage) {
// FIXME: This causes scroll-to-top when in search. // FIXME: This causes scroll-to-top when in search.
this.loadMore(cb, false) this.loadMore(false, cb);
return; return;
} }