GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-11-10 14:47:12 -05:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Implement reactively updating Card Info

Browse source
This commit is contained in:
RumovZ 2021-10-16 23:32:00 +02:00
parent 800975b0db
commit a47453d5f3
3 changed files with 90 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

127
ts/card-info/CardInfo.svelte
View file

@ -19,67 +19,80 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
value: string | number; value: string | number;
} }
const statsRows: StatsRow[] = []; function rowsFromStats(stats: Stats.CardStatsResponse): StatsRow[] {
const statsRows: StatsRow[] = [];
statsRows.push({ label: tr2.cardStatsAdded(), value: dateString(stats.added) }); statsRows.push({ label: tr2.cardStatsAdded(), value: dateString(stats.added) });
const firstReview = unwrapOptionalNumber(stats.firstReview); const firstReview = unwrapOptionalNumber(stats.firstReview);
if (firstReview !== undefined) { if (firstReview !== undefined) {
statsRows.push({ statsRows.push({
label: tr2.cardStatsFirstReview(), label: tr2.cardStatsFirstReview(),
value: dateString(firstReview), value: dateString(firstReview),
}); });
} }
const latestReview = unwrapOptionalNumber(stats.latestReview); const latestReview = unwrapOptionalNumber(stats.latestReview);
if (latestReview !== undefined) { if (latestReview !== undefined) {
statsRows.push({ statsRows.push({
label: tr2.cardStatsLatestReview(), label: tr2.cardStatsLatestReview(),
value: dateString(latestReview), value: dateString(latestReview),
}); });
}
const dueDate = unwrapOptionalNumber(stats.dueDate);
if (dueDate !== undefined) {
statsRows.push({
label: tr2.statisticsDueDate(),
value: dateString(dueDate),
});
}
const duePosition = unwrapOptionalNumber(stats.duePosition);
if (duePosition !== undefined) {
statsRows.push({
label: tr2.cardStatsNewCardPosition(),
value: dateString(duePosition),
});
}
if (stats.interval) {
statsRows.push({
label: tr2.cardStatsInterval(),
value: timeSpan(stats.interval * DAY),
});
}
if (stats.ease) {
statsRows.push({
label: tr2.cardStatsEase(),
value: `${stats.ease / 10}%`,
});
}
statsRows.push({ label: tr2.cardStatsReviewCount(), value: stats.reviews });
statsRows.push({ label: tr2.cardStatsLapseCount(), value: stats.lapses });
if (stats.totalSecs) {
statsRows.push({
label: tr2.cardStatsAverageTime(),
value: timeSpan(stats.averageSecs),
});
statsRows.push({
label: tr2.cardStatsTotalTime(),
value: timeSpan(stats.totalSecs),
});
}
statsRows.push({ label: tr2.cardStatsCardTemplate(), value: stats.cardType });
statsRows.push({ label: tr2.cardStatsNoteType(), value: stats.notetype });
statsRows.push({ label: tr2.cardStatsDeckName(), value: stats.deck });
statsRows.push({ label: tr2.cardStatsCardId(), value: stats.cardId });
statsRows.push({ label: tr2.cardStatsNoteId(), value: stats.noteId });
return statsRows;
} }
const dueDate = unwrapOptionalNumber(stats.dueDate); let statsRows: StatsRow[];
if (dueDate !== undefined) { $: statsRows = rowsFromStats(stats);
statsRows.push({ label: tr2.statisticsDueDate(), value: dateString(dueDate) });
}
const duePosition = unwrapOptionalNumber(stats.duePosition);
if (duePosition !== undefined) {
statsRows.push({
label: tr2.cardStatsNewCardPosition(),
value: dateString(duePosition),
});
}
if (stats.interval) {
statsRows.push({
label: tr2.cardStatsInterval(),
value: timeSpan(stats.interval * DAY),
});
}
if (stats.ease) {
statsRows.push({ label: tr2.cardStatsEase(), value: `${stats.ease / 10}%` });
}
statsRows.push({ label: tr2.cardStatsReviewCount(), value: stats.reviews });
statsRows.push({ label: tr2.cardStatsLapseCount(), value: stats.lapses });
if (stats.totalSecs) {
statsRows.push({
label: tr2.cardStatsAverageTime(),
value: timeSpan(stats.averageSecs),
});
statsRows.push({
label: tr2.cardStatsTotalTime(),
value: timeSpan(stats.totalSecs),
});
}
statsRows.push({ label: tr2.cardStatsCardTemplate(), value: stats.cardType });
statsRows.push({ label: tr2.cardStatsNoteType(), value: stats.notetype });
statsRows.push({ label: tr2.cardStatsDeckName(), value: stats.deck });
statsRows.push({ label: tr2.cardStatsCardId(), value: stats.cardId });
statsRows.push({ label: tr2.cardStatsNoteId(), value: stats.noteId });
</script> </script>
<div class="container"> <div class="container">

5
ts/card-info/Revlog.svelte
View file

@ -72,9 +72,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
}; };
} }
const revlogRows: RevlogRow[] = stats.revlog.map((entry) => let revlogRows: RevlogRow[];
revlogRowFromEntry(entry) $: revlogRows = stats.revlog.map((entry) => revlogRowFromEntry(entry));
);
</script> </script>
{#if stats.revlog.length} {#if stats.revlog.length}

18
ts/card-info/index.ts
View file

@ -7,6 +7,8 @@ import { checkNightMode } from "../lib/nightmode";
import CardInfo from "./CardInfo.svelte"; import CardInfo from "./CardInfo.svelte";
const _updatingQueue: Promise<void> = Promise.resolve();
export async function cardInfo( export async function cardInfo(
target: HTMLDivElement, target: HTMLDivElement,
cardId: number, cardId: number,
@ -31,3 +33,19 @@ export async function cardInfo(
props: { stats }, props: { stats },
}); });
} }
export async function updateCardInfo(
cardInfo: Promise<CardInfo>,
cardId: number,
includeRevlog: boolean
): Promise<void> {
_updatingQueue.then(async () => {
cardInfo.then(async (cardInfo) => {
const stats = await getCardStats(cardId);
if (!includeRevlog) {
stats.revlog = [];
}
cardInfo.$set({ stats });
});
});
}