mirror of
https://github.com/ankitects/anki.git
synced 2025-11-10 14:47:12 -05:00
Implement reactively updating Card Info
This commit is contained in:
parent
800975b0db
commit
a47453d5f3
3 changed files with 90 additions and 60 deletions
|
|
@ -19,6 +19,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||||
value: string | number;
|
value: string | number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function rowsFromStats(stats: Stats.CardStatsResponse): StatsRow[] {
|
||||||
const statsRows: StatsRow[] = [];
|
const statsRows: StatsRow[] = [];
|
||||||
|
|
||||||
statsRows.push({ label: tr2.cardStatsAdded(), value: dateString(stats.added) });
|
statsRows.push({ label: tr2.cardStatsAdded(), value: dateString(stats.added) });
|
||||||
|
|
@ -40,7 +41,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||||
|
|
||||||
const dueDate = unwrapOptionalNumber(stats.dueDate);
|
const dueDate = unwrapOptionalNumber(stats.dueDate);
|
||||||
if (dueDate !== undefined) {
|
if (dueDate !== undefined) {
|
||||||
statsRows.push({ label: tr2.statisticsDueDate(), value: dateString(dueDate) });
|
statsRows.push({
|
||||||
|
label: tr2.statisticsDueDate(),
|
||||||
|
value: dateString(dueDate),
|
||||||
|
});
|
||||||
}
|
}
|
||||||
const duePosition = unwrapOptionalNumber(stats.duePosition);
|
const duePosition = unwrapOptionalNumber(stats.duePosition);
|
||||||
if (duePosition !== undefined) {
|
if (duePosition !== undefined) {
|
||||||
|
|
@ -57,7 +61,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (stats.ease) {
|
if (stats.ease) {
|
||||||
statsRows.push({ label: tr2.cardStatsEase(), value: `${stats.ease / 10}%` });
|
statsRows.push({
|
||||||
|
label: tr2.cardStatsEase(),
|
||||||
|
value: `${stats.ease / 10}%`,
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
statsRows.push({ label: tr2.cardStatsReviewCount(), value: stats.reviews });
|
statsRows.push({ label: tr2.cardStatsReviewCount(), value: stats.reviews });
|
||||||
|
|
@ -80,6 +87,12 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||||
|
|
||||||
statsRows.push({ label: tr2.cardStatsCardId(), value: stats.cardId });
|
statsRows.push({ label: tr2.cardStatsCardId(), value: stats.cardId });
|
||||||
statsRows.push({ label: tr2.cardStatsNoteId(), value: stats.noteId });
|
statsRows.push({ label: tr2.cardStatsNoteId(), value: stats.noteId });
|
||||||
|
|
||||||
|
return statsRows;
|
||||||
|
}
|
||||||
|
|
||||||
|
let statsRows: StatsRow[];
|
||||||
|
$: statsRows = rowsFromStats(stats);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
|
||||||
|
|
@ -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}
|
||||||
|
|
|
||||||
|
|
@ -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 });
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue