forked from chloehassall27/Laundr_Game
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
109 lines (108 loc) · 3.83 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>404 - Game found!</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/5.3.3/pixi.min.js"></script>
<!-- <script src='js/pixi.min.js'></script> -->
<!-- Provided in case cdnjs stops hosting our file -->
<script>
// Will use local copy of pixi.min.js incase cdnjs is down or stops hosting our file
if (typeof PIXI == "undefined") {
document.write('<script src="js/pixi.min.js">\x3C/script>');
}
</script>
<!-- This style line (IN ADDITION TO HOW RESIZING WORKS IN game.js) may cause unexpected behavior when inserting it into their page for a demo, depending how it is inserted (iframe, js directly in their site, etc).
If directly inserting js into their page, you may want to look into using js to insert the app.view into a div which you can then work with
There also will probably be problems with the touchscreen code
-->
<script src="/node_modules/pixi-sound/dist/pixi-sound.js"></script>
<script type="module" src="/js/game.js"></script>
<script
async
src="https://platform.twitter.com/widgets.js"
charset="utf-8"
></script>
<script
async
defer
crossorigin="anonymous"
src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v9.0"
nonce="nU5nxJVO"
></script>
<link
rel="stylesheet"
type="text/css"
rel="noopener"
target="_blank"
href="../styles/indexStyles.css"
/>
</head>
<body>
<div>
<label class="toggle">
<input class="toggle-checkbox" type="checkbox" id="darkModeToggle" />
<div class="toggle-switch"></div>
<span class="toggle-label">Dark Mode</span>
</label>
<img
src="../sprites/gameLogo.png"
alt="Hamperman Game Logo"
class="game-logo"
/>
<script src="js/darkMode.js"></script>
</div>
<!-- The game itself will render inside the canvas element -->
<div class="container">
<div class="laundr-game" id="laundr-game" style="position: relative">
<canvas
class="pixiCanvas"
id="pixiCanvas"
,
style="width: 100%"
></canvas>
<!-- html version of social sharing options -->
<div class="socials" id="socials" style="width: 25%; min-width: 70px">
<div
class="twtDiv"
id="twtDiv"
style="display: inline-block; vertical-align: top; min-width: 40%"
></div>
<div
id="fb-root"
style="display: inline-block; vertical-align: top; width: 0%"
></div>
<div
class="fbDiv fb-share-button"
id="fbDiv"
data-href="https://www.laundr.io/404"
data-layout="button"
data-size="small"
style="display: inline-block; vertical-align: top; min-width: 40%"
>
<a
target="_blank"
href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.laundr.io%2F404&src=sdkpreparse"
class="fb-xfbml-parse-ignore"
>Share</a
>
</div>
</div>
</div>
</div>
</body>
<footer style="text-align: center; padding: 20px">
<p>© Laundr Inc, 2023. All rights reserved.</p>
<p>
<a href="https://www.yourwebsite.com">Your Website</a> |
<a href="mailto:[email protected]">Contact Us</a>
</p>
<p>Follow us on:</p>
<p>
<a href="https://www.facebook.com/yourpage" target="_blank">Facebook</a> |
<a href="https://www.twitter.com/yourpage" target="_blank">Twitter</a> |
<a href="https://www.instagram.com/yourpage" target="_blank">Instagram</a>
</p>
</footer>
</html>