GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 22:12:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Merge branch 'accessibility-color-blind' of https://github.com/David-Brenn/anki into accessibility-color-blind

Browse source
This commit is contained in:
Matthis 2025-08-14 13:22:29 +02:00
commit 03234de5de
2 changed files with 30 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
ts/routes/graphs/added.ts
View file

@ -8,7 +8,7 @@
import type { GraphsResponse } from "@generated/anki/stats_pb"; import type { GraphsResponse } from "@generated/anki/stats_pb";
import * as tr from "@generated/ftl"; import * as tr from "@generated/ftl";
import { dayLabel } from "@tslib/time"; import { dayLabel } from "@tslib/time";
import type { Bin } from "d3"; import { type Bin, interpolateViridis } from "d3";
import { bin, interpolateBlues, min, scaleLinear, scaleSequential, sum } from "d3"; import { bin, interpolateBlues, min, scaleLinear, scaleSequential, sum } from "d3";
import type { SearchDispatch, TableDatum } from "./graph-helpers"; import type { SearchDispatch, TableDatum } from "./graph-helpers";
@ -80,8 +80,18 @@ export function buildHistogram(
return [null, []]; return [null, []];
} }
const adjustedRange = scaleLinear().range([0.7, 0.3]); let adjustedRange;
const colourScale = scaleSequential((n) => interpolateBlues(adjustedRange(n)!)).domain([xMax!, xMin!]); let colourScale;
const isColourBlindMode = (window as any).colorBlindMode;
// Changing color based on mode
if(isColourBlindMode){
adjustedRange = scaleLinear().range([0.3, 0.7]);
colourScale = scaleSequential((n) => interpolateViridis(adjustedRange(n)!)).domain([xMax!, xMin!]);
} else {
adjustedRange = scaleLinear().range([0.7, 0.3]);
colourScale = scaleSequential((n) => interpolateBlues(adjustedRange(n)!)).domain([xMax!, xMin!]);
}
const totalInPeriod = sum(bins, accessor); const totalInPeriod = sum(bins, accessor);
const periodDays = Math.abs(xMin!); const periodDays = Math.abs(xMin!);

19
ts/routes/graphs/buttons.ts
View file

@ -12,6 +12,7 @@ import {
axisBottom, axisBottom,
axisLeft, axisLeft,
interpolateRdYlGn, interpolateRdYlGn,
interpolateViridis,
pointer, pointer,
scaleBand, scaleBand,
scaleLinear, scaleLinear,
@ -20,7 +21,7 @@ import {
sum, sum,
} from "d3"; } from "d3";
import type { GraphBounds } from "./graph-helpers"; import { colorBlindColors, type GraphBounds } from "./graph-helpers";
import { GraphRange } from "./graph-helpers"; import { GraphRange } from "./graph-helpers";
import { setDataAvailable } from "./graph-helpers"; import { setDataAvailable } from "./graph-helpers";
import { hideTooltip, showTooltip } from "./tooltip-utils.svelte"; import { hideTooltip, showTooltip } from "./tooltip-utils.svelte";
@ -162,7 +163,21 @@ export function renderButtons(
.paddingOuter(1) .paddingOuter(1)
.paddingInner(0.1); .paddingInner(0.1);
const colour = scaleSequential(interpolateRdYlGn).domain([1, 4]); const isColourBlindMode = (window as any).colorBlindMode;
let colour;
// Changing color based on mode
if(isColourBlindMode){
/*colour = [
colorBlindColors.mature, // darker red, again button
colorBlindColors.suspended, // lighter beige/yellow, hard button
colorBlindColors.new, // light blue, good button
colorBlindColors.relearn // green, easy button
]*/
colour = scaleSequential(interpolateViridis).domain([1, 4]);
} else {
colour = scaleSequential(interpolateRdYlGn).domain([1, 4]);
}
// y scale // y scale
const yTickFormat = (n: number): string => localizedNumber(n); const yTickFormat = (n: number): string => localizedNumber(n);