Public
HTTP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import { prettifyHtml } from "https://esm.town/v/neverstew/prettifyHtml";
import { fetchText } from "https://esm.town/v/stevekrouse/fetchText?v=6";
import { escape } from "npm:html-sloppy-escaper";
export default async function viewSource(req: Request) {
const pathname = new URL(req.url).pathname;
const html = await fetchText(pathname === "/" ? "example.com" : pathname).then(prettifyHtml);
const body = `<html>
<head>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/code-mirror-web-component@0.0.15/dist/code-mirror.js"
></script>
<script type="module">
document.getElementById("editor").addEventListener("code-change", (e) => {
console.log(e.detail.code);
});
</script>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body style="margin: 0px; height: 100vh;">
<code-mirror id="editor" theme="dracula" language="html" code="${escape(html)}"></code-mirror>
</body>
</html>
`;
return new Response(body, {
headers: {
"Content-Type": "text/html",
},
});
}
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
v13
March 16, 2024
@pomdtr - found your codemirror web component really useful here!