michael/cordis
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix infinite scroll

Browse Source
This commit is contained in:
Michael Peters 2021-12-04 06:02:11 -06:00
parent 445fc17edc
commit fc4e6bc9c3
5 changed files with 35 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
client/webapp/auto-verifier-with-args.ts
View File

@ -40,17 +40,17 @@ export class AutoVerifierWithArg<T, K> {
query => primaryFunc(query),
query => trustedFunc(query),
async (query: PartialMessageListQuery, primaryResult: T[] | null, trustedResult: T[] | null) => {
LOG.debug('messages verify: ', {
query,
// primaryResult: primaryResult?.map((e: any) => e.sent).sort(),
// trustedResult: trustedResult?.map((e: any) => e.sent).sort(),
zipped: primaryResult && trustedResult && primaryResult.length === trustedResult.length && Q.zip(
primaryResult?.sort((a: any, b: any) => a.sent.getTime() - b.sent.getTime()).map((e: any) => e.text),
trustedResult?.sort((a: any, b: any) => a.sent.getTime() - b.sent.getTime()).map((e: any) => e.text)
)
});
// LOG.debug('messages verify: ', {
// query,
// // primaryResult: primaryResult?.map((e: any) => e.sent).sort(),
// // trustedResult: trustedResult?.map((e: any) => e.sent).sort(),
// zipped: primaryResult && trustedResult && primaryResult.length === trustedResult.length && Q.zip(
// primaryResult?.sort((a: any, b: any) => a.sent.getTime() - b.sent.getTime()).map((e: any) => e.text),
// trustedResult?.sort((a: any, b: any) => a.sent.getTime() - b.sent.getTime()).map((e: any) => e.text)
// )
// });
let changes = AutoVerifier.getChanges<T>(primaryResult, trustedResult);
LOG.debug('changes:', { changes });
//LOG.debug('changes:', { changes });
let changesType = AutoVerifier.getListChangesType<T>(primaryResult, trustedResult, changes);
await changesFunc(query, changesType, changes);
}

24
client/webapp/elements/events-infinite-scroll.ts
View File

@ -1,3 +1,8 @@
import * as electronRemote from '@electron/remote';
const electronConsole = electronRemote.getGlobal('console') as Console;
import Logger from '../../../logger/logger';
const LOG = Logger.create(__filename, electronConsole);
import Actions from "../actions";
import Q from "../q-module";
import UI from "../ui";
@ -11,16 +16,31 @@ export default function bindInfiniteScrollEvents(q: Q, ui: UI): void {
let scrollHeight = q.$('#channel-feed-content-wrapper').scrollHeight;
let clientHeight = q.$('#channel-feed-content-wrapper').clientHeight;
// WARNING
// There's likely an inconsistency between browsers on this so have fun when you're working
// on the cross-platform implementation of this
// scrollTop apparantly is negative for column-reverse divs (this actually kindof makes sense if you flip your head upside down)
// have to reverse this
// I expect this was a change with some version of chromium.
// MDN documentation issue: https://github.com/mdn/content/issues/10968
let distToTop = -(clientHeight - scrollHeight - scrollTop); // keep in mind scrollTop is negative >:]
let distToBottom = -scrollTop;
//LOG.debug('update infinite scroll', { scrollTop, scrollHeight, clientHeight, distToTop, distToBottom, loadingBefore, loadingAfter });
if (ui.activeGuild === null) return;
if (ui.activeChannel === null) return;
if (!loadingBefore && !ui.messagesAtTop && scrollTop < 600) { // Approaching the unloaded top of the page
if (!loadingBefore && !ui.messagesAtTop && distToTop < 600) { // Approaching the unloaded top of the page
// Fetch more messages to add above
LOG.debug('fetching messages before', { loadingBefore, messagesAtTop: ui.messagesAtTop, distToTop });
loadingBefore = true;
await Actions.fetchAndUpdateMessagesBefore(q, ui, ui.activeGuild, ui.activeChannel);
loadingBefore = false;
} else if (!loadingAfter && !ui.messagesAtBottom && scrollHeight - clientHeight - scrollTop < 600) { // Approaching the unloaded bottom of the page
} else if (!loadingAfter && !ui.messagesAtBottom && distToBottom < 600) { // Approaching the unloaded bottom of the page
// Fetch more messages to add below
LOG.debug('fetching messages after', { loadingAfter, messagesAtBottom: ui.messagesAtBottom, distToBottom: distToBottom });
loadingAfter = true;
await Actions.fetchAndUpdateMessagesAfter(q, ui, ui.activeGuild, ui.activeChannel);
loadingAfter = false;

2
makefile
View File

@ -34,7 +34,7 @@ reset-server:
create-invite:
node ./dist/server/scripts/create-cordis-file.js
create-exmaple-roles:
create-example-roles:
node ./dist/server/scripts/example-roles.js
create-memes-messages:

2
server/scripts/example-roles.ts
View File

@ -25,7 +25,7 @@ process.on('unhandledRejection', async (reason, promise) => {
await DB.assignRoleToMember(targetGuild.id, roleId, targetMember.id);
LOG.info('role created and assigned');
} catch (e) {
LOG.error('error creating permissions');
LOG.error('error creating permissions', e);
}
await DB.end();
})();

2
server/sql/init.sql
View File

@ -104,7 +104,7 @@ CREATE TABLE "messages" (
, "guild_id" UUID NOT NULL REFERENCES "guilds"("id") ON DELETE CASCADE
, "channel_id" UUID NOT NULL REFERENCES "channels"("id") ON DELETE CASCADE
, "member_id" UUID NOT NULL REFERENCES "members"("id") -- probably want set null
, "sent_dtg" TIMESTAMP(3) WITH TIME ZONE NOT NULL
, "sent_dtg" TIMESTAMP WITH TIME ZONE NOT NULL
, "text" TEXT
, "resource_id" UUID REFERENCES "resources"("id")
, "resource_name" VARCHAR(256)