-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathinstructions.html
232 lines (103 loc) · 6.29 KB
/
instructions.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
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="Tetris Javascript | An ode to gaming nostalgia, falling tetriminos and that catchy theme tune.">
<meta name="keywords" content="tetris, javascript, tetriminos, game, gaming, nostalgia">
<link rel="stylesheet" href="style.css">
<title>Tetris JS - About Tetris</title>
</head>
<body class="about-bg">
<!-- navigation elements for User to access instruction, rules and scores-->
<nav class="navbar">
<div class="brand-logo">
<a href="index.html" aria-label="returns the user to the top of the home page">
<h2>Tetris JS</h2>
</a>
</div>
<a href="#" class="toggle-btn">
<span class="line"></span>
<span class="line"></span>
<span class="line"></span>
</a>
<div class="navbar-links">
<ul>
<li> <a href="index.html">Home</a></li>
<li> <a class="active" href="instructions.html">Instructions</a></li>
<li> <a href="tetris.html">Play Tetris</a></li>
</ul>
</div>
</nav>
<div class="title">
<h2>How to Tetris</h2>
<h3>A Brief History</h3>
<br>
<p class="headings">Gameplay</p>
<p>Tetris is composed of a grid of play in which pieces of different geometric forms, called
"tetriminos", fall from the top of the grid.While falling, the player can move the pieces
laterally and rotate them until they touch the bottom of the grid or land on a piece that had been placed
before it. The objective of the game is to use the pieces to create as many horizontal lines of
blocks as possible. When a line is completed, it disappears, and the blocks placed above fall one rank.
Completing lines grants points, and accumulating a certain number of points moves the player up a level,
which increases the number of points granted per completed line.</p>
<br>
<p class="headings">Tetriminos</p>
<p>The pieces on which the game of Tetris is based around are called "tetriminos". Pajitnov's original version
for the Electronika 60 computer used green brackets to represent the blocks that make up tetriminos.
Versions of Tetris on the original Game Boy/Game Boy Color and on most dedicated handheld games use
monochrome or grayscale graphics, but most popular versions use a separate color for each distinct shape.
Prior to The Tetris Company's standardization in the early 2000s, those colors varied widely from
implementation to implementation.</p>
<br>
<p class="headings">Scoring</p>
<p>The scoring formula for the majority of Tetris products is built on the idea that more difficult line clears
should be awarded more points. For example, a single line clear in Tetris Zone is worth 100 points, clearing
four lines at once (known as a Tetris) is worth 800, while each subsequent back-to-back Tetris is worth
1,200. In conjunction, players can be awarded combos that exist in certain games which reward multiple
line clears in quick succession. The exact conditions for triggering combos, and the amount of importance
assigned to them, vary from game to game.
Nearly all Tetris games allow the player to press a button to increase the speed of the current piece's
descent or cause the piece to drop and lock into place immediately, known as a "soft drop" and a "hard
drop", respectively. While performing a soft drop, the player can also stop the piece's increased speed by
releasing the button before the piece settles into place. Some games only allow either soft drop or hard
drop; others have separate buttons for both. Many games award a number of points based on the height that
the piece fell before locking, so using the hard drop generally awards more points.</p>
<div class="links">
<a href="https://en.wikipedia.org/wiki/Tetris" target="_blank" rel="noopener"
aria-label="visit our Tetris wikipedia article (opens a new browser)">If you want to find out more, head
on
over to this great Wikipedia article</a></div>
<br>
<p class="headings">How to Play</p>
<p>You start a new game by pressing the <strong>Start Game</strong> button. Tetriminos will begin to fall from the top of the
grid and begin to pile up at the bottom. You, the player, must rotate the Tetriminos to best fit together
and complete lines across the width of the grid. Each successful clear will result in the line being removed
from the grid and you awarded 15 points. For every 5 lines cleared you will gain a level. The game continues
till the Tetriminos reach the top of the grid, at which point the game is over.
</p>
<br>
<p class="headings">Controls</p>
<p>Left Arrow Key/ Left Button - <strong>Move Left</strong></p>
<p>Right Arrow Key/ Right Button - <strong>Move Right</strong></p>
<p>Up Arrow Key/ Rotate Button - <strong>Rotate 90 degrees</strong></p>
<p>Down Arrow Key/Down -<strong>Move Down</strong></p>
<p>Music can be Played or Paused by clicking the <strong>Music Off</strong> button</p>
<br>
</div>
<div class="title">
<a href="tetris.html" class="btn">Want to play Tetris?</a>
</div>
<footer>
<a class="arrow-top" href="#top" aria-label="return to the top of the page">
<i class="fas fa-arrow-alt-circle-up"></i>
</a>
<p>Copyright ishitaSinghal<span>©</span> 2022 | Privacy Policy | Terms & Conditions</p>
</footer>
<!-- scripts for js and fontawesome -->
<script src="main.js"></script>
<script src="https://kit.fontawesome.com/0fb38816a1.js" crossorigin="anonymous"></script>
</body>
</html>