mirror of
https://github.com/webrecorder/browsertrix-crawler.git
synced 2025-10-19 14:33:17 +00:00
2a49406df7
This adds prettier to the repo, and sets up the pre-commit hook to auto-format as well as lint. Also updates ignores files to exclude crawls, test-crawls, scratch, dist as needed.
79 lines
1.7 KiB
HTML
79 lines
1.7 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
#content {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
}
|
|
#content img {
|
|
width: 640px;
|
|
height: 480px;
|
|
margin: 2rem;
|
|
}
|
|
</style>
|
|
<script>
|
|
const ws = new WebSocket(
|
|
window.location.href.replace("http", "ws") + "ws",
|
|
);
|
|
ws.addEventListener("message", (event) => handleMessage(event.data));
|
|
|
|
const unusedElems = [];
|
|
|
|
function handleMessage(resp) {
|
|
resp = JSON.parse(resp);
|
|
|
|
switch (resp.msg) {
|
|
case "screencast":
|
|
img = createImage(resp.id);
|
|
if (resp.data) {
|
|
setImageData(img, resp.data);
|
|
}
|
|
break;
|
|
|
|
case "close":
|
|
img = unuseImage(resp.id);
|
|
break;
|
|
}
|
|
}
|
|
|
|
function setImageData(img, data) {
|
|
//img.style.display = "";
|
|
img.src = "data:image/png;base64," + data;
|
|
}
|
|
|
|
function createImage(id) {
|
|
let elem = document.getElementById(id);
|
|
if (elem) {
|
|
return elem;
|
|
}
|
|
|
|
if (unusedElems.length) {
|
|
elem = unusedElems.shift();
|
|
elem.setAttribute("id", id);
|
|
return elem;
|
|
}
|
|
|
|
elem = document.createElement("img");
|
|
elem.setAttribute("id", id);
|
|
document.getElementById("content").appendChild(elem);
|
|
return elem;
|
|
}
|
|
|
|
function unuseImage(id) {
|
|
const elem = document.getElementById(id);
|
|
if (!elem) {
|
|
return;
|
|
}
|
|
//elem.style.display = "none";
|
|
unusedElems.push(elem);
|
|
}
|
|
</script>
|
|
<head>
|
|
<body>
|
|
<div id="content"></div>
|
|
</body>
|
|
</head>
|
|
</head>
|
|
</html>
|