vditor 3.10.1 → 3.10.2

package/src/ts/markdown/mediaRender.ts

@@ -1,3 +1,5 @@
+import {getSearch} from "../util/function";
+
 const videoRender = (element: HTMLElement, url: string) => {
     element.insertAdjacentHTML("afterend", `<video controls="controls" src="${url}"></video>`);
     element.remove();
@@ -46,10 +48,35 @@ const iframeRender = (element: HTMLElement, url: string) => {
             `<iframe class="iframe__video"
  src="https://www.dailymotion.com/embed/video/${dailymotionMatch[2]}"></iframe>`);
         element.remove();
-    } else if (bilibiliMatch && bilibiliMatch[1]) {
+    } else if (url.indexOf("bilibili.com") > -1 && (url.indexOf("bvid=") > -1 || (bilibiliMatch && bilibiliMatch[1]))) {
+        const params: IObject = {
+            bvid:  getSearch("bvid", url) || (bilibiliMatch && bilibiliMatch[1]),
+            page: "1",
+            high_quality: "1",
+            as_wide: "1",
+            allowfullscreen: "true",
+            autoplay: "0"
+        };
+        new URL(url.startsWith("http") ? url : "https:" + url).search.split("&").forEach((item, index) => {
+            if (!item) {
+                return;
+            }
+            if (index === 0) {
+                item = item.substr(1);
+            }
+            const keyValue = item.split("=");
+            params[keyValue[0]] = keyValue[1];
+        });
+        let src = "https://player.bilibili.com/player.html?";
+        const keys = Object.keys(params);
+        keys.forEach((key, index) => {
+            src += `${key}=${params[key]}`;
+            if (index < keys.length - 1) {
+                src += "&";
+            }
+        });
         element.insertAdjacentHTML("afterend",
-            `<iframe class="iframe__video"
- src="//player.bilibili.com/player.html?bvid=${bilibiliMatch[1]}"></iframe>`);
+            `<iframe class="iframe__video" src="${src}"></iframe>`);
         element.remove();
     } else if (tedMatch && tedMatch[1]) {
         element.insertAdjacentHTML("afterend",

package/src/ts/markdown/mermaidRender.ts

@@ -1,10 +1,11 @@
 import {Constants} from "../constants";
 import {addScript} from "../util/addScript";
 import {mermaidRenderAdapter} from "./adapterRender";
+import {genUUID} from "../util/function";
 
 declare const mermaid: {
     initialize(options: any): void,
-    init(options: any, element: Element): void,
+    render(id: string, text: string): { svg: string }
 };
 
 export const mermaidRender = (element: HTMLElement, cdn = Constants.CDN, theme: string) => {
@@ -12,7 +13,7 @@ export const mermaidRender = (element: HTMLElement, cdn = Constants.CDN, theme:
     if (mermaidElements.length === 0) {
         return;
     }
-    addScript(`${cdn}/dist/js/mermaid/mermaid.min.js?v=10.8.0`, "vditorMermaidScript").then(() => {
+    addScript(`${cdn}/dist/js/mermaid/mermaid.min.js`, "vditorMermaidScript").then(() => {
         const config: any = {
             securityLevel: "loose", // 升级后无 https://github.com/siyuan-note/siyuan/issues/3587，可使用该选项
             altFontFamily: "sans-serif",
@@ -26,7 +27,8 @@ export const mermaidRender = (element: HTMLElement, cdn = Constants.CDN, theme:
                 useMaxWidth: true,
                 diagramMarginX: 8,
                 diagramMarginY: 8,
-                boxMargin: 8
+                boxMargin: 8,
+                showSequenceNumbers: true // Mermaid 时序图增加序号 https://github.com/siyuan-note/siyuan/pull/6992 https://mermaid.js.org/syntax/sequenceDiagram.html#sequencenumbers
             },
             gantt: {
                 leftPadding: 75,
@@ -37,12 +39,21 @@ export const mermaidRender = (element: HTMLElement, cdn = Constants.CDN, theme:
             config.theme = "dark";
         }
         mermaid.initialize(config);
-        mermaidElements.forEach((item) => {
+        mermaidElements.forEach(async (item) => {
             const code = mermaidRenderAdapter.getCode(item);
             if (item.getAttribute("data-processed") === "true" || code.trim() === "") {
                 return;
             }
-            mermaid.init(undefined, item);
+            const id = "mermaid"+genUUID()
+            try {
+                const mermaidData = await mermaid.render(id, item.textContent);
+                item.innerHTML = mermaidData.svg;
+            } catch (e) {
+                const errorElement = document.querySelector("#" + id);
+                item.innerHTML = `${errorElement.outerHTML}<br>
+<div style="text-align: left"><small>${e.message.replace(/\n/, "<br>")}</small></div>`;
+                errorElement.parentElement.remove();
+            }
             item.setAttribute("data-processed", "true");
         });
     });

package/src/ts/markdown/plantumlRender.ts

@@ -22,7 +22,7 @@ export const plantumlRender = (element: (HTMLElement | Document) = document, cdn
                 return;
             }
             try {
-                e.innerHTML = `<img src="http://www.plantuml.com/plantuml/svg/~1${plantumlEncoder.encode(text)}">`;
+                e.innerHTML = `<object type="image/svg+xml" data="http://www.plantuml.com/plantuml/svg/~1${plantumlEncoder.encode(text)}"/>`;
             } catch (error) {
                 e.className = "vditor-reset--error";
                 e.innerHTML = `plantuml render error: <br>${error}`;

package/src/ts/util/function.ts

@@ -1,3 +1,11 @@
 export const genUUID = () => ([1e7].toString() + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) =>
     (parseInt(c, 10) ^ (window.crypto.getRandomValues(new Uint32Array(1))[0] & (15 >> (parseInt(c, 10) / 4)))).toString(16)
 );
+
+export const getSearch = (key: string, link = window.location.search) => {
+    const params = link.substring(link.indexOf("?"));
+    const hashIndex = params.indexOf("#");
+    // REF https://developer.mozilla.org/zh-CN/docs/Web/API/URLSearchParams
+    const urlSearchParams = new URLSearchParams(params.substring(0, hashIndex >= 0 ? hashIndex : undefined));
+    return urlSearchParams.get(key);
+};