-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathpage3.html
286 lines (267 loc) · 16.7 KB
/
page3.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
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
<!DOCTYPE html>
<!--
Name: Oleksandr Shyryayev
Date: October 24th, 2022
Description: Project
-->
<html lang="en">
<head>
<title>History of Hockey</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="./css/styles.css" />
<script type="text/javascript" src="./js/actions.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript" src="./js/jquery-3.6.1.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<style>
body {
background-image: url("./img/fight.jpg");
}
.box2 {
margin-top: 10px;
}
.box1 {
margin-top: -35px;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img class="logo" src="./img/logo.png" alt="logo">
</div>
<div style="font-size: 50px">
<span><strong>History of Hockey</strong></span>
</div>
</header>
<div class="flexbox">
<div class="search">
<div>
<input name="search" id="search" type="search" placeholder="Search . . ." required autocomplete="off">
</div>
</div>
</div>
<div>
<div class="box1">
<span class="menu"><strong>Menu</strong></span>
<table>
<tr>
<td onclick="backHome()"><span class="spanPadding">Home</span></td>
</tr>
<tr>
<td onclick="page3()"><span class="spanPadding">History of Hockey</span></td>
</tr>
<tr>
<td onclick="page4()"><span class="spanPadding">Leagues</span></td>
</tr>
<tr>
<td onclick="page4_5()"><span class="spanPadding">Play of the Game</span></td>
</tr>
<tr>
<td onclick="stadiumMap()"><span class="spanPadding">Map of NHL Stadiums</span></td>
</tr>
<tr>
<td onclick="references()"><span class="spanPadding">References</span></td>
</tr>
<tr>
<td onclick="contactUs()"><span class="spanPadding">Contact me</span></td>
</tr>
<tr>
<td onclick="searchContent()()"><span class="spanPadding">Content Search</span></td>
</tr>
<tr>
<td class="greyHover"><button style="width: 100%; height: 35px" onclick="logOut()">Log Out</button>
</td>
</tr>
</table>
</div>
<div class="box2">
<br />
<h1 id="box">Who Invented Hockey?</h1>
<br>
<h4 style="text-align: justify">
<p id="box1">Today we are familiar with several of hockey forms, including field hockey,
ice hockey, roller hockey and indoor hockey.
The most popular one is ice hockey, especially in Canada.
Regardless of the forms, hockey is a team sport in which two teams play against
each other by controlling a ball or a puck trying to get it into the opponent’s goal.
All players use hockey sticks during a game.</p>
<p id="box2">It is impossible to claim the exact time of the birth of hockey. We will probably
never know for sure, but there are records of people participating in this kind of
game about 4000 years ago. Since ball-stick games are as old as our civilization,
the earliest origins may be from China, Persia or Egypt. Archeologists discovered
that an early form of the ball-and-stick game was played in Greece the 5th century BC.
At the time when Europeans sailed across the Atlantic and started settling North
America, they discovered that Native Indian people had their games which were precursors
of lacrosse. Furthermore, some museums today showcase evidence that hockey was played by
Aztecs centuries before Columbus even discovered the New World.</p>
<p><img src="./img/hockey-history-17th-century.jpg" alt="hockey-history-17th-century"></p>
<p id="box3">The name “hockey” is thought to be derived from the French hoquet meaning “shepherd’s
stave”,
however, there are a couple of suppositions of which none have been evidenced. The second
supposition derives from the use of cork bangs, called stoppers, in place of wooden balls
to play the game. These objects came from barrels containing hock ale, also known as hocky.
Still, though, the origin of “hockey” remains unclear.</p>
<p id="box4">J. G. Creighton was the Canadian from Halifax, Nova Scotia who created the
first set of rules of ice hockey about 140 years ago.
Upon arriving in Montreal, he presented hockey sticks
and skates which were patented by Nova Scotia company in 1866. The skates featured
rounded blades held onto boots by metal clamps, which had not been seen ever before.
The very first game of ice hockey played in Canada was in 1875 at Victoria Skating
Rink, in which the new rules were implemented. Just a couple of years later,
Mr. Creighton’s rules were revised at McGill University in Montreal. Eventually,
it was decided that the game would be held indoors for the first time, due to
the belief that ice hockey had to be played on ponds only. Otherwise, people could
get badly hurt. Creighton handled the issue by creating a flat and circular piece of
wood, that is the first hockey puck. It provided players with better control over a
ball, and it decreased the chance of injuring spectators during a game.
</p>
<p id="box5">Ice hockey is Canada’s national winter sport. The country undoubtedly contributed
to this sport more than any other so we could say this their tendency to regard
ice hockey as their national sport is entirely justified. The national hockey
league of North America, called NHL is the highest level for men’s hockey and
thus the most popular. In Russia and the most of Europe, the highest league is
called Kontinental Hockey League. The formal governing body of International
ice hockey is the International Ice Hockey Federation.</p>
<p id="box6">The modern game was formed in the middle of 19th century by British soldiers
stationed in Canada. During the next 30 years, many leagues and amateur clubs
were organized in Canada. By the beginning of the 20th century, ice hockey
spread to England and the rest of European countries. Today, the sport is
highly popular in Eastern Europe and North America.</p>
<p id="box7">Soft hockey has been played in the ancient period by different nations and
under different names. It is known that over the last five hundred years
the sport has been widely played in India and in rural areas of
undeveloped parts of the world where the lack of proper infrastructure
eliminates the probability for playing field hockey. In the past,
villagers were mixing the bamboo and homemade rubber to make softballs.
One of the reasons the sport enjoyed such a popularity was that it
didn’t require many players and the equipment for the game was very
simple. One of the more advantageous sides of softball was smaller
chances of sustaining injuries, compared to other similar games.
The game was played by pushing the ball instead of hitting it, to
avoid sending the ball out of the field and into bushes and ponds,
which would lead to a longer recovering from the ball. Over the
last couple of centuries, the sport has been modified and developed
into other separate sports like croquet, lacrosse, shinty, field
hockey, etc. According to sources, the countries which mostly
contributed to the development of hockey were Great Britain and
France, where field hockey remains to be a popular summer sport.
During cold, harsh winters in Europe, it was not uncommon to
see young athletes play the version of this sport on ice. In
the 17th century, the game started becoming popular in Holland
and then later on it started to take hold in England as well.</p>
<p id="box8">The first Olympic Hockey Competition for men took place in London
in 1908 where all of the United Kingdom countries were competing
separately. Another two countries which participated as well were
Germany and France. However, after London Olympics, the game was
dropped from 1912 games held in Stockholm due to the preferences
of other ‘optional sports’ by the host country. Several years
later, in 1920, the ice hockey reappeared in Antwerp but was again
neglected in Paris in 1924, despite the formation of the
International Hockey Federation that same year. Ultimately,
hockey was granted re-entry in Amsterdam in 1928 and has been
on the program ever since. As for the women’s hockey, the first
time it was included in the Olympic program was in Moscow in 1980.</p>
<p><img src="./img/hockey-match-1901.jpg" alt="hockey-match-1901"></p>
<p id="box9">Since the Olympics held in Sydney (2000), men athletes have competed
in 12-team tournaments and women in a 10-team one.</p>
<p id="box10">Another hockey sport, which was played for the first time in the city of
Kent, England at the beginning of the 20th century, is called “roller
skate hockey”. Apart from several European countries, the sport presently
enjoys popularity in South America, Angola, and Mozambique. The
International Federation of roller skate hockey was created in 1924.
The sport may be played on roller skates or roller blades. Two teams
comprise of six players each, so it closely resembles ice hockey.
However, it is played on asphalt or an indoor skating rink with a ball.
The minimum size of the playing area is minimally set to be 65 x 35 feet
while the maximum size is 100 x 200 feet. Same as indoor hockey, the
game starts with a face-off after a coin is tossed. The players’ positions
are a goalie, two forwards, center and two defenders. All players wear
matching jerseys, as well as a face mask, shin guards, hockey gloves and
helmets with a chin strap. They may also use a mouthpiece, but it is optional.</p>
<p id="box11">Indoor hockey is very similar to field hockey but only adapted for indoor play.
However, the same playing style can be applied outdoors if the surface is flat,
hard and asphalted. Each team is created out of six players, and the game has two
periods of 20 minutes. One of the rules of the game is that the ball must only
be pushed and not hit with the stick. Additionally, the ball may just rise from
the surface while attempting to score a goal from the striking circle. The game
starts with a lateral pass from the team which loses a toss-up.</p>
<p><img src="./img/hockey-history-16th-century.jpg" alt="hockey-history-16th-century"></p>
</h4>
</div>
</div>
<footer>
<div>
<span>© 2022 - Oleksandr Shyryayev (Collège LaSalle Montréal)</span>
</div>
</footer>
<script type="text/javascript">
const $box = document.getElementById('box');
const $box1 = document.getElementById('box1');
const $box2 = document.getElementById('box2');
const $box3 = document.getElementById('box3');
const $box4 = document.getElementById('box4');
const $box5 = document.getElementById('box5');
const $box6 = document.getElementById('box6');
const $box7 = document.getElementById('box7');
const $box8 = document.getElementById('box8');
const $box9 = document.getElementById('box9');
const $box10 = document.getElementById('box10');
const $box11 = document.getElementById('box11');
const $search = document.getElementById('search');
$search.addEventListener('input', (event) => {
const searchText = event.target.value;
const regex = new RegExp(searchText, 'gi');
let text = $box.innerHTML;
let text1 = $box1.innerHTML;
let text2 = $box2.innerHTML;
let text3 = $box3.innerHTML;
let text4 = $box4.innerHTML;
let text5 = $box5.innerHTML;
let text6 = $box6.innerHTML;
let text7 = $box7.innerHTML;
let text8 = $box8.innerHTML;
let text9 = $box9.innerHTML;
let text10 = $box10.innerHTML;
let text11 = $box11.innerHTML;
text = text.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text1 = text1.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text2 = text2.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text3 = text3.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text4 = text4.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text5 = text5.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text6 = text6.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text7 = text7.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text8 = text8.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text9 = text9.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text10 = text10.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
text11 = text11.replace(/(<mark class="highlight">|<\/mark>)/gim, '');
const newText = text.replace(regex, '<mark class="highlight">$&</mark>');
const newText1 = text1.replace(regex, '<mark class="highlight">$&</mark>');
const newText2 = text2.replace(regex, '<mark class="highlight">$&</mark>');
const newText3 = text3.replace(regex, '<mark class="highlight">$&</mark>');
const newText4 = text4.replace(regex, '<mark class="highlight">$&</mark>');
const newText5 = text5.replace(regex, '<mark class="highlight">$&</mark>');
const newText6 = text6.replace(regex, '<mark class="highlight">$&</mark>');
const newText7 = text7.replace(regex, '<mark class="highlight">$&</mark>');
const newText8 = text8.replace(regex, '<mark class="highlight">$&</mark>');
const newText9 = text9.replace(regex, '<mark class="highlight">$&</mark>');
const newText10 = text10.replace(regex, '<mark class="highlight">$&</mark>');
const newText11 = text11.replace(regex, '<mark class="highlight">$&</mark>');
$box.innerHTML = newText;
$box1.innerHTML = newText1;
$box2.innerHTML = newText2;
$box3.innerHTML = newText3;
$box4.innerHTML = newText4;
$box5.innerHTML = newText5;
$box6.innerHTML = newText6;
$box7.innerHTML = newText7;
$box8.innerHTML = newText8;
$box9.innerHTML = newText9;
$box10.innerHTML = newText10;
$box11.innerHTML = newText11;
});
</script>
</body>
</html>