Mercurial > hg > nodescore

comparison www/m/controls.html @ 16:e05eede75e0d

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
some cleaning up of html css js
author tzara <rc-web@kiben.net>
date Sun, 08 Jul 2012 23:57:13 +0100
parents 0a8133490050
children a56434dee146
comparison
equal deleted inserted replaced
15:6e6dd1ed032b 16:e05eede75e0d
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <link href="css/nodescore.css" rel="stylesheet"> 4 <link href="css/nodescore.css" rel="stylesheet">
5 <link href="css/metronome.css" rel="stylesheet">
6 <script src="js/jquery-1.7.1.min.js"></script> 5 <script src="js/jquery-1.7.1.min.js"></script>
7 <script src="/socket.io/socket.io.js"></script> 6 <script src="/socket.io/socket.io.js"></script>
8 <script src="js/client.js"></script> 7 <script src="js/nodescore-client.js"></script>
9 <script src="js/controlseq.js"></script> 8 <script src="js/controlseq.js"></script>
10 </head> 9 </head>
11 <body>
12 10
13 <input type="hidden" id="group" value='1'> 11 <body onload="getLatencies(500);">
12 <input type="hidden" id="group" value='1'>
13 <div class="page">
14 <div class="outermaster">
15 <div id="client_chronometer">00:00:00.0</div>
16 <div class="metrocase">
17 <div id="metronome0"></div>
18 <div id="metronome1"></div>
19 <div id="metronome2"></div>
20 <div id="metronome3"></div>
21 </div>
22
23
24 <div class="outersquare">
25 <div>
26 <p class="magicsquare" id="1magicsquare0"></p>
27 <p class="magicsquare" id="1magicsquare1"></p>
28 <p class="magicsquare" id="1magicsquare2"></p>
29 <p class="magicsquare" id="1magicsquare3"></p>
30 <p class="magicsquare" id="1magicsquare4"></p>
31 <p class="magicsquare" id="1magicsquare5"></p>
32 </div>
33 <br><br><br><br>
34 <div>
35 <p class="magicsquare" id="2magicsquare0"></p>
36 <p class="magicsquare" id="2magicsquare1"></p>
37 <p class="magicsquare" id="2magicsquare2"></p>
38 <p class="magicsquare" id="2magicsquare3"></p>
39 <p class="magicsquare" id="2magicsquare4"></p>
40 <p class="magicsquare" id="2magicsquare5"></p>
41 </div>
42 <br><br><br><br>
43 <div>
44 <p class="magicsquare" id="3magicsquare0"></p>
45 <p class="magicsquare" id="3magicsquare1"></p>
46 <p class="magicsquare" id="3magicsquare2"></p>
47 <p class="magicsquare" id="3magicsquare3"></p>
48 <p class="magicsquare" id="3magicsquare4"></p>
49 <p class="magicsquare" id="3magicsquare5"></p>
50 </div>
51 <br><br><br><br>
52 <div>
53 <p class="magicsquare" id="4magicsquare0"></p>
54 <p class="magicsquare" id="4magicsquare1"></p>
55 <p class="magicsquare" id="4magicsquare2"></p>
56 <p class="magicsquare" id="4magicsquare3"></p>
57 <p class="magicsquare" id="4magicsquare4"></p>
58 <p class="magicsquare" id="4magicsquare5"></p>
59 </div>
60 <br><br><br><br> <br><br><br><br>
61
62 <input type="button" value="START" onclick="startSeq();" />
63 <input type="button" value="STOP" onclick="stopSeq();" />
64 <input type="button" value="RESET" onclick="resetSeq();" />
65
66 <br><br>
67 </div>
14 68
15 <div class="page"> 69 <div class="latencies">
16 <div class="outermaster"> 70 <h2>Latency:</h2>
17 <div id="client_chronometer">00:00:00.0</div> 71 <h1 id="client_latency">0ms</h2>
18 <div class="metrocase"> 72 </div>
19 <div id="metronome0"></div> 73
20 <div id="metronome1"></div> 74 </div>
21 <div id="metronome2"></div>
22 <div id="metronome3"></div>
23 </div>
24 75
25 76
26 <div class="outersquare">
27
28 <div>
29 <p class="magicsquare" id="1magicsquare0"></p>
30 <p class="magicsquare" id="1magicsquare1"></p>
31 <p class="magicsquare" id="1magicsquare2"></p>
32 <p class="magicsquare" id="1magicsquare3"></p>
33 <p class="magicsquare" id="1magicsquare4"></p>
34 <p class="magicsquare" id="1magicsquare5"></p>
35 </div>
36
37 <br><br> <br><br>
38
39 <div>
40 <p class="magicsquare" id="2magicsquare0"></p>
41 <p class="magicsquare" id="2magicsquare1"></p>
42 <p class="magicsquare" id="2magicsquare2"></p>
43 <p class="magicsquare" id="2magicsquare3"></p>
44 <p class="magicsquare" id="2magicsquare4"></p>
45 <p class="magicsquare" id="2magicsquare5"></p>
46 </div>
47
48 <br><br> <br><br>
49 <div>
50 <p class="magicsquare" id="3magicsquare0"></p>
51 <p class="magicsquare" id="3magicsquare1"></p>
52 <p class="magicsquare" id="3magicsquare2"></p>
53 <p class="magicsquare" id="3magicsquare3"></p>
54 <p class="magicsquare" id="3magicsquare4"></p>
55 <p class="magicsquare" id="3magicsquare5"></p>
56 </div>
57
58 <br><br> <br><br>
59
60 <div>
61 <p class="magicsquare" id="4magicsquare0"></p>
62 <p class="magicsquare" id="4magicsquare1"></p>
63 <p class="magicsquare" id="4magicsquare2"></p>
64 <p class="magicsquare" id="4magicsquare3"></p>
65 <p class="magicsquare" id="4magicsquare4"></p>
66 <p class="magicsquare" id="4magicsquare5"></p>
67 </div>
68 77
69 <br><br> <br><br> 78 </div>
70
71
72 <input type="button" value="START" onclick="startSeq();" />
73 <input type="button" value="STOP" onclick="stopSeq();" />
74 <input type="button" value="RESET" onclick="resetSeq();" />
75
76 <br><br>
77 </div>
78
79 <div class="latencies">
80 <h2>Calculate Client Latencies</h2><br>
81 <input type="button" value="Get Latencies" onclick="getLatencies(1000);" />
82 <h2 id="client_latency">0ms</h2>
83 </div>
84 </div>
85
86 </div>
87 79
88 80
89 81
90 82
91 83