<!DOCTYPE html>
<html lang="en">
<head>
<title>typwriter watcher: {input}</title>
<script>
document.addEventListener('DOMContentLoaded', function () {
document.getElementById('target').focus();
});
let path = new URL(location);
path.protocol = 'ws:';
path.pathname = '/listen';
function onMessage(event) {
if (event.data !== "refresh") {
console.error(`[typwriter] - Received unknown message from websocket: ${event.data}`)
return;
}
console.log("[typwriter] - Got refresh message, updating pdf");
const pdf = document.getElementById("target")
let url = new URL(pdf.src);
url.search = '?t=' + Date.now();
pdf.src = url.toString();
}
function onOpen(event) {
console.log("[typwriter] - Connected to the listen endpoint");
}
function onClose(event) {
console.log("[typwriter] - Connection closed");
}
const ws = new WebSocket(path)
ws.addEventListener("open", onOpen)
ws.addEventListener("close", onClose)
ws.addEventListener("message", onMessage)
</script>
<style>
body {
display: flex;
width: 100vw;
height: 100vh;
margin: 0;
}
iframe {
border: none;
}
</style>
</head>
<body>
<iframe id="target" src="/target.pdf#view={fitting_type}" width="100%" height="100%"></iframe>
</body>
</html>