-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (97 loc) · 4.8 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
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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<!--Metadata-->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Add title and favicon-->
<title>Johaan Paul - Shooting Range</title>
<link rel="icon" type="image/jpg" href="https://www.johaan.org/Assets/Local/Icons/Transparent Icon.png">
<!--Link Global and Local CSS Files-->
<link rel="stylesheet" type="text/css" href="https://www.johaan.org/global.css"><!--Global-->
<link rel="stylesheet" type="text/css" href="/local.css"><!--Local-->
<!--Link Global And Local JS Files-->
<script src="https://www.johaan.org/global.js"></script><!--Global-->
<script src="./local.js"></script><!--Local-->
<!--Import The Game Files-->
<script src="./Libraries/p5.js"></script>
<script src="./Libraries/p5.dom.min.js"></script>
<script src="./Libraries/p5.sound.min.js"></script>
<script src="./Libraries/p5.play.js"></script>
<script src="./game.js"></script>
<!--Addons-->
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
</head>
<!--Title-->
<header class="section">
<h1>Johaan Paul</h1>
</header>
<!--Navigation Bar-->
<nav class="flex-container section">
<a id="Home-Button" class="flex-child" href="https://www.johaan.org/home/">
<ion-icon id="Home-Icon" name="home-outline"></ion-icon>
Home
</a>
<a id="About-Me-Button" class="flex-child" href="https://www.johaan.org/about-Me/">
<ion-icon id="About-Me-Icon" name="person-circle-outline"></ion-icon>
About Me
</a>
<a id="My-Projects-Button" class="flex-child" href="https://www.johaan.org/projects/">
<ion-icon id="My-Projects-Icon" name="game-controller-outline"></ion-icon>
My Projects
</a>
</nav>
<!--Main Page Content-->
<body>
<!--Coontent Box 1-->
<div class="section">
<h1>Shooting Range</h1>
<div id="Game" class="game-Canvas" onmousedown="shootBullet()"></div>
<p>
Shooting Range is a very basic game. The aim of this game is to shoot all of the balls before it hits the backboard, you have three lives before the game is over. You can destroy the balls by clicking on the screen to fire a bullet at the ball and move your mouse up and down to move the pistol around.<br/><br/>
How to play:<br/>
Shoot all the bubbles that are flying towards you before they hit the backboard.
If you let them hit the back board you will lose a life, You have a total of 3 lives.<br/><br/>
controls:<br/>
Move the cursor up and down to move the gun up and down.<br/>
left click on your mouse to shoot.
</p>
</div>
</body>
<!--Footer-->
<footer class="section flex-container">
<a id="Facebook-Icon" class="flex-child" href="https://www.facebook.com/JohaanPaul1234/" target="_blank">
<ion-icon name="logo-facebook"></ion-icon>
</a>
<a id="Github-Icon" class="flex-child" href="https://github.com/dinnerbone422" target="_blank">
<ion-icon name="logo-github"></ion-icon>
</a>
<a id="Instagram-Icon" class="flex-child" href="https://www.instagram.com/johaan_paul/" target="_blank">
<ion-icon name="logo-instagram"></ion-icon>
</a>
<a id="Steam-Icon" class="flex-child" href="https://steamcommunity.com/profiles/76561199037617555/" target="_blank">
<ion-icon name="logo-steam"></ion-icon>
</a>
<a id="Tiktok-Icon" class="flex-child" href="https://www.tiktok.com/@dinnerbone422" target="_blank">
<ion-icon name="logo-tiktok"></ion-icon>
</a>
<a id="Twitter-Icon" class="flex-child" href="https://twitter.com/paul_johaan" target="_blank">
<ion-icon name="logo-twitter"></ion-icon>
</a>
<a id="Whatsapp" class="flex-child" href="https://api.whatsapp.com/send?phone=64224240565" target="_blank">
<ion-icon name="logo-whatsapp"></ion-icon>
</a>
<a id="Xbox-Icon" class="flex-child" href="https://account.xbox.com/en-us/profile?gamertag=DinnerBone65174" target="_blank">
<ion-icon name="logo-xbox"></ion-icon>
</a>
<a id="Youtube-Icon" class="flex-child" href="https://www.youtube.com/channel/UCORvL_etj1agiFdXrmos_fg" target="_blank">
<ion-icon name="logo-youtube"></ion-icon>
</a>
<a id="Mail-Icon" class="flex-child" href="https://mail.google.com/mail/?view=cm&fs=1&to=feedback@johaan.org" target="_blank">
<ion-icon name="mail"></ion-icon>
</a>
<!-- add More social-Icon Links here--->
</footer>
</html>