Neale Pickett
·
2024-11-05
designer.html.m4
1<!DOCTYPE html>
2<html>
3 <head>
4 <title>Tank Designer</title>
5 <link rel="stylesheet" href="style.css" type="text/css">
6 <style type="text/css">
7 #preview {
8 float: right;
9 }
10 #sensors input {
11 width: 5em;
12 }
13 #program textarea {
14 width: 100%;
15 min-height: 20em;
16 }
17 td {
18 text-align: left;
19 }
20 </style>
21 <script type="application/javascript" src="tanks.js"></script>
22 <script type="application/javascript" src="designer.js"></script>
23 <script type="application/javascript">
24 window.onload = design;
25 </script>
26 </head>
27 <body>
28 <h1>Tank Designer</h1>
29 <div id="preview"><canvas id="design"></canvas><p id="debug"></p></div>
30
31 <p>
32 Before you can get going with a tank, you need a password. If you
33 need a password, just ask one of the dirtbags.
34 </p>
35
36 <form action="upload.cgi" method="post">
37 <fieldset id="metadata">
38 <legend>Information</legend>
39 <table>
40 <tr>
41 <td>Password:</td>
42 <td><input name="token" type="password"></td>
43 </tr>
44 <tr>
45 <td>Tank name:</td>
46 <td><input name="name"></td>
47 </tr>
48 <tr>
49 <td>Author:</td>
50 <td><input name="author"> (eg. Joe Cool
51 <joe@cool.cc>)</td>
52 </tr>
53 <tr>
54 <td>Color:</td>
55 <td><input name="color" type="color" value="#c0c0c0"
56 onchange="update();"> (eg. #c7e148)</td>
57 </tr>
58 </table>
59 </fieldset>
60
61 <fieldset id="sensors">
62 <legend>Sensors</legend>
63 <table>
64 <thead>
65 <tr>
66 <td>#</td>
67 <td>Range</td>
68 <td>Angle</td>
69 <td>Width</td>
70 <td>Turret?</td>
71 </tr>
72 </thead>
73 <tbody>
74define(sensor,
75`ifelse(`$1',`10',,`
76 <tr>
77 <td>$1</td>
78 <td><input name="s$1r" type="number" min="0" max="100" onchange="update();"></td>
79 <td><input name="s$1a" type="number" min="-360" max="360" onchange="update();"></td>
80 <td><input name="s$1w" type="number" min="-360" max="360" onchange="update();"></td>
81 <td><input name="s$1t" type="checkbox" onchange="update();"></td>
82 </tr>
83sensor(incr($1))')')
84sensor(0)
85 </tbody>
86 </table>
87 </fieldset>
88
89 <fieldset id="program">
90 <legend>Program</legend>
91 <textarea name="program"></textarea>
92 </fieldset>
93
94 <input type="submit" value="Submit">
95 </form>
96include(nav.html.inc)
97 </body>
98</html>