2023-02-23 14:33:51 +00:00
|
|
|
import {
|
|
|
|
|
clientStore,
|
|
|
|
|
editor,
|
|
|
|
|
space,
|
|
|
|
|
system,
|
|
|
|
|
} from "$sb/silverbullet-syscall/mod.ts";
|
2022-10-14 13:11:33 +00:00
|
|
|
import { asset } from "$sb/plugos-syscall/mod.ts";
|
2022-11-01 14:01:28 +00:00
|
|
|
import { parseMarkdown } from "../../plug-api/silverbullet-syscall/markdown.ts";
|
|
|
|
|
import { renderMarkdownToHtml } from "./markdown_render.ts";
|
2022-04-13 12:46:52 +00:00
|
|
|
|
|
|
|
|
export async function updateMarkdownPreview() {
|
|
|
|
|
if (!(await clientStore.get("enableMarkdownPreview"))) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
2022-10-14 13:11:33 +00:00
|
|
|
const text = await editor.getText();
|
2022-11-01 14:01:28 +00:00
|
|
|
const mdTree = await parseMarkdown(text);
|
|
|
|
|
// const cleanMd = await cleanMarkdown(text);
|
|
|
|
|
const css = await asset.readAsset("assets/styles.css");
|
|
|
|
|
const js = await asset.readAsset("assets/handler.js");
|
2023-02-23 14:33:51 +00:00
|
|
|
const html = await renderMarkdownToHtml(mdTree, {
|
2022-11-01 14:01:28 +00:00
|
|
|
smartHardBreak: true,
|
|
|
|
|
annotationPositions: true,
|
|
|
|
|
renderFrontMatter: true,
|
2023-02-23 14:33:51 +00:00
|
|
|
inlineAttachments: async (url): Promise<string> => {
|
|
|
|
|
if (!url.includes("://")) {
|
|
|
|
|
try {
|
|
|
|
|
return await space.readAttachment(url);
|
|
|
|
|
} catch (e: any) {
|
|
|
|
|
console.error(e);
|
|
|
|
|
return url;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return url;
|
|
|
|
|
},
|
2022-11-01 14:01:28 +00:00
|
|
|
});
|
2022-10-14 13:11:33 +00:00
|
|
|
await editor.showPanel(
|
2022-09-30 15:05:45 +00:00
|
|
|
"rhs",
|
|
|
|
|
2,
|
2022-11-01 14:01:28 +00:00
|
|
|
`<html><head><style>${css}</style></head><body><div id="root">${html}</div></body></html>`,
|
|
|
|
|
js,
|
2022-04-13 12:46:52 +00:00
|
|
|
);
|
|
|
|
|
}
|
2022-11-01 14:01:28 +00:00
|
|
|
|
|
|
|
|
export async function previewClickHandler(e: any) {
|
|
|
|
|
const [eventName, arg] = JSON.parse(e);
|
|
|
|
|
// console.log("Got click", eventName, arg);
|
|
|
|
|
switch (eventName) {
|
|
|
|
|
case "pos":
|
|
|
|
|
// console.log("Moving cursor to", +arg);
|
|
|
|
|
await editor.moveCursor(+arg, true);
|
|
|
|
|
break;
|
|
|
|
|
case "command":
|
|
|
|
|
await system.invokeCommand(arg);
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
}
|
