-
Notifications
You must be signed in to change notification settings - Fork 3
Expand file tree
/
Copy pathindex.html
More file actions
493 lines (482 loc) · 25.8 KB
/
index.html
File metadata and controls
493 lines (482 loc) · 25.8 KB
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
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
<!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">
<meta name="description" content="Mrprocom's Personal Website. I made this website to publish some of my work, that includes, projects, web applications, powder toy saves and scripts.">
<meta name="keywords" content="mrprocom, mrprocom website, online tools, personal website, projects, tools, web apps, website">
<meta name="author" content="Mrprocom">
<link rel="icon" href="favicon.ico">
<title>Mrprocom</title>
<!-- Bootstrap and CSS -->
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="style.css" rel="stylesheet">
</head>
<body>
<div id="logo-wrapper">
<img src="logo.svg" alt="Mrprocom's Logo" id="logo">
<h1 id="headline">Mrprocom<br><small>My Personal Website</small></h1>
</div>
<div id="sections-wrapper">
<div class="socket"><div id="about" class="section inactive" style="height: 10vmin"><h4>About</h4></div></div>
<div class="socket"><div id="projects" class="section inactive" style="height: 10vmin"><h4>Projects</h4></div></div>
<div class="socket"><div id="tpt" class="section inactive" style="height: 10vmin"><h4>TPT</h4></div></div>
<div class="socket"><div id="scripts" class="section inactive" style="height: 10vmin"><h4>Scripts</h4></div></div>
<div class="socket"><div id="changelog" class="section inactive" style="height: 10vmin"><h4>Changelog</h4></div></div>
</div>
<div id="about-panel" class="panel-section">
<div class="col-sm-6 text-wrapper">
<div class="text-section">
<h1 class="header">About Me</h1>
<p>Hello, I am known as Mrprocom on the Internet, that is the username I usually use.</p>
<p>I enjoy working on random and fun projects that involve coding, calculating or designing. I am very good at programming in Python and JavaScript because I work on projects related to them a lot. I also have a very basic knowledge of Batch, C++, Java, Lua, Perl, PHP and Ruby.</p>
<p>Other than coding, I am good at photo editing, playing the piano and designing.</p>
<p>Where you can find me:</p>
<ul>
<li><a href="https://webchat.freenode.net/" rel="nofollow">Freenode</a></li>
<li><a href="https://github.com/Mrprocom" rel="nofollow">GitHub</a></li>
<li><a href="https://openuserjs.org/users/Mrprocom" rel="nofollow">OpenUserJS</a>
<li><a href="http://tpt.io/@Mrprocom" rel="nofollow">Powder Toy</a></li>
</ul>
</div>
</div>
<div class="col-sm-6 text-wrapper">
<div class="text-section">
<h1 class="header">About the Website</h1>
<p>I made this website for publishing some of my work, that includes projects, web applications, Powder Toy saves and scripts. These can be found in the other few tabs above if you want to check them out.</p>
<p>I made this website using HTML, CSS and JavaScript with some help from the Bootstrap framework. This website and all of its contents and projects are copyright protected</p>
<p>This website is hosted on GitHub. Repository: <a href="https://github.com/Mrprocom/Mrprocom.github.io" rel="nofollow">Mrprocom.github.io</a></p>
<p>© 2017 Mrprocom All Rights Reserved</p>
</div>
</div>
</div>
<div id="projects-panel" class="panel-section">
<div class="list-wrapper">
<div class="padding15">
<h2 class="header">Projects</h2>
<p class="font17">Here you will find a list of web projects made by me.</p>
<hr>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/dripcalculator/">
<img src="thumbnails/dripcalculator.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Drip Calculator</h3>
<p>This page calculates how much water was wasted from a leak or from anything that drips, then it tells you what the volume of the wasted water is equivalent to, what it could have been used for and some other things. It is not 100% accurate.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/frequencio/">
<img src="thumbnails/frequencio.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Frequencio</h3>
<p>This instrument works as a frequency generator. It is best to use with multi-touch devices. Swiping from left to right changes the frequency while swiping from top to bottom changes the amplitude. There are a lot of settings to play around with and options to view grids.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/homepage/">
<img src="thumbnails/homepage.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Homepage</h3>
<p>This page contains a collection of popular and useful websites. It is very customisable, you can remove websites from it and add your own. You can also add new sections with more websites inside. This project was inspired by the start screen from windows 8.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/informap/">
<img src="thumbnails/informap.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Informap</h3>
<p>This page contains an interactive world map with a selector at the bottom to change the map to view various different things, like GDP, life expectancy, murder rate, language and over 30 more things. It can list data in a table and compare selected countries.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/ircquote/">
<img src="thumbnails/ircquote.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">IRC Quote Prettifier</h3>
<p>This tool automatically prettifies IRC quotes. It has options to change the message syntax, hide IPs, HTML colour nicknames, convert IRC formatted text to HTML, HTML encode special characters and preview the result. It is useful for posting quotes in forums.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/irc/">
<img src="thumbnails/irc.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">IRC Tutorial</h3>
<p>This page has 3 web clients you can choose from. It shows you information about the web client, how to connect, useful things to know about, commands and how to behave. It also allows you to use colours and other text formats for web clients.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/lifestats/">
<img src="thumbnails/lifestats.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Life Statistics</h3>
<p>This page calculates statistics about your life only from your birth date, like your exact age, the food and drinks you consumed, the waste you produced and other things. It is not 100% accurate because life differs from person to person.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/pyramid/">
<img src="thumbnails/pyramid.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Population Pyramid Generator</h3>
<p>This tool generates a semi-accurate population pyramid using 4 variables entered by the user, crude birth rate, crude death rate, sex ratio and net migration rate. You can hover over any component to show basic information about it.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/tptinterface/">
<img src="thumbnails/tptinterface.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">Powder Toy Interface Tutorial</h3>
<p>This interactive interface tutorial teaches the different components of the interface of a sandbox game called The Powder Toy.</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 project-container">
<div class="project">
<a href="projects/tptreference/">
<img src="thumbnails/tptreference.svg" alt="Thumbnail" class="project-thumbnail img-responsive">
<div class="project-description">
<h3 class="header">The Ultimate TPT Reference</h3>
<p>This reference contains a lot of information about the game. You can come back to this reference whenever there is something you want to check.</p>
</div>
</a>
</div>
</div>
</div>
</div>
<div id="tpt-panel" class="panel-section">
<div class="list-wrapper">
<div class="padding15">
<h2 class="header">Powder Toy Saves</h2>
<p class="font17">Here you will find a list of <a href="http://powdertoy.co.uk/">Powder Toy</a> saves made by me.</p>
<hr>
</div>
<div class="col-md-3 col-sm-4 save-container">
<div class="save">
<img src="http://static.powdertoy.co.uk/2090785.png" alt="Thumbnail" class="save-thumbnail img-responsive">
<div class="save-buttons">
<a href="http://tpt.io/~2090785" rel="nofollow"><div class="save-button save-view">View</div></a>
<a href="ptsave:2090785"><div class="save-button save-open">Open</div></a>
</div>
<div class="save-description">
<h3 class="header"><a href="http://tpt.io/~2090785" rel="nofollow">TNT Factory</a></h3>
<p>This factory automatically makes small textured blocks of TNT using NITR and CLST.</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-4 save-container">
<div class="save">
<img src="http://static.powdertoy.co.uk/1907373.png" alt="Thumbnail" class="save-thumbnail img-responsive">
<div class="save-buttons">
<a href="http://tpt.io/~1907373" rel="nofollow"><div class="save-button save-view">View</div></a>
<a href="ptsave:1907373"><div class="save-button save-open">Open</div></a>
</div>
<div class="save-description">
<h3 class="header"><a href="http://tpt.io/~1907373" rel="nofollow">Image Shrinker</a></h3>
<p>This machine shrinks down any image made of solids and does not contain DMND at all.</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-4 save-container">
<div class="save">
<img src="http://static.powdertoy.co.uk/2152416.png" alt="Thumbnail" class="save-thumbnail img-responsive">
<div class="save-buttons">
<a href="http://tpt.io/~2152416" rel="nofollow"><div class="save-button save-view">View</div></a>
<a href="ptsave:2152416"><div class="save-button save-open">Open</div></a>
</div>
<div class="save-description">
<h3 class="header"><a href="http://tpt.io/~2152416" rel="nofollow">Music Sight Reading</a></h3>
<p>This game challenges you to get as many notes right as possible within a period of time.</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-4 save-container">
<div class="save">
<img src="http://static.powdertoy.co.uk/1858279.png" alt="Thumbnail" class="save-thumbnail img-responsive">
<div class="save-buttons">
<a href="http://tpt.io/~1858279" rel="nofollow"><div class="save-button save-view">View</div></a>
<a href="ptsave:1858279"><div class="save-button save-open">Open</div></a>
</div>
<div class="save-description">
<h3 class="header"><a href="http://tpt.io/~1858279" rel="nofollow">Semi-Realistic Tank</a></h3>
<p>This tank shoots a moving projectile that can explode.</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-4 save-container">
<div class="save">
<img src="http://static.powdertoy.co.uk/1904829.png" alt="Thumbnail" class="save-thumbnail img-responsive">
<div class="save-buttons">
<a href="http://tpt.io/~1904829" rel="nofollow"><div class="save-button save-view">View</div></a>
<a href="ptsave:1904829"><div class="save-button save-open">Open</div></a>
</div>
<div class="save-description">
<h3 class="header"><a href="http://tpt.io/~1904829" rel="nofollow">Multi-Purpose Laser</a></h3>
<p>This laser has a controllable beam colour and temperature and it has no WIFI.</p>
</div>
</div>
</div>
</div>
</div>
<div id="scripts-panel" class="panel-section">
<div class="list-wrapper">
<h2 class="header">Scripts</h2>
<p class="font17">Here you will find a list of scripts made by me.</p>
<hr>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/Replace_Filename.bat" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/batch.svg" alt="Batch" class="script-icon">
<div class="script-name">Replace Filename</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Renames all files in the same directory using find and replace</div>
</div>
</a>
</div>
<hr>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/geoip.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/hexchat.svg" alt="HexChat" class="script-icon">
<div class="script-name">GeoIP</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Provides a command to locate someone from their IP address</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/invite_join.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/hexchat.svg" alt="HexChat" class="script-icon">
<div class="script-name">Join on Invite</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Automatically joins the channel you have been invited to</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/rainbow.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/hexchat.svg" alt="HexChat" class="script-icon">
<div class="script-name">Rainbow</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Sends rainbow messages</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/kick_rejoin.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/hexchat.svg" alt="HexChat" class="script-icon">
<div class="script-name">Rejoin on Kick</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Automatically joins after getting kicked</div>
</div>
</a>
</div>
<hr>
<div class="row script">
<a href="https://starcatcher.us/scripts/?view=140" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/lua.svg" alt="Lua" class="script-icon">
<div class="script-name">Orbit Simulator</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Has movable planets with a gravitational force</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://starcatcher.us/scripts/?view=130" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/lua.svg" alt="Lua" class="script-icon">
<div class="script-name">Slingshot</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Shoots explodable projectiles</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://starcatcher.us/scripts/?view=122" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/lua.svg" alt="Lua" class="script-icon">
<div class="script-name">Rainbow PHOT</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Colourises photons</div>
</div>
</a>
</div>
<hr>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/bot_framework.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/python.svg" alt="Python" class="script-icon">
<div class="script-name">Bot Framework</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Simple IRC bot framework</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://github.com/Mrprocom/Mrprocom.github.io/blob/master/scripts/irc_to_html.py" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/python.svg" alt="Python" class="script-icon">
<div class="script-name">IRC to HTML</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Converts IRC formatted text to HTML</div>
</div>
</a>
</div>
<hr>
<div class="row script">
<a href="https://openuserjs.org/scripts/Mrprocom/GroupBox_Enhancements" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/userscript.svg" alt="Userscript" class="script-icon">
<div class="script-name">GroupBox Enhancements</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Improves the look of GroupBox</div>
</div>
</a>
</div>
<div class="row script">
<a href="https://openuserjs.org/scripts/Mrprocom/Web_IRC_Format_Shortcuts" rel="nofollow">
<div class="col-sm-4 col-xs-12">
<img src="icons/userscript.svg" alt="Userscript" class="script-icon">
<div class="script-name">Web IRC Format Shortcuts</div>
</div>
<div class="col-sm-8 col-xs-12">
<div class="script-description">Adds shortcuts to format messages sent from QwebIRC or KiwiIRC</div>
</div>
</a>
</div>
</div>
</div>
<div id="changelog-panel" class="panel-section">
<div class="list-wrapper">
<h2 class="header">Changelog</h2>
<p class="font17">Here you will find a list of the most recent changes to the website and all other proejcts.</p>
<hr>
<div class="changelog">
<h3>16/Jan/2020</h3>
<ul>
<li><b><a href="">Main Page:</a></b> Fix broken links in the Scripts section.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add save tutorial on LDTC and a section for mark2222's subframe tutorials.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update elements to include STASIS WALL, LDTC and CYCL.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update the Mods list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update the Developers list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update the Rules list.</li>
</ul>
</div>
<div class="changelog">
<h3>30/May/2018</h3>
<ul>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Fix element thumbnails not showing up.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Fix typos in the Console page.</li>
</ul>
</div>
<div class="changelog">
<h3>07/Feb/2018</h3>
<ul>
<li><b><a href="">Main Page:</a></b> Add a changelog.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add Cyens Mod to the mods list.</li>
</ul>
</div>
<div class="changelog">
<h3>06/Jan/2018</h3>
<ul>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add Mrprocom to the moderators list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add #powder-subframe to the IRC channels list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update the TPT mods list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Update the saves tutorial list.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Fix wrong alignment for GUN in the elements list.</li>
</ul>
</div>
<div class="changelog">
<h3>21/Nov/2017</h3>
<ul>
<li><b><a href="">Main Page:</a></b> Add Orbit Simulator to the scripts list.</li>
</ul>
</div>
<div class="changelog">
<h3>10/Sep/2017</h3>
<ul>
<li><b><a href="projects/homepage/">Homepage:</a></b> Change the style of tiles a bit to make them prettier.</li>
</ul>
</div>
<div class="changelog">
<h3>04/Sep/2017</h3>
<ul>
<li><b><a href="">Main Page:</a></b> Add TPT Lua scripts to the scripts list.</li>
<li><b><a href="">Main Page:</a></b> Update the description of the Homepage project.</li>
<li><b><a href="proejcts/homepage">Homepage:</a></b> Make Homepage more customisable by allowing custom categories to be created.</li>
<li><b><a href="proejcts/homepage">Homepage:</a></b> List less tiles/pages by default.</li>
<li><b><a href="projects/informap">Informap:</a></b> Use a more reliable method to check for selected countries.</li>
<li><b><a href="projects/ircquote">IRC Quote Prettifier:</a></b> Return the output HTML code in multiple lines instead of using HTML line breakers.</li>
</ul>
</div>
<div class="changelog">
<h3>30/Aug/2017</h3>
<ul>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add Larger Canvas to the mods list.</li>
</ul>
</div>
<div class="changelog">
<h3>23/Aug/2017</h3>
<ul>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add White TPT to the mods list.</li>
</ul>
</div>
<div class="changelog">
<h3>22/Aug/2017</h3>
<ul>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Change the mods list to a visually-similar table to fix a few problems.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Add a transition effect to table rows on hover.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Modify Google Drive links and change some of them to direct download links.</li>
<li><b><a href="projects/tptreference/">TPT Reference:</a></b> Remove unnecessary brackets around "of the" in the description of the mods and Lua scripts page.</li>
</ul>
</div>
</div>
</div>
<!-- JavaScripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="script.js"></script>
</body>
</html>