-
Notifications
You must be signed in to change notification settings - Fork 1
/
catapult_v1.html
44 lines (38 loc) · 2.33 KB
/
catapult_v1.html
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
32
33
34
35
36
37
38
39
40
41
42
43
44
<!DOCTYPE html>
<html>
<head>
<title>Katapult</title>
<meta charset="utf-8">
<script type="module" src="js/catapult_design.js"></script>
<link rel="stylesheet" href="css/svgbuilder.css">
<link rel="stylesheet" href="css/ui.css">
</head>
<body>
<p style="position:absolute;top=0;right:4px">
<a href="../">Zur Übersicht</a>
</p>
<h2>Katapult konfigurieren</h2>
<div id="portraitMessage">Bitte Telefon auf die Seite drehen.</div>
<p id="controls">
<label><input type="number" id="dicke" min="2" max="4" value="3.8" style="width:3em" title="Materialstärke">mm</label>
<input type="range" id="laenge" min=150 max=300 value="210" title="Katapultlänge" />
<input type="range" id="breite" min=60 max=150 value="95" title="Katapultbreite" />
<input type="range" id="armLaenge" min=50 max=150 value="95" title="Armlänge" />
<input type="range" id="achse" min=-20 max=20 value="4" title="Achsenposition" />
<input type="text" id="name" value="Mein Name" size="15" title="Beschriftung Seitenteile (wenn verschiedene Beschriftungen gewünscht, diese mit Strichpunkt trennen)">
<button id="download" title="SVG-Datei herunterladen">Download</button>
<button id="qrcode" title="QR-Code anzeigen">QR-Code</button>
<button id="scan" title="Mit Kamera QR-Code scannen" style="display:none">Scanner</button>
<button id="reset" title="Alle Werte zurücksetzen">Löschen</button>
</p>
<svg viewbox="0 0 450 350">
<!-- put static objects here -->
</svg>
<div class="footer">
License of design <a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">Creative Commons - Attribution - Non-Commercial</a>. License of source code: MIT License (2023 by Andreas Schuderer).
Design based on this educational <a href="https://www.thingiverse.com/thing:1403796" target="_blank">Tension Catapult by Thingiverse user mfalk</a> (<a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">CC BY-NC 4.0</a>) and its <a href="https://www.thingiverse.com/thing:4050155" target="_blank">no-glue derivative by SimpleAsWar</a> (<a href="https://creativecommons.org/licenses/by/4.0/" target="_blank">CC BY 4.0</a>).
</div>
<div id="overlay"></div>
<video id="video"></video>
</body>
</html>