element-web/res/decoder-ring/index.html

85 lines
2.7 KiB
HTML
Raw Normal View History

2022-12-09 13:28:29 +01:00
<!DOCTYPE html>
<html lang="en">
2020-04-30 14:51:50 +02:00
<head>
<title>Rageshake decoder ring</title>
<script crossorigin src="https://unpkg.com/source-map@0.7.3/dist/source-map.js"></script>
<script>
sourceMap.SourceMapConsumer.initialize({
2022-12-09 13:28:29 +01:00
"lib/mappings.wasm": "https://unpkg.com/source-map@0.7.3/lib/mappings.wasm",
2020-04-30 14:51:50 +02:00
});
</script>
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<!--<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>-->
2021-08-05 12:10:50 +02:00
<script crossorigin src="https://unpkg.com/rxjs/dist/bundles/rxjs.umd.min.js"></script>
2020-04-30 14:51:50 +02:00
<script src="datatypes.js"></script>
<script src="decoder.js"></script>
<style>
@keyframes spin {
2022-12-09 13:28:29 +01:00
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
2020-04-30 14:51:50 +02:00
}
body {
2022-12-09 13:28:29 +01:00
font-family: sans-serif;
2020-04-30 14:51:50 +02:00
}
.spinner {
animation: spin 4s infinite linear;
display: inline-block;
text-align: center;
vertical-align: middle;
font-size: larger;
}
.progress {
padding-left: 0.5em;
padding-right: 0.5em;
}
.bundle input {
width: 24ex;
}
.valid::after {
2022-12-09 13:28:29 +01:00
content: "✓";
2020-04-30 14:51:50 +02:00
}
label {
width: 3em;
margin-right: 1em;
display: inline-block;
}
input:valid {
border: 1px solid green;
}
.inputs > div {
margin-bottom: 0.5em;
}
</style>
</head>
<body>
<header><h2>Decoder ring</h2></header>
<content id="main">Waiting for javascript to run...</content>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", () => {
try {
2022-12-09 13:28:29 +01:00
ReactDOM.render(React.createElement(Decoder.BundlePicker), document.getElementById("main"));
2020-04-30 14:51:50 +02:00
} catch (e) {
const n = document.createElement("div");
n.innerText = `Error starting: ${e.message}`;
document.getElementById("main").appendChild(n);
}
});
</script>
</body>
</html>