mirror of
https://github.com/glassflame/glassflame.github.io.git
synced 2024-12-22 14:44:22 +00:00
Compare commits
No commits in common. "2df251dcd43345faa9cc8316f669a55d56c68a61" and "154711b63c18eb838f8c0b9b10cf62c6c0e0aa53" have entirely different histories.
2df251dcd4
...
154711b63c
3 changed files with 5 additions and 124 deletions
|
@ -1,7 +1,5 @@
|
|||
import {CustomElement} from "../base.mjs";
|
||||
import {default as katex} from 'https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.mjs';
|
||||
import { MarkdownElement } from "./renderer.mjs";
|
||||
import { findFirstAncestor } from "../../utils/traversal.mjs";
|
||||
|
||||
/**
|
||||
* Element rendering TeX math.
|
||||
|
@ -11,21 +9,6 @@ export class MathElement extends CustomElement {
|
|||
return document.getElementById("template-math")
|
||||
}
|
||||
|
||||
/**
|
||||
* Element representing the Markdown context where this math formula is displayed in.
|
||||
* Can be recalculated with {@link recalculateRenderer}.
|
||||
* @type {MarkdownElement}
|
||||
*/
|
||||
renderer
|
||||
|
||||
/**
|
||||
* Recalculate the value of {@link browse} and {@link vault} using this element's current position in the DOM.
|
||||
* @returns {void}
|
||||
*/
|
||||
recalculateRenderer() {
|
||||
this.renderer = findFirstAncestor(this, MarkdownElement)
|
||||
}
|
||||
|
||||
/**
|
||||
* The math to render, obtained from the `document` attribute.
|
||||
* @returns {string}
|
||||
|
@ -68,7 +51,7 @@ export class MathElement extends CustomElement {
|
|||
/**
|
||||
* Recreate {@link katexElement} with the current values of {@link texDocument} and {@link isBlock}.
|
||||
*/
|
||||
async recreateKatexElement() {
|
||||
recreateKatexElement() {
|
||||
if(this.katexElement) {
|
||||
this.katexElement.remove()
|
||||
this.katexElement = null
|
||||
|
@ -79,16 +62,12 @@ export class MathElement extends CustomElement {
|
|||
this.katexElement.classList.add("math")
|
||||
this.katexElement.classList.add(this.isBlock ? "math-block" : "math-inline")
|
||||
|
||||
await this.renderer.sleepUntilKatexMacrosAreAvailable()
|
||||
|
||||
katex.render(
|
||||
this.texDocument,
|
||||
this.katexElement,
|
||||
{
|
||||
throwOnError: false,
|
||||
globalGroup: true,
|
||||
macros: this.renderer.katexMacros,
|
||||
trust: true,
|
||||
}
|
||||
)
|
||||
|
||||
|
@ -97,7 +76,7 @@ export class MathElement extends CustomElement {
|
|||
|
||||
onConnect() {
|
||||
super.onConnect()
|
||||
this.recalculateRenderer()
|
||||
|
||||
this.recreateKatexElement()
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,8 +1,6 @@
|
|||
import { Marked } from "https://unpkg.com/marked@9.1.2/lib/marked.esm.js";
|
||||
import { CustomElement } from "../base.mjs";
|
||||
import {toTitleCase} from "../../utils/case.mjs";
|
||||
import {findFirstAncestor} from "../../utils/traversal.mjs";
|
||||
import {VaultElement} from "../vault.mjs";
|
||||
|
||||
|
||||
/**
|
||||
|
@ -13,21 +11,6 @@ export class MarkdownElement extends CustomElement {
|
|||
return document.getElementById("template-markdown")
|
||||
}
|
||||
|
||||
/**
|
||||
* Element representing the Obsidian Vault.
|
||||
* Can be recalculated with {@link recalculateVault}.
|
||||
* @type {VaultElement}
|
||||
*/
|
||||
vault
|
||||
|
||||
/**
|
||||
* Recalculate the value of {@link browse} and {@link vault} using this element's current position in the DOM.
|
||||
* @returns {void}
|
||||
*/
|
||||
recalculateVault() {
|
||||
this.vault = findFirstAncestor(this, VaultElement)
|
||||
}
|
||||
|
||||
// noinspection JSUnusedGlobalSymbols
|
||||
/**
|
||||
* {@link Marked} Markdown renderer.
|
||||
|
@ -231,38 +214,6 @@ export class MarkdownElement extends CustomElement {
|
|||
*/
|
||||
static DOCUMENT_ELEMENT_SLOT = "markdown-document"
|
||||
|
||||
/**
|
||||
* Macros to be used in every single {@link MathElement} of the renderer.
|
||||
*/
|
||||
katexMacros
|
||||
|
||||
/**
|
||||
* Update {@link katexMacros} from the root {@link VaultElement}.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async refetchKatexMacros() {
|
||||
await this.vault.sleepUntilKatexMacrosAreAvailable()
|
||||
this.katexMacros = {...this.vault.katexMacros}
|
||||
this.#katexMacrosQueue.forEach(resolve => resolve(undefined))
|
||||
}
|
||||
|
||||
/**
|
||||
* Array of resolve {@link Promise} objects of tasks awaiting {@link sleepUntilKatexPreambleIsAvailable}.
|
||||
* @type {((v: undefined) => void)[]}
|
||||
*/
|
||||
#katexMacrosQueue = []
|
||||
|
||||
/**
|
||||
* Await until {@link katexPreamble} becomes available.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async sleepUntilKatexMacrosAreAvailable() {
|
||||
if(this.katexMacros !== undefined) {
|
||||
return
|
||||
}
|
||||
await new Promise(resolve => this.#katexMacrosQueue.push(resolve))
|
||||
}
|
||||
|
||||
/**
|
||||
* Recreate {@link documentElement} using the current value of {@link markdownDocument}.
|
||||
*/
|
||||
|
@ -275,14 +226,11 @@ export class MarkdownElement extends CustomElement {
|
|||
this.documentElement = document.createElement("div")
|
||||
this.documentElement.slot = this.constructor.DOCUMENT_ELEMENT_SLOT
|
||||
this.documentElement.innerHTML = this.constructor.MARKED.parse(this.markdownDocument)
|
||||
|
||||
this.appendChild(this.documentElement)
|
||||
}
|
||||
|
||||
onConnect() {
|
||||
super.onConnect()
|
||||
this.recalculateVault()
|
||||
this.recreateDocumentElement()
|
||||
this.refetchKatexMacros().then()
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
import { CustomElement } from "./base.mjs";
|
||||
import { sleep } from "../utils/sleep.mjs";
|
||||
import {default as katex} from 'https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.mjs';
|
||||
|
||||
|
||||
/**
|
||||
|
@ -187,56 +186,11 @@ export class VaultElement extends CustomElement {
|
|||
await new Promise(resolve => this.#fileIndexQueue.push(resolve))
|
||||
}
|
||||
|
||||
/**
|
||||
* Macros to be used in every single {@link MathElement} of the vault.
|
||||
*/
|
||||
katexMacros
|
||||
|
||||
/**
|
||||
* Update {@link katexMacros} by fetching the `preamble.sty` file located at the root of the Vault, and then having KaTeX render it to a string, which is then discarded.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async refetchKatexMacros() {
|
||||
const response = await this.fetchCooldown("preamble.sty")
|
||||
if(response.status >= 400) {
|
||||
this.katexMacros = {}
|
||||
this.#katexMacrosQueue.forEach(resolve => resolve(undefined))
|
||||
return
|
||||
}
|
||||
const preamble = await response.text()
|
||||
this.katexMacros = {}
|
||||
katex.renderToString(preamble, {
|
||||
throwOnError: false,
|
||||
globalGroup: true,
|
||||
macros: this.katexMacros,
|
||||
trust: true,
|
||||
})
|
||||
this.#katexMacrosQueue.forEach(resolve => resolve(undefined))
|
||||
}
|
||||
|
||||
/**
|
||||
* Array of resolve {@link Promise} objects of tasks awaiting {@link sleepUntilKatexPreambleIsAvailable}.
|
||||
* @type {((v: undefined) => void)[]}
|
||||
*/
|
||||
#katexMacrosQueue = []
|
||||
|
||||
/**
|
||||
* Await until {@link katexPreamble} becomes available.
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async sleepUntilKatexMacrosAreAvailable() {
|
||||
if(this.katexMacros !== undefined) {
|
||||
return
|
||||
}
|
||||
await new Promise(resolve => this.#katexMacrosQueue.push(resolve))
|
||||
}
|
||||
|
||||
onConnect() {
|
||||
async onConnect() {
|
||||
super.onConnect()
|
||||
this.recalculateVaultElement()
|
||||
this.#fetchQueueScheduler().then()
|
||||
this.refetchAppearance().then()
|
||||
this.refetchFileIndex().then()
|
||||
this.refetchKatexMacros().then()
|
||||
await this.refetchAppearance()
|
||||
await this.refetchFileIndex()
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue