dec0fbe845
Merging note: the typing changes were fixed in a separate PR. * Put rootDirs into subprojects - typings do not work for any ts or svelte files - if we set the 'rootDirs' in ts/tsconfig.json to '../bazel-bin/ts' and then inherit them from e.g. editor, the root will be changed to '../../bazel-bin/ts', however editor needs look in '../../bazel-bin/ts/editor' instead. * Rename i18n and i18n_helpers to i18n-generated and i18n - This way, we can restrict the awkwardness of importing files outside the ts directory within lib * Fix missing typing of i18n and backend_proto by adding back symlinks * Split up i18n-generated into i18n-{translate,modules} * Change i18n from singleton to functions * Revert "Put rootDirs into subprojects" This partially reverts commit e1d4292ce3979e7b7ee21bf3951b8a462d45c29c. It seems like this might not be necessary after all. However some other change made on this branch seems to have fixed the .svelte.d.ts imports * Introduce i18n-bundles to remove circular import There was a circular import i18n.ts <-> i18n-translate.ts * Create own directory for i18n * Move lib/i18n/translate to lib/translate * This restores tree shaking * Update tsconfig libs and module * es2018-2020 have wide support on all modern browsers including * Switch bundles and langs inside i18n to variables again * Add missing copyright header * Rename translate.ts to ftl.ts * Remove the symlinks again I added them to fix to have completion for tr, however this would have also have meant to abandon the tree shaking. As we want to have tree shaking, it's also not necessary to have the symlinks anymore * Revert "Update tsconfig libs and module" This reverts commit 0a96776a475e9901c1f9f3407c726d1d002fb9ef. * move withCollapsedWhitespace back to i18n/utils * Add back /ts as in rootDirs
183 lines
4.8 KiB
TypeScript
183 lines
4.8 KiB
TypeScript
// Copyright: Ankitects Pty Ltd and contributors
|
|
// License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|
|
|
/* eslint
|
|
@typescript-eslint/no-non-null-assertion: "off",
|
|
@typescript-eslint/no-explicit-any: "off",
|
|
*/
|
|
|
|
import type { Stats, Cards } from "../lib/proto";
|
|
import {
|
|
extent,
|
|
histogram,
|
|
quantile,
|
|
sum,
|
|
mean,
|
|
scaleLinear,
|
|
scaleSequential,
|
|
interpolateBlues,
|
|
} from "d3";
|
|
import type { Bin } from "d3";
|
|
import * as tr from "../lib/ftl";
|
|
import { timeSpan } from "../lib/time";
|
|
import { CardType } from "../lib/cards";
|
|
import type { HistogramData } from "./histogram-graph";
|
|
|
|
import type { TableDatum, SearchDispatch } from "./graph-helpers";
|
|
|
|
export interface IntervalGraphData {
|
|
intervals: number[];
|
|
}
|
|
|
|
export enum IntervalRange {
|
|
Month = 0,
|
|
Percentile50 = 1,
|
|
Percentile95 = 2,
|
|
All = 3,
|
|
}
|
|
|
|
export function gatherIntervalData(data: Stats.GraphsResponse): IntervalGraphData {
|
|
const intervals = (data.cards as Cards.Card[])
|
|
.filter((c) => [CardType.Review, CardType.Relearn].includes(c.ctype))
|
|
.map((c) => c.interval);
|
|
return { intervals };
|
|
}
|
|
|
|
export function intervalLabel(
|
|
daysStart: number,
|
|
daysEnd: number,
|
|
cards: number
|
|
): string {
|
|
if (daysEnd - daysStart <= 1) {
|
|
// singular
|
|
return tr.statisticsIntervalsDaySingle({
|
|
day: daysStart,
|
|
cards,
|
|
});
|
|
} else {
|
|
// range
|
|
return tr.statisticsIntervalsDayRange({
|
|
daysStart,
|
|
daysEnd: daysEnd - 1,
|
|
cards,
|
|
});
|
|
}
|
|
}
|
|
|
|
function makeQuery(start: number, end: number): string {
|
|
if (start === end) {
|
|
return `"prop:ivl=${start}"`;
|
|
}
|
|
|
|
const fromQuery = `"prop:ivl>=${start}"`;
|
|
const tillQuery = `"prop:ivl<=${end}"`;
|
|
|
|
return `${fromQuery} AND ${tillQuery}`;
|
|
}
|
|
|
|
export function prepareIntervalData(
|
|
data: IntervalGraphData,
|
|
range: IntervalRange,
|
|
dispatch: SearchDispatch,
|
|
browserLinksSupported: boolean
|
|
): [HistogramData | null, TableDatum[]] {
|
|
// get min/max
|
|
const allIntervals = data.intervals;
|
|
if (!allIntervals.length) {
|
|
return [null, []];
|
|
}
|
|
|
|
const xMin = 0;
|
|
let [, xMax] = extent(allIntervals);
|
|
let niceNecessary = false;
|
|
|
|
// cap max to selected range
|
|
switch (range) {
|
|
case IntervalRange.Month:
|
|
xMax = Math.min(xMax!, 30);
|
|
break;
|
|
case IntervalRange.Percentile50:
|
|
xMax = quantile(allIntervals, 0.5);
|
|
niceNecessary = true;
|
|
break;
|
|
case IntervalRange.Percentile95:
|
|
xMax = quantile(allIntervals, 0.95);
|
|
niceNecessary = true;
|
|
break;
|
|
case IntervalRange.All:
|
|
niceNecessary = true;
|
|
break;
|
|
}
|
|
|
|
xMax = xMax! + 1;
|
|
|
|
// do not show the zero interval
|
|
const increment = (x: number): number => x + 1;
|
|
|
|
const adjustTicks = (x: number, idx: number, ticks: number[]): number[] =>
|
|
idx === ticks.length - 1 ? [x - (ticks[0] - 1), x + 1] : [x - (ticks[0] - 1)];
|
|
|
|
// cap bars to available range
|
|
const desiredBars = Math.min(70, xMax! - xMin!);
|
|
|
|
const prescale = scaleLinear().domain([xMin!, xMax!]);
|
|
const scale = scaleLinear().domain(
|
|
(niceNecessary ? prescale.nice() : prescale).domain().map(increment)
|
|
);
|
|
|
|
const bins = histogram()
|
|
.domain(scale.domain() as [number, number])
|
|
.thresholds(scale.ticks(desiredBars).flatMap(adjustTicks))(allIntervals);
|
|
|
|
// empty graph?
|
|
const totalInPeriod = sum(bins, (bin) => bin.length);
|
|
if (!totalInPeriod) {
|
|
return [null, []];
|
|
}
|
|
|
|
const adjustedRange = scaleLinear().range([0.7, 0.3]);
|
|
const colourScale = scaleSequential((n) =>
|
|
interpolateBlues(adjustedRange(n)!)
|
|
).domain([xMax!, xMin!]);
|
|
|
|
function hoverText(
|
|
bin: Bin<number, number>,
|
|
_cumulative: number,
|
|
percent: number
|
|
): string {
|
|
// const day = dayLabel(bin.x0!, bin.x1!);
|
|
const interval = intervalLabel(bin.x0!, bin.x1!, bin.length);
|
|
const total = tr.statisticsRunningTotal();
|
|
return `${interval}<br>${total}: \u200e${percent.toFixed(1)}%`;
|
|
}
|
|
|
|
function onClick(bin: Bin<number, number>): void {
|
|
const start = bin.x0!;
|
|
const end = bin.x1! - 1;
|
|
const query = makeQuery(start, end);
|
|
dispatch("search", { query });
|
|
}
|
|
|
|
const meanInterval = Math.round(mean(allIntervals) ?? 0);
|
|
const meanIntervalString = timeSpan(meanInterval * 86400, false);
|
|
const tableData = [
|
|
{
|
|
label: tr.statisticsAverageInterval(),
|
|
value: meanIntervalString,
|
|
},
|
|
];
|
|
|
|
return [
|
|
{
|
|
scale,
|
|
bins,
|
|
total: totalInPeriod,
|
|
hoverText,
|
|
onClick: browserLinksSupported ? onClick : null,
|
|
colourScale,
|
|
showArea: true,
|
|
},
|
|
tableData,
|
|
];
|
|
}
|