72b294bb |
1 | <!DOCTYPE html> |
2 | <html> |
3 | <head> |
4 | <meta charset="utf-8"> |
5 | <title>JSChessClock</title> |
6 | <script src="script.js"></script> |
7 | <!--<link rel="stylesheet" type="text/css" href="style.css" />--> |
8 | </head> |
9 | <body onload="init()" onresize="fitscreen()"> |
10 | <h1>JSChessClock</h1> |
11 | |
12 | <div class="clock-container"> |
13 | <svg version="1.1" width="650" height="500" |
14 | xmlns="http://www.w3.org/2000/svg"> |
15 | <path id="left-button-top" class="button-long" fill="#c0c0c0" |
16 | d="M 210 70 A 140 140 0 0 0 30 70 Z" stroke="#c0c0c0" |
17 | onclick="toggle()" cursor="pointer" /> |
18 | <rect id="left-button-body" class="button-long" x="60" y="70" |
19 | width="120" height="80" stroke="#c0c0c0" fill="#c0c0c0" |
20 | onclick="toggle()" cursor="pointer" /> |
21 | <path id="right-button-top" class="button-short" stroke="#c0c0c0" |
22 | d="M 620 120 A 140 140 0 0 0 440 120 Z" fill="#c0c0c0" /> |
23 | <rect id="right-button-body" class="button-short" x="470" y="120" |
24 | width="120" height="30" stroke="#c0c0c0" fill="#c0c0c0" /> |
25 | <rect x="0" y="150" width="650" height="350" rx="25" ry="25" |
26 | fill="#bc5454" /> |
27 | <rect x="40" y="245" width="235" height="90" rx="10" ry="10" |
28 | fill="white" /> |
29 | <rect x="375" y="245" width="235" height="90" rx="10" ry="10" |
30 | fill="white" /> |
31 | <line x1="0" y1="420" x2="650" y2="420" stroke="black" |
32 | stroke-width="1" /> |
33 | </svg> |
34 | <div class="flags"> |
35 | <div id="flag-left">⚐</div> |
36 | <div id="flag-right">⚑</div> |
37 | </div> |
38 | <div class="timers"> |
39 | <div class="timer" id="timer-left">15:00</div> |
40 | <div class="indicators"> |
41 | <div id="pause">❚❚</div> |
42 | <div id="play">◀</div> |
43 | </div> |
44 | <div class="timer" id="timer-right">15:00</div> |
45 | </div> |
46 | <div class="commands"> |
47 | <div class="cmd" onclick="setTime();">[S]et time</div> |
48 | <div class="cmd" onclick="reset();">[R]eset to previous</div> |
49 | <div class="cmd" onclick="pauseResume();">[P]ause / resume</div> |
50 | <div class="cmd" onclick="toggle();">[space] Toggle</div> |
51 | </div> |
52 | </div> |
53 | </body> |
54 | </html> |