-
Notifications
You must be signed in to change notification settings - Fork 0
/
possu.html
68 lines (66 loc) · 4.77 KB
/
possu.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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>nerveBall</title>
<link rel="stylesheet" type="text/css" href="nerveballweb.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<div id="main" class="welcome">
<h1>nerveBall</h1>
<p>
Welcome to nerveBall test site. Play at your own risk, the game is nerve wrecking and may cause anxiety.
This site gathers no data, uses no cookies and has no ads. nerveBall is free software, licensed under <a href="https://www.gnu.org/licenses/gpl-3.0.html">GPL v3</a>.
</p>
<p>
Click to split the ball and gain points.
The smaller the ball, the more points you get.
The faster the ball, the more points you get.
Every 93 seconds The Big Ball appears
and you lose points and time.
The smallest balls do not split, but disappear and you gain play time.
The game ends when you run out of time or all balls are gone.
</p>
<p xmlns:cc="http://creativecommons.org/ns#" xmlns:dct="http://purl.org/dc/terms/"><a property="dct:title" rel="cc:attributionURL" href="https://nerveball.aprx.io">nerveBall sound design</a> by <a rel="cc:attributionURL dct:creator" property="cc:attributionName" href="https://www.youtube.com/@japitasuri">Japi Tasuri</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display:inline-block;">Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International<img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/cc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/by.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/nc.svg?ref=chooser-v1" alt=""><img style="height:22px!important;margin-left:3px;vertical-align:text-bottom;" src="https://mirrors.creativecommons.org/presskit/icons/sa.svg?ref=chooser-v1" alt=""></a></p>
</div>
<button id="start" class="start" onclick="window.location.href='game.html'">Start Game</button>
<div id="bsa" class="bsa"></div>
<div id="dmbgoyn" class="dmbgoyn"></div>
<div id="copyright" class="copyright">
<p>
nerveBall by Jaakko Prättälä 2024. Licensed under GPL v3.
</p>
</div>
<script type="text/javascript">
setInterval(function() {
//modulate background color blue channel with a sine wave
document.body.style.backgroundColor = "rgb(0, 0, " + Math.round(64 * Math.abs(Math.sin(Date.now() / 1000))) + ")";
}, 10);
var bsa = document.getElementById("bsa");
bsa.innerHTML = "Nerve Wrecking, Ball Splitting Action!";
bsa.style.position = "fixed";
bsa.style.bottom = "0";
bsa.style.right = "0";
bsa.style.fontSize = "24px";
var dmbgoyn = document.getElementById("dmbgoyn");
dmbgoyn.innerHTML = "Do My Balls Get On Your Nerves?";
dmbgoyn.style.position = "fixed";
dmbgoyn.style.bottom = "0";
dmbgoyn.style.left = "0";
dmbgoyn.style.fontSize = "24px";
setInterval(function() {
//modulate text color red, green and blue channels with sine waves
bsa.style.color = "rgb(" + Math.round(255 - 255 * Math.abs(Math.sin(Date.now() / 1000))) + ", " + Math.round(255 - 255 * Math.abs(Math.sin(Date.now() / 1000 + Math.PI / 2))) + ", " + Math.round(255 - 255 * Math.abs(Math.sin(Date.now() / 1000 + Math.PI))) + ")";
//modulate vertical position with sine wave
bsa.style.bottom = Math.round(100 * Math.abs(Math.sin(Date.now() / 1024))) + "px";
}, 10);
setInterval(function() {
//modulate text color red, green and blue channels with sine waves
dmbgoyn.style.color = "rgb(" + Math.round(255 * Math.abs(Math.sin(Date.now() / 1000))) + ", " + Math.round(255 * Math.abs(Math.sin(Date.now() / 1000 + Math.PI / 2))) + ", " + Math.round(255 * Math.abs(Math.sin(Date.now() / 1000 + Math.PI))) + ")";
//modulate vertical position with sine wave
dmbgoyn.style.bottom = Math.round(100 * Math.abs(Math.sin(Date.now() / 512))) + "px";
}, 10);
</script>
</body>
</html>