forked from cgolden15/tetris
-
Notifications
You must be signed in to change notification settings - Fork 3
/
controls.html
130 lines (116 loc) · 4.89 KB
/
controls.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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<html>
<head>
<title>TwitchTetris</title>
<link href="http://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css" />
<link href="styles.css" rel="stylesheet" type="text/css" />
<link href="controlsStyles.css" rel="stylesheet" type="text/css" />
<script src="jawsjs.js" type="text/javascript"></script>
<script src="cookie.js" type="text/javascript"></script>
<script src="input.js" type="text/javascript"></script>
<script src="controls.js" type="text/javascript"></script>
</head>
<body onload="onControlsLoad();">
<table border="0" class="mainTable">
<tr>
<td class="menuCell">
<div class="menu">
<img class="menuLogo" src="media/background/logo.png"></img>
<br/><br/>
<a href="index.html" class="bareLink">
<div class="menuItem">Play TwitchTetris</div>
</a>
<br/>
<a href="controls.html" class="bareLink">
<div class="menuItem selectedMenuItem">Controls Options</div>
</a>
<br/>
<a href="/" class="bareLink">
<div class="menuItem" style="background-color:#9933cc; color:#FFFF00;" onMouseOver="this.style.color='#FF0000'"
onMouseOut="this.style.color='#FFFF00'">Zur Rossipotti Startseite</div>
</a>
<br/>
<a href="about.html" class="bareLink">
<div class="menuItem">About TwitchTetris</div>
</a>
<br/>
<a href="http://www.leighpauls.com" class="bareLink" target="_blank">
<div class="menuItem">About the Developer</div>
</a>
<br/>
<div class="instructions">
<b> > TwitchTetris --help </b>
<p>Use the keyboard controls to rotate and move the blocks as they fall</p>
<p>Place the blocks to form horizontal lines, which will be removed and make all the blocks above fall down. If the blocks reach the top of the screen, the game is over!</p>
<p>Clear multiple lines at a time, or clear lines in consective moves to earn more points.</p>
</div>
</div>
</td>
<td class="contentCell">
<canvas id="dummyCanvas" height="0px" width="0px"></canvas>
<div class="controlsArea">
<div class="enableCustomDiv">
Do you want to use a custom control scheme?
<br/>
<br/>
<form>
<input type="radio" name="controlStyle" id="defaultRadio" onchange="setDefaultControls();"/>
<label for="defaultRadio">Default Controls</label><br/>
<input type="radio" name="controlStyle" id="customRadio" onchange="configureCustomControls();"/>
<label for="customRadio">Custom Controls</label><br/>
</form>
<br/>
<div id="instructionsDefault" class="withDisplay">
To change your controls, select "Custom Controls" from above.
</div>
<div id="instructionsCustom" class="noDisplay">
Click on the fields on the right to set your controls.
</div>
<div id="instructionsPending" class="noDisplay">
Press a key to set this field...
</div>
<br/>
</div>
<div class="customControlsDiv">
<div class="controlsUnit" id="rotateLeftDiv" onclick="controlsUnitClicked('rotateLeft');">
Rotate Left: <span id="rotateLeftValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="rotateRightDiv" onclick="controlsUnitClicked('rotateRight');">
Rotate Right: <span id="rotateRightValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="shiftLeftDiv" onclick="controlsUnitClicked('shiftLeft');">
Shift Left: <span id="shiftLeftValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="shiftRightDiv" onclick="controlsUnitClicked('shiftRight');">
Shift Right: <span id="shiftRightValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="softDropDiv" onclick="controlsUnitClicked('softDrop');">
Soft Drop: <span id="softDropValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="hardDropDiv" onclick="controlsUnitClicked('hardDrop');">
Hard Drop: <span id="hardDropValue" class="controlsValue"></span>
</div>
<div class="controlsUnit" id="swapDiv" onclick="controlsUnitClicked('swap');">
Swap Peice: <span id="swapValue" class="controlsValue"></span>
</div>
</div>
<div class="autoRepeatArea">
Auto-Repeat Times:<br/>
<button onclick="resetAutoRepeat();">Reset Auto-Repeat</button>
<div class="autoRepeatForm">
<div class="autoRepeatDiv">
AutoRepeat: <span id="autoRepeatValue"></span> ms <br/>
<input id="autoRepeatRange" type="range" min="15" max="300" value="50" step="5" onchange="updateAutoRepeat();"/>
</div>
<div class="thresholdDiv">
Repeat Charge: <span id="thresholdValue"></span> ms <br/>
<input id="thresholdRange" type="range" min="15" max="500" value="200" step="5" onchange="updateThreshold();"/>
</div>
</div>
</div>
</div>
</td>
<td width="20"> </td>
</tr>
</table>
</body>
</html>