anki/ts/deck-options/FsrsOptions.svelte
2023-10-01 15:20:58 +10:00

335 lines
11 KiB
Svelte

<!--
Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
-->
<script lang="ts">
import {
ComputeRetentionProgress,
type ComputeWeightsProgress,
} from "@tslib/anki/collection_pb";
import { ComputeOptimalRetentionRequest } from "@tslib/anki/scheduler_pb";
import {
computeFsrsWeights,
computeOptimalRetention,
evaluateWeights,
setWantsAbort,
} from "@tslib/backend";
import * as tr from "@tslib/ftl";
import { runWithBackendProgress } from "@tslib/progress";
import SwitchRow from "components/SwitchRow.svelte";
import SettingTitle from "../components/SettingTitle.svelte";
import type { DeckOptionsState } from "./lib";
import SpinBoxFloatRow from "./SpinBoxFloatRow.svelte";
import SpinBoxRow from "./SpinBoxRow.svelte";
import WeightsInputRow from "./WeightsInputRow.svelte";
export let state: DeckOptionsState;
const presetName = state.currentPresetName;
const config = state.currentConfig;
const defaults = state.defaults;
let computeWeightsProgress: ComputeWeightsProgress | undefined;
let computingWeights = false;
let checkingWeights = false;
let computingRetention = false;
let optimalRetention = 0;
$: if ($presetName) {
optimalRetention = 0;
}
$: computing = computingWeights || checkingWeights || computingRetention;
$: customSearch = `preset:"${$presetName}"`;
let computeRetentionProgress:
| ComputeWeightsProgress
| ComputeRetentionProgress
| undefined;
const optimalRetentionRequest = new ComputeOptimalRetentionRequest({
deckSize: 10000,
daysToSimulate: 365,
maxMinutesOfStudyPerDay: 30,
lossAversion: 2.5,
});
$: if (optimalRetentionRequest.daysToSimulate > 3650) {
optimalRetentionRequest.daysToSimulate = 3650;
}
async function computeWeights(): Promise<void> {
if (computingWeights) {
await setWantsAbort({});
return;
}
computingWeights = true;
try {
await runWithBackendProgress(
async () => {
const resp = await computeFsrsWeights({
search: customSearch,
});
if (computeWeightsProgress) {
computeWeightsProgress.current = computeWeightsProgress.total;
}
if (resp.fsrsItems < 1000) {
alert(
tr.deckConfigMustHave1000Reviews({ count: resp.fsrsItems }),
);
} else {
$config.fsrsWeights = resp.weights;
}
},
(progress) => {
if (progress.value.case === "computeWeights") {
computeWeightsProgress = progress.value.value;
}
},
);
} finally {
computingWeights = false;
}
}
async function checkWeights(): Promise<void> {
if (checkingWeights) {
await setWantsAbort({});
return;
}
checkingWeights = true;
try {
await runWithBackendProgress(
async () => {
const search = customSearch ?? `preset:"${state.getCurrentName()}"`;
const resp = await evaluateWeights({
weights: $config.fsrsWeights,
search,
});
if (computeWeightsProgress) {
computeWeightsProgress.current = computeWeightsProgress.total;
}
setTimeout(
() =>
alert(
`Log loss: ${resp.logLoss.toFixed(
3,
)}, RMSE(bins): ${resp.rmseBins.toFixed(
3,
)}. ${tr.deckConfigSmallerIsBetter()}`,
),
200,
);
},
(progress) => {
if (progress.value.case === "computeWeights") {
computeWeightsProgress = progress.value.value;
}
},
);
} finally {
checkingWeights = false;
}
}
async function computeRetention(): Promise<void> {
if (computingRetention) {
await setWantsAbort({});
return;
}
computingRetention = true;
try {
await runWithBackendProgress(
async () => {
optimalRetentionRequest.maxInterval = $config.maximumReviewInterval;
optimalRetentionRequest.weights = $config.fsrsWeights;
optimalRetentionRequest.search = `preset:"${state.getCurrentName()}"`;
const resp = await computeOptimalRetention(optimalRetentionRequest);
optimalRetention = resp.optimalRetention;
if (computeRetentionProgress) {
computeRetentionProgress.current =
computeRetentionProgress.total;
}
},
(progress) => {
if (progress.value.case === "computeRetention") {
computeRetentionProgress = progress.value.value;
}
},
);
} finally {
computingRetention = false;
}
}
$: computeWeightsProgressString = renderWeightProgress(computeWeightsProgress);
$: computeRetentionProgressString = renderRetentionProgress(
computeRetentionProgress,
);
function renderWeightProgress(val: ComputeWeightsProgress | undefined): String {
if (!val || !val.total) {
return "";
}
let pct = ((val.current / val.total) * 100).toFixed(1);
pct = `${pct}%`;
if (val instanceof ComputeRetentionProgress) {
return pct;
} else {
return `${pct} of ${val.fsrsItems} reviews`;
}
}
function renderRetentionProgress(
val: ComputeRetentionProgress | undefined,
): String {
if (!val || !val.total) {
return "";
}
const pct = ((val.current / val.total) * 100).toFixed(0);
return tr.deckConfigComplete({ num: pct });
}
function stringForSetOptimalRetention(retention: number): String {
if (!retention) {
return "";
}
return tr.deckConfigSetOptimalRetention({ num: retention.toFixed(2) });
}
function setDesiredRetentionToOptimal() {
if (!optimalRetention) {
return;
}
$config.desiredRetention = optimalRetention;
}
</script>
<SpinBoxFloatRow
bind:value={$config.desiredRetention}
defaultValue={defaults.desiredRetention}
min={0.7}
max={0.97}
>
<SettingTitle>
{tr.deckConfigDesiredRetention()}
</SettingTitle>
</SpinBoxFloatRow>
<div class="ms-1 me-1">
<WeightsInputRow
bind:value={$config.fsrsWeights}
defaultValue={[]}
defaults={defaults.fsrsWeights}
>
<SettingTitle>{tr.deckConfigWeights()}</SettingTitle>
</WeightsInputRow>
</div>
<div class="m-2">
<SwitchRow bind:value={$config.rescheduleFsrsCards} defaultValue={false}>
<SettingTitle>
{tr.deckConfigRescheduleCardsOnChange()}
</SettingTitle>
</SwitchRow>
</div>
<div class="m-2">
<details>
<summary>{tr.deckConfigComputeOptimalWeights()}</summary>
<input bind:value={customSearch} class="w-100 mb-1" />
<button
class="btn {computingWeights ? 'btn-warning' : 'btn-primary'}"
disabled={!computingWeights && computing}
on:click={() => computeWeights()}
>
{#if computingWeights}
{tr.actionsCancel()}
{:else}
{tr.deckConfigOptimizeButton()}
{/if}
</button>
<button
class="btn {checkingWeights ? 'btn-warning' : 'btn-primary'}"
disabled={!checkingWeights && computing}
on:click={() => checkWeights()}
>
{#if checkingWeights}
{tr.actionsCancel()}
{:else}
{tr.deckConfigAnalyzeButton()}
{/if}
</button>
{#if computingWeights || checkingWeights}<div>
{computeWeightsProgressString}
</div>{/if}
</details>
</div>
<div class="m-2">
<details>
<summary>{tr.deckConfigComputeOptimalRetention()} (experimental)</summary>
<SpinBoxRow
bind:value={optimalRetentionRequest.deckSize}
defaultValue={10000}
min={100}
max={999999}
>
<SettingTitle>Deck size</SettingTitle>
</SpinBoxRow>
<SpinBoxRow
bind:value={optimalRetentionRequest.daysToSimulate}
defaultValue={365}
min={1}
max={3650}
>
<SettingTitle>Days to simulate</SettingTitle>
</SpinBoxRow>
<SpinBoxRow
bind:value={optimalRetentionRequest.maxMinutesOfStudyPerDay}
defaultValue={30}
min={1}
max={1800}
>
<SettingTitle>Minutes study/day</SettingTitle>
</SpinBoxRow>
<SpinBoxFloatRow
bind:value={optimalRetentionRequest.lossAversion}
defaultValue={2.5}
min={1.0}
max={3.0}
>
<SettingTitle>Loss aversion</SettingTitle>
</SpinBoxFloatRow>
<button
class="btn {computingRetention ? 'btn-warning' : 'btn-primary'}"
disabled={!computingRetention && computing}
on:click={() => computeRetention()}
>
{#if computingRetention}
{tr.actionsCancel()}
{:else}
{tr.deckConfigComputeButton()}
{/if}
</button>
{#if optimalRetention}
<button
class="btn {'btn-primary'}"
disabled={!optimalRetention ||
optimalRetention === $config.desiredRetention}
on:click={() => setDesiredRetentionToOptimal()}
>
{stringForSetOptimalRetention(optimalRetention)}
</button>
{/if}
<div>{computeRetentionProgressString}</div>
</details>
</div>
<style>
</style>