mirror of
https://github.com/go-gitea/gitea
synced 2024-08-28 13:05:19 +02:00
1. Fix multiple error display for math and mermaid: ![err](https://user-images.githubusercontent.com/115237/231126411-8a21a777-cd53-4b7e-ac67-5332623106e8.gif) 2. Fix height calculation of certain mermaid diagrams by reading the iframe inner height from it's document instead of parsing it from SVG: Before: <img width="866" alt="Screenshot 2023-04-11 at 11 56 27" src="https://user-images.githubusercontent.com/115237/231126480-b194e02b-ea8c-4ddf-8c79-50c525815d92.png"> After: <img width="855" alt="Screenshot 2023-04-11 at 11 56 35" src="https://user-images.githubusercontent.com/115237/231126494-5fe86a48-8d21-455a-8b95-79b6ee27a16f.png"> 3. Refactor error handling to a common function 4. Rename to `renderAsciicast` for consistency 5. Improve mermaid loading sequence Note: I did try `securityLevel: 'sandbox'` to make mermaid output a iframe directly, but that showed a bug in mermaid where the iframe style height was set incorrectly. Opened https://github.com/mermaid-js/mermaid/issues/4289 for this. --------- Co-authored-by: Giteabot <teabot@gitea.io>
17 lines
690 B
JavaScript
17 lines
690 B
JavaScript
export async function renderAsciicast() {
|
|
const els = document.querySelectorAll('.asciinema-player-container');
|
|
if (!els.length) return;
|
|
|
|
const [player] = await Promise.all([
|
|
import(/* webpackChunkName: "asciinema-player" */'asciinema-player'),
|
|
import(/* webpackChunkName: "asciinema-player" */'asciinema-player/dist/bundle/asciinema-player.css'),
|
|
]);
|
|
|
|
for (const el of els) {
|
|
player.create(el.getAttribute('data-asciinema-player-src'), el, {
|
|
// poster (a preview frame) to display until the playback is started.
|
|
// Set it to 1 hour (also means the end if the video is shorter) to make the preview frame show more.
|
|
poster: 'npt:1:0:0',
|
|
});
|
|
}
|
|
}
|