Adds MathJax support to the web version of Anki
// ==UserScript==
// @name AnkiWeb MathJax
// @description Adds MathJax support to the web version of Anki
// @namespace https://giuseppe.eletto.me
// @author Giuseppe Eletto
// @version 0.3.1
// @license MIT
// @match https://ankiuser.net/study/
// ==/UserScript==
(function() {
// Constants
const MATHJAX_CDN = 'https://cdn.jsdelivr.net/npm/mathjax@3'
const ANKI_QA_BOX = document.querySelector('div#qa_box > div#qa')
const ANKI_QA_OBS = new MutationObserver(l => {
const lastMutation = l[l.length - 1]
const textNodes = Array.from(lastMutation.addedNodes)
.filter(n => n.nodeType === 3)
if (textNodes.length === 0) return
unsafeWindow.MathJax.typesetPromise()
})
// CUSTOM CSS
ANKI_QA_BOX.style.textAlign = 'justify'
// Setup custom MathJax configurations
unsafeWindow.MathJax = {
chtml: {
fontURL: `${MATHJAX_CDN}/output/chtml/fonts/woff-v2`
},
startup: {
typeset: true,
elements: [ANKI_QA_BOX],
ready: () => {
// Start watching for "Q&A" div changes
ANKI_QA_OBS.observe(ANKI_QA_BOX, { subtree: false, childList: true })
// Continues MathJax startup
return unsafeWindow.MathJax.startup.defaultReady()
}
}
}
// Append and load MathJax script
const mathJaxChtml = document.createElement('script')
mathJaxChtml.src = `${MATHJAX_CDN}/tex-mml-chtml.js`
document.body.appendChild(mathJaxChtml)
})()