kumi/simple-fireworks
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Current status

Browse source
This commit is contained in:
Kumi 2024-01-01 00:21:29 +01:00
commit 230a4ed1c7
Signed by: kumi
GPG key ID: ECBCC9082395383F
2 changed files with 100 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
dist/fireworks.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

94
index.html Normal file
View file

@ -0,0 +1,94 @@
<!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.0">
<title>New Year's Countdown</title>
<script src="dist/fireworks.js"></script>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
background-color: #000;
overflow: hidden;
}
#countdown {
text-align: center;
padding: 20px;
font-size: 50px;
color: #fff;
position: absolute;
z-index: 2;
}
#fireworks-container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
}
</style>
</head>
<body>
<div id="fireworks-container" style="display: none;"></div>
<div id="countdown" style="position: absolute; top: 20px;"></div>
<script>
var currentYear = new Date().getFullYear();
var newYear = new Date(currentYear + 1, 0, 1, 0, 0, 0, 0);
var countdown = setInterval(function() {
var now = new Date().getTime();
var distance = newYear - now;
var days = Math.floor(distance / (24 * 60 * 60 * 1000));
var hours = Math.floor((distance % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000));
var minutes = Math.floor((distance % (60 * 60 * 1000)) / (60 * 1000));
var seconds = Math.floor((distance % (60 * 1000)) / 1000);
document.getElementById("countdown").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s";
if (distance < 0) {
clearInterval(countdown);
document.getElementById("countdown").innerHTML = "HAPPY NEW YEAR!!";
startFireworks();
}
}, 1000);
function startFireworks() {
const container = document.getElementById('fireworks-container');
const fireworks = new Fireworks(container, {
hue: { min: 0, max: 345 },
delay: { min: 15, max: 30 },
rocketsPoint: 50,
speed: 2,
acceleration: 1.05,
friction: 0.95,
gravity: 1.5,
particles: 90,
trace: 3,
explosion: 5,
boundaries: {
top: container.clientTop,
bottom: container.clientHeight,
left: container.clientLeft,
right: container.clientWidth
},
mouse: { click: false, move: false, max: 1 },
});
fireworks.start();
}
</script>
</body>
</html>