mirror of
https://github.com/webrecorder/browsertrix-crawler.git
synced 2025-10-19 14:33:17 +00:00
Add Prettier to the repo, and format all the files! (#428)
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.
This commit is contained in:
Emma Segal-Grossman
GitHub
parent
af1e0860e4
commit
2a49406df7
70 changed files with 3192 additions and 2026 deletions
|
|
@ -1,39 +1,45 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
html, body, iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
iframe#main {
|
||||
height: calc(100% - 36px);
|
||||
}
|
||||
div#info {
|
||||
margin: 8px;
|
||||
}
|
||||
form {
|
||||
display: inline;
|
||||
}
|
||||
button {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="info">
|
||||
Log in to any site(s) that you want to be part of the crawl profile using the embedded browser below. When done, click <form action="/createProfile" method="post"><button type="submit">Create Profile</button></form>
|
||||
</div>
|
||||
<iframe id="main" src="$DEVTOOLS_SRC"></iframe>
|
||||
</body>
|
||||
<head>
|
||||
<style>
|
||||
html,
|
||||
body,
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
overflow: hidden;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
iframe#main {
|
||||
height: calc(100% - 36px);
|
||||
}
|
||||
div#info {
|
||||
margin: 8px;
|
||||
}
|
||||
form {
|
||||
display: inline;
|
||||
}
|
||||
button {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="info">
|
||||
Log in to any site(s) that you want to be part of the crawl profile using
|
||||
the embedded browser below. When done, click
|
||||
<form action="/createProfile" method="post">
|
||||
<button type="submit">Create Profile</button>
|
||||
</form>
|
||||
</div>
|
||||
<iframe id="main" src="$DEVTOOLS_SRC"></iframe>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,75 +1,79 @@
|
|||
<!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));
|
||||
<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 = [];
|
||||
const unusedElems = [];
|
||||
|
||||
function handleMessage(resp) {
|
||||
resp = JSON.parse(resp);
|
||||
function handleMessage(resp) {
|
||||
resp = JSON.parse(resp);
|
||||
|
||||
switch (resp.msg) {
|
||||
case "screencast":
|
||||
img = createImage(resp.id);
|
||||
if (resp.data) {
|
||||
setImageData(img, resp.data);
|
||||
switch (resp.msg) {
|
||||
case "screencast":
|
||||
img = createImage(resp.id);
|
||||
if (resp.data) {
|
||||
setImageData(img, resp.data);
|
||||
}
|
||||
break;
|
||||
|
||||
case "close":
|
||||
img = unuseImage(resp.id);
|
||||
break;
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case "close":
|
||||
img = unuseImage(resp.id);
|
||||
break;
|
||||
}
|
||||
}
|
||||
function setImageData(img, data) {
|
||||
//img.style.display = "";
|
||||
img.src = "data:image/png;base64," + data;
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
function createImage(id) {
|
||||
let elem = document.getElementById(id);
|
||||
if (elem) {
|
||||
return elem;
|
||||
}
|
||||
if (unusedElems.length) {
|
||||
elem = unusedElems.shift();
|
||||
elem.setAttribute("id", id);
|
||||
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;
|
||||
}
|
||||
|
||||
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>
|
||||
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>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
|
||||
<head>
|
||||
<!--
|
||||
noVNC example: lightweight example using minimal UI and features
|
||||
|
||||
|
|
@ -16,180 +15,180 @@
|
|||
-->
|
||||
<title>noVNC</title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta charset="utf-8" />
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
background-color: dimgrey;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
background-color: dimgrey;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#top_bar {
|
||||
display: none;
|
||||
background-color: #6e84a3;
|
||||
color: white;
|
||||
font: bold 12px Helvetica;
|
||||
padding: 6px 5px 4px 5px;
|
||||
border-bottom: 1px outset;
|
||||
}
|
||||
#status {
|
||||
text-align: center;
|
||||
}
|
||||
#sendCtrlAltDelButton {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
border: 1px outset;
|
||||
padding: 5px 5px 4px 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#screen {
|
||||
flex: 1; /* fill remaining space */
|
||||
overflow: hidden;
|
||||
}
|
||||
#top_bar {
|
||||
display: none;
|
||||
background-color: #6e84a3;
|
||||
color: white;
|
||||
font: bold 12px Helvetica;
|
||||
padding: 6px 5px 4px 5px;
|
||||
border-bottom: 1px outset;
|
||||
}
|
||||
#status {
|
||||
text-align: center;
|
||||
}
|
||||
#sendCtrlAltDelButton {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
border: 1px outset;
|
||||
padding: 5px 5px 4px 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#screen {
|
||||
flex: 1; /* fill remaining space */
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script type="module" crossorigin="anonymous">
|
||||
// RFB holds the API to connect and communicate with a VNC server
|
||||
import RFB from './core/rfb.js';
|
||||
// RFB holds the API to connect and communicate with a VNC server
|
||||
import RFB from "./core/rfb.js";
|
||||
|
||||
let rfb;
|
||||
let desktopName;
|
||||
let rfb;
|
||||
let desktopName;
|
||||
|
||||
// When this function is called we have
|
||||
// successfully connected to a server
|
||||
function connectedToServer(e) {
|
||||
status("Connected to " + desktopName);
|
||||
// When this function is called we have
|
||||
// successfully connected to a server
|
||||
function connectedToServer(e) {
|
||||
status("Connected to " + desktopName);
|
||||
}
|
||||
|
||||
// This function is called when we are disconnected
|
||||
function disconnectedFromServer(e) {
|
||||
if (e.detail.clean) {
|
||||
status("Disconnected, retrying...");
|
||||
setTimeout(connect, 2000);
|
||||
} else {
|
||||
status("Something went wrong, connection is closed");
|
||||
}
|
||||
}
|
||||
|
||||
// When this function is called, the server requires
|
||||
// credentials to authenticate
|
||||
function credentialsAreRequired(e) {
|
||||
const password = prompt("Password Required:");
|
||||
rfb.sendCredentials({ password: password });
|
||||
}
|
||||
|
||||
// When this function is called we have received
|
||||
// a desktop name from the server
|
||||
function updateDesktopName(e) {
|
||||
desktopName = e.detail.name;
|
||||
}
|
||||
|
||||
// Since most operating systems will catch Ctrl+Alt+Del
|
||||
// before they get a chance to be intercepted by the browser,
|
||||
// we provide a way to emulate this key sequence.
|
||||
function sendCtrlAltDel() {
|
||||
rfb.sendCtrlAltDel();
|
||||
return false;
|
||||
}
|
||||
|
||||
// Show a status text in the top bar
|
||||
function status(text) {
|
||||
document.getElementById("status").textContent = text;
|
||||
}
|
||||
|
||||
// This function extracts the value of one variable from the
|
||||
// query string. If the variable isn't defined in the URL
|
||||
// it returns the default value instead.
|
||||
function readQueryVariable(name, defaultValue) {
|
||||
// A URL with a query parameter can look like this (But will most probably get logged on the http server):
|
||||
// https://www.example.com?myqueryparam=myvalue
|
||||
//
|
||||
// For privacy (Using a hastag #, the parameters will not be sent to the server)
|
||||
// the url can be requested in the following way:
|
||||
// https://www.example.com#myqueryparam=myvalue&password=secreatvalue
|
||||
//
|
||||
// Even Mixing public and non public parameters will work:
|
||||
// https://www.example.com?nonsecretparam=example.com#password=secreatvalue
|
||||
//
|
||||
// Note that we use location.href instead of location.search
|
||||
// because Firefox < 53 has a bug w.r.t location.search
|
||||
const re = new RegExp(".*[?&]" + name + "=([^&#]*)"),
|
||||
match = ""
|
||||
.concat(document.location.href, window.location.hash)
|
||||
.match(re);
|
||||
|
||||
if (match) {
|
||||
// We have to decode the URL since want the cleartext value
|
||||
return decodeURIComponent(match[1]);
|
||||
}
|
||||
|
||||
// This function is called when we are disconnected
|
||||
function disconnectedFromServer(e) {
|
||||
if (e.detail.clean) {
|
||||
status("Disconnected, retrying...");
|
||||
setTimeout(connect, 2000);
|
||||
} else {
|
||||
status("Something went wrong, connection is closed");
|
||||
}
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
document.getElementById("sendCtrlAltDelButton").onclick = sendCtrlAltDel;
|
||||
|
||||
// Read parameters specified in the URL query string
|
||||
// By default, use the host and port of server that served this file
|
||||
const host = readQueryVariable("host", window.location.hostname);
|
||||
let port = readQueryVariable("port", window.location.port);
|
||||
const password = readQueryVariable("password");
|
||||
const path = readQueryVariable("path", "websockify");
|
||||
|
||||
// | | | | | |
|
||||
// | | | Connect | | |
|
||||
// v v v v v v
|
||||
function connect() {
|
||||
status("Connecting");
|
||||
|
||||
// Build the websocket URL used to connect
|
||||
let url;
|
||||
if (window.location.protocol === "https:") {
|
||||
url = "wss";
|
||||
} else {
|
||||
url = "ws";
|
||||
}
|
||||
|
||||
// When this function is called, the server requires
|
||||
// credentials to authenticate
|
||||
function credentialsAreRequired(e) {
|
||||
const password = prompt("Password Required:");
|
||||
rfb.sendCredentials({ password: password });
|
||||
url += "://" + host;
|
||||
if (port) {
|
||||
url += ":" + port;
|
||||
}
|
||||
url += "/" + path;
|
||||
|
||||
// When this function is called we have received
|
||||
// a desktop name from the server
|
||||
function updateDesktopName(e) {
|
||||
desktopName = e.detail.name;
|
||||
}
|
||||
// Creating a new RFB object will start a new connection
|
||||
rfb = new RFB(document.getElementById("screen"), url, {
|
||||
credentials: { password: password },
|
||||
});
|
||||
|
||||
// Since most operating systems will catch Ctrl+Alt+Del
|
||||
// before they get a chance to be intercepted by the browser,
|
||||
// we provide a way to emulate this key sequence.
|
||||
function sendCtrlAltDel() {
|
||||
rfb.sendCtrlAltDel();
|
||||
return false;
|
||||
}
|
||||
// Add listeners to important events from the RFB module
|
||||
rfb.addEventListener("connect", connectedToServer);
|
||||
rfb.addEventListener("disconnect", disconnectedFromServer);
|
||||
rfb.addEventListener("credentialsrequired", credentialsAreRequired);
|
||||
rfb.addEventListener("desktopname", updateDesktopName);
|
||||
|
||||
// Show a status text in the top bar
|
||||
function status(text) {
|
||||
document.getElementById('status').textContent = text;
|
||||
}
|
||||
// Set parameters that can be changed on an active connection
|
||||
rfb.viewOnly = readQueryVariable("view_only", false);
|
||||
rfb.scaleViewport = readQueryVariable("scale", false);
|
||||
}
|
||||
|
||||
// This function extracts the value of one variable from the
|
||||
// query string. If the variable isn't defined in the URL
|
||||
// it returns the default value instead.
|
||||
function readQueryVariable(name, defaultValue) {
|
||||
// A URL with a query parameter can look like this (But will most probably get logged on the http server):
|
||||
// https://www.example.com?myqueryparam=myvalue
|
||||
//
|
||||
// For privacy (Using a hastag #, the parameters will not be sent to the server)
|
||||
// the url can be requested in the following way:
|
||||
// https://www.example.com#myqueryparam=myvalue&password=secreatvalue
|
||||
//
|
||||
// Even Mixing public and non public parameters will work:
|
||||
// https://www.example.com?nonsecretparam=example.com#password=secreatvalue
|
||||
//
|
||||
// Note that we use location.href instead of location.search
|
||||
// because Firefox < 53 has a bug w.r.t location.search
|
||||
const re = new RegExp('.*[?&]' + name + '=([^&#]*)'),
|
||||
match = ''.concat(document.location.href, window.location.hash).match(re);
|
||||
|
||||
if (match) {
|
||||
// We have to decode the URL since want the cleartext value
|
||||
return decodeURIComponent(match[1]);
|
||||
}
|
||||
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
document.getElementById('sendCtrlAltDelButton')
|
||||
.onclick = sendCtrlAltDel;
|
||||
|
||||
// Read parameters specified in the URL query string
|
||||
// By default, use the host and port of server that served this file
|
||||
const host = readQueryVariable('host', window.location.hostname);
|
||||
let port = readQueryVariable('port', window.location.port);
|
||||
const password = readQueryVariable('password');
|
||||
const path = readQueryVariable('path', 'websockify');
|
||||
|
||||
// | | | | | |
|
||||
// | | | Connect | | |
|
||||
// v v v v v v
|
||||
function connect() {
|
||||
status("Connecting");
|
||||
|
||||
// Build the websocket URL used to connect
|
||||
let url;
|
||||
if (window.location.protocol === "https:") {
|
||||
url = 'wss';
|
||||
} else {
|
||||
url = 'ws';
|
||||
}
|
||||
url += '://' + host;
|
||||
if(port) {
|
||||
url += ':' + port;
|
||||
}
|
||||
url += '/' + path;
|
||||
|
||||
// Creating a new RFB object will start a new connection
|
||||
rfb = new RFB(document.getElementById('screen'), url,
|
||||
{ credentials: { password: password } });
|
||||
|
||||
// Add listeners to important events from the RFB module
|
||||
rfb.addEventListener("connect", connectedToServer);
|
||||
rfb.addEventListener("disconnect", disconnectedFromServer);
|
||||
rfb.addEventListener("credentialsrequired", credentialsAreRequired);
|
||||
rfb.addEventListener("desktopname", updateDesktopName);
|
||||
|
||||
// Set parameters that can be changed on an active connection
|
||||
rfb.viewOnly = readQueryVariable('view_only', false);
|
||||
rfb.scaleViewport = readQueryVariable('scale', false);
|
||||
}
|
||||
|
||||
connect();
|
||||
connect();
|
||||
</script>
|
||||
</head>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body>
|
||||
<div id="top_bar">
|
||||
<div id="status">Loading</div>
|
||||
<div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
|
||||
<div id="status">Loading</div>
|
||||
<div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
|
||||
</div>
|
||||
<div id="screen">
|
||||
<!-- This is where the remote screen will appear -->
|
||||
<!-- This is where the remote screen will appear -->
|
||||
</div>
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue