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

Refactor editable/mathjax.ts

Browse source
This commit is contained in:
Henrik Giesel 2021-08-07 22:07:57 +02:00
parent 45d0cc49e6
commit c3f56ad5cd
1 changed files with 15 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
ts/editable/mathjax.ts
View file

@ -5,20 +5,23 @@ import { mathIcon } from "./icons";
const parser = new DOMParser(); const parser = new DOMParser();
function getStyle(nightMode: boolean, fontSize: number): HTMLStyleElement { function getCSS(nightMode: boolean, fontSize: number): string {
const style = document.createElement("style") as HTMLStyleElement;
const color = nightMode ? "white" : "black"; const color = nightMode ? "white" : "black";
/* color is set for Maths, fill for the empty icon */ /* color is set for Maths, fill for the empty icon */
const css = `svg { color: ${color}; fill: ${color}; font-size: ${fontSize}px; }`; return `svg { color: ${color}; fill: ${color}; font-size: ${fontSize}px; }`;
style.appendChild(document.createTextNode(css)); }
function getErrorCSS(fontSize: number): string {
return `svg { color: yellow; font-size: ${fontSize}px; }`;
}
function getStyle(css: string): HTMLStyleElement {
const style = document.createElement("style") as HTMLStyleElement;
style.appendChild(document.createTextNode(css));
return style; return style;
} }
function getEmptyIcon(nightMode: boolean, fontSize: number): [string, string] { function getEmptyIcon(style: HTMLStyleElement): [string, string] {
const style = getStyle(nightMode, fontSize);
const icon = parser.parseFromString(mathIcon, "image/svg+xml"); const icon = parser.parseFromString(mathIcon, "image/svg+xml");
const svg = icon.children[0]; const svg = icon.children[0];
svg.insertBefore(style, svg.children[0]); svg.insertBefore(style, svg.children[0]);
@ -31,15 +34,17 @@ export function convertMathjax(
nightMode: boolean, nightMode: boolean,
fontSize: number fontSize: number
): [string, string] { ): [string, string] {
const style = getStyle(getCSS(nightMode, fontSize));
if (input.trim().length === 0) { if (input.trim().length === 0) {
return getEmptyIcon(nightMode, fontSize); return getEmptyIcon(style);
} }
const output = globalThis.MathJax.tex2svg(input); const output = globalThis.MathJax.tex2svg(input);
const svg = output.children[0]; const svg = output.children[0];
if (svg.viewBox.baseVal.height === 16) { if (svg.viewBox.baseVal.height === 16) {
return getEmptyIcon(nightMode, fontSize); return getEmptyIcon(style);
} }
let title = ""; let title = "";
@ -49,7 +54,6 @@ export function convertMathjax(
svg.querySelector("text").setAttribute("color", "red"); svg.querySelector("text").setAttribute("color", "red");
title = svg.querySelector("title").innerHTML; title = svg.querySelector("title").innerHTML;
} else { } else {
const style = getStyle(nightMode, fontSize);
svg.insertBefore(style, svg.children[0]); svg.insertBefore(style, svg.children[0]);
} }