Merge pull request #43 from obsidian-confluence/load_mermaid_renderer…

…_from_bundle
markdown-confluence · Apr 6, 2023 · 9e57cbc · 9e57cbc
2 parents 0372b01 + db7787a
commit 9e57cbc
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 56 deletions.
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
diff --git a/esbuild.config.mjs b/esbuild.config.mjs
@@ -9,13 +9,60 @@ if you want to view the source, please visit the github repository of this plugi
 */
 `;
 
+
+const mermaid_renderer_plugin = {
+	name: 'mermaid_renderer_plugin',
+	setup(build) {
+		build.onResolve({ filter: /mermaid_renderer\.esbuild$/ }, args => {
+			return {
+				path: args.path,
+				namespace: 'mermaid-binary',
+			  }
+		});
+		build.onLoad({ filter: /mermaid_renderer\.esbuild$/, namespace: 'mermaid-binary' }, async (args) => {
+			const result = await esbuild.build({
+				entryPoints: ['src/mermaid_renderer.js'],
+				bundle: true,
+				format: 'cjs',
+				target: 'chrome106',
+				logLevel: 'info',
+				sourcemap: false,
+				treeShaking: true,
+				write: false,
+				mainFields: ['module', 'main']
+			}).catch(() => process.exit(1));
+
+			const fileContents = `
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Mermaid Chart</title>
+  </head>
+  <body>
+  	<div id="graphDiv"></div>
+    <script type="text/javascript">
+	${result.outputFiles[0].text}
+	</script>
+  </body>
+</html>
+			`;
+
+			return {
+				contents: fileContents,
+				loader: 'binary',
+			}
+		})
+	}
+};
+
 const prod = (process.argv[2] === 'production');
 
 esbuild.build({
 	banner: {
 		js: banner,
 	},
-	entryPoints: ['src/main.ts', 'src/mermaid_renderer.js'],
+	entryPoints: ['src/main.ts'],
 	bundle: true,
 	external: [
 		'obsidian',
@@ -41,4 +88,5 @@ esbuild.build({
 	treeShaking: true,
 	outdir: prod ? 'dist' : 'dev-vault/.obsidian/plugins/obsidian-confluence',
 	mainFields: ['module', 'main'],
+	plugins: [mermaid_renderer_plugin],
 }).catch(() => process.exit(1));
diff --git a/src/custom.d.ts b/src/custom.d.ts
@@ -10,3 +10,8 @@ declare module "*.json" {
 	const content: any;
 	export default content;
 }
+
+declare module "mermaid_renderer.esbuild" {
+	const content: Buffer;
+	export default content;
+}
diff --git a/src/mermaid_renderers/electron.ts b/src/mermaid_renderers/electron.ts
@@ -1,6 +1,11 @@
 import * as path from "path";
 import { BrowserWindow } from "@electron/remote";
 import { ChartData, MermaidRenderer } from "./types";
+import MermaidRendererClient from "mermaid_renderer.esbuild";
+
+const mermaid_render_html = URL.createObjectURL(
+	new Blob([MermaidRendererClient], { type: "text/html" })
+);
 
 export class ElectronMermaidRenderer implements MermaidRenderer {
 	async captureMermaidCharts(
@@ -18,13 +23,8 @@ export class ElectronMermaidRenderer implements MermaidRenderer {
 					frame: false,
 				});
 
-				// Load the HTML file with the Mermaid.js chart
-				await chartWindow.loadFile(
-					path.join(
-						"/Users/andrewmcclenaghan/dev/obsidian-confluence/obsidian-confluence/dev-vault/.obsidian/plugins/obsidian-confluence",
-						"mermaid_renderer.html"
-					)
-				);
+				console.log({ mermaid_render_html });
+				await chartWindow.loadURL(mermaid_render_html);
 
 				const mermaidConfig = {
 					theme: "base",