From e0a750e896a857646989a8661a5e4034b8ce9d60 Mon Sep 17 00:00:00 2001
From: Daniel Flanagan <daniel@lyte.dev>
Date: Fri, 7 Jun 2024 14:01:52 -0500
Subject: [PATCH] Remove output, move client script inline to avoid path issues

---
 client.js | 66 ----------------------------------------------
 mod.ts    | 79 ++++++++++++++++++++++++++++++++++++++++++++++++-------
 2 files changed, 70 insertions(+), 75 deletions(-)
 delete mode 100644 client.js

diff --git a/client.js b/client.js
deleted file mode 100644
index 2e9481b..0000000
--- a/client.js
+++ /dev/null
@@ -1,66 +0,0 @@
-import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs'
-
-let lastDiagram = ''
-let rendering = false
-let theme = 'dark'
-
-function setTheme(lightMatches) {
-	theme = lightMatches ? 'default' : 'dark'
-	mermaid.initialize({ startOnLoad: true, theme })
-	renderLastDiagram()
-}
-if (window.matchMedia) {
-	let lightMatcher = window.matchMedia('(prefers-color-scheme: light)')
-	lightMatcher.addEventListener('change', ({ matches }) => setTheme(matches))
-	setTheme(lightMatcher.matches)
-}
-
-let connectionAttempt = 0
-function connectSocket() {
-	const socket = new WebSocket('ws://localhost:8080')
-	socket.addEventListener('open', () => {
-		socket.send(JSON.stringify({ type: 'open', connectionAttempt }))
-	})
-	socket.addEventListener('close', () => {
-		connectionAttempt += 1
-		setTimeout(() => requestAnimationFrame(connectSocket), 1000)
-	})
-	socket.addEventListener('message', handleMessage)
-}
-
-async function handleMessage({ data }) {
-	if (data == 'hi') {
-		console.log('👋')
-	} else if (data == 'reload') {
-		window.location.reload()
-	} else {
-		try {
-			await handleStructuredMessage(JSON.parse(data))
-		} catch (err) {
-			console.error(`failed to process structured websocket message: ${err}`)
-		}
-	}
-}
-
-async function handleStructuredMessage(data) {
-	switch (data.type) {
-		case 'mermaid': {
-			if (rendering) return
-			rendering = true
-
-			lastDiagram = data.contents
-			await renderLastDiagram()
-
-			rendering = false
-			break
-		}
-	}
-}
-
-async function renderLastDiagram() {
-	if (lastDiagram == '') return
-	document.getElementById('diagram').innerHTML =
-		(await mermaid.render('mermaid', lastDiagram)).svg
-}
-
-addEventListener('DOMContentLoaded', connectSocket)
diff --git a/mod.ts b/mod.ts
index d02f762..a0a878e 100755
--- a/mod.ts
+++ b/mod.ts
@@ -7,7 +7,6 @@ const sockets: Set<WebSocket> = new Set([])
 
 const Args = z.object({
 	input: z.string().default('./src'),
-	output: z.string().default('./build'),
 	open: z.boolean().default(false),
 	server: z.boolean().default(true),
 	host: z.string().default('localhost'),
@@ -31,13 +30,6 @@ const command = new Command()
 			default: './src',
 		},
 	)
-	.option(
-		'-o, --output <output_directory:path>',
-		'The directory to put compiled .svg files into.',
-		{
-			default: './build',
-		},
-	)
 	.option('--open', 'Include this flag to open your browser automatically.', {
 		default: false,
 	})
@@ -73,7 +65,7 @@ async function runServer(args: Args): Promise<void> {
 
 		const url = new URL(req.url)
 		if (url.pathname == '/client.js') {
-			return new Response(await Deno.readTextFile('./client.js'), {
+			return new Response(clientJs, {
 				headers: new Headers({
 					'content-type': 'text/javascript;charset=UTF-8',
 				}),
@@ -214,6 +206,75 @@ const page = (title: string | null, content: string) =>
 </body>
 </html>`
 
+const clientJs = `
+import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs'
+
+let lastDiagram = ''
+let rendering = false
+let theme = 'dark'
+
+function setTheme(lightMatches) {
+	theme = lightMatches ? 'default' : 'dark'
+	mermaid.initialize({ startOnLoad: true, theme })
+	renderLastDiagram()
+}
+if (window.matchMedia) {
+	let lightMatcher = window.matchMedia('(prefers-color-scheme: light)')
+	lightMatcher.addEventListener('change', ({ matches }) => setTheme(matches))
+	setTheme(lightMatcher.matches)
+}
+
+let connectionAttempt = 0
+function connectSocket() {
+	const socket = new WebSocket('ws://localhost:8080')
+	socket.addEventListener('open', () => {
+		socket.send(JSON.stringify({ type: 'open', connectionAttempt }))
+	})
+	socket.addEventListener('close', () => {
+		connectionAttempt += 1
+		setTimeout(() => requestAnimationFrame(connectSocket), 1000)
+	})
+	socket.addEventListener('message', handleMessage)
+}
+
+async function handleMessage({ data }) {
+	if (data == 'hi') {
+		console.log('👋')
+	} else if (data == 'reload') {
+		window.location.reload()
+	} else {
+		try {
+			await handleStructuredMessage(JSON.parse(data))
+		} catch (err) {
+			console.error(\`failed to process structured websocket message: \${err}\`)
+		}
+	}
+}
+
+async function handleStructuredMessage(data) {
+	switch (data.type) {
+		case 'mermaid': {
+			if (rendering) return
+			rendering = true
+
+			lastDiagram = data.contents
+			await renderLastDiagram()
+
+			rendering = false
+			break
+		}
+	}
+}
+
+async function renderLastDiagram() {
+	if (lastDiagram == '') return
+	document.getElementById('diagram').innerHTML =
+		(await mermaid.render('mermaid', lastDiagram)).svg
+}
+
+addEventListener('DOMContentLoaded', connectSocket)
+`
+
 async function run(args: Args) {
 	await Promise.all([
 		runMermaidFileWatcher(args),