-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
95 lines (91 loc) · 3.44 KB
/
index.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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!DOCTYPE html>
<html>
<head>
<title>HTML5 BlockOut</title>
<style type="text/css">
body { font-face: 'Courier New'; font-size: 24px; }
label { border: none; color:teal;}
input { border: none; font-size: 24px; }
select { font-size: 24px; }
</style>
<script src="blockout.js" type="text/javascript"></script>
</head>
<body onload="init_Game()">
<main>
<audio id="ding" preload="auto">
<source src="Ding.mp3" type="audio/mpeg">
</audio>
<audio id="dong" preload="auto">
<source src="Dong.mp3" type="audio/mpeg">
</audio>
<audio id="dang" preload="auto">
<source src="Dang.mp3" type="audio/mpeg">
</audio>
<audio id="game" preload="auto">
<source src="Game.mp3" type="audio/mpeg">
</audio>
<form>
<label>BlockSet:</label>
<select id="blockset">
<option value="1">Basic</option>
<option value="2">FlatFun</option>
<option value="3">Extended</option>
</select>
<label>  Level:</label>
<select id="level">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
</select>
<label>  Cubes:</label>
<input type="button" id="cubes" value="0"/>
<label>  Score:</label>
<input type="button" id="score" value="0"/>
</form><br/>
<div id="canvasesdiv" style="position:relative; width:600px; height:600px" onclick="start_Game()">
<canvas id="pit" style="position:absolute;left:0;top:0;z-index:1;" width="600px" height="600px"></canvas>
<canvas id="solidcubes" style="position:absolute;left:0;top:0;z-index:2;" width="600px" height="600px"></canvas>
<canvas id="wirecubes" style="position:absolute;left:0;top:0;z-index:3;" width="600px" height="600px"></canvas>
</div><br/>
<form>
<table>
<tr>
<td width="60" align="center"><input type="button" value="Q" onclick="keyHandler(81)" /></td>
<td width="60" align="center"><input type="button" value="W" onclick="keyHandler(87)" /></td>
<td width="60" align="center"><input type="button" value="E" onclick="keyHandler(69)" /></td>
<td width="200"></td>
<td width="60" align="center"></td>
<td width="60" align="center"><input type="button" value=↑ onclick="keyHandler(38)"/></td>
<td width="60" align="center"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td align="center"><input type="button" value=← onclick="keyHandler(37)"/></td>
<td align="center"><input type="button" value="Drop" onclick="keyHandler(32)"/></td>
<td align="center"><input type="button" value=→ onclick="keyHandler(39)"/></td>
</tr>
<tr>
<td align="center"><input type="button" value="A" onclick="keyHandler(65)" /></td>
<td align="center"><input type="button" value="S" onclick="keyHandler(83)" /></td>
<td align="center"><input type="button" value="D" onclick="keyHandler(68)" /></td>
<td></td>
<td></td>
<td align="center"><input type="button" value=↓ onclick="keyHandler(38)"/></td>
<td></td>
</tr>
</table>
</form><br/><br/>
</main>
<footer>© Copyright 2019 Yongchao Fan</footer>
</body>
</html>