Update index.html

This commit is contained in:
bot 2023-12-24 16:37:00 +01:00
parent 7523dce93f
commit aeecbfed9c

View File

@ -18,13 +18,13 @@
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"></script>
<style> <style>
html{ html{
overflow-x: hidden; overflow-x: hidden;
} }
body { body {
text-align: center; text-align: center;
font-family: 'Comic Mono'; font-family: 'Comic Mono';
@ -43,7 +43,7 @@
background-color: pink; background-color: pink;
border-radius: 5px; border-radius: 5px;
} }
.gurke { .gurke {
border: 2px solid black; border: 2px solid black;
padding: 10px; padding: 10px;
@ -57,7 +57,7 @@
.impostor-image-spinny { .impostor-image-spinny {
animation: amogus 1s infinite linear; animation: amogus 1s infinite linear;
} }
.article { .article {
text-align:left; text-align:left;
} }
@ -65,7 +65,7 @@
.leftRight { .leftRight {
animation: left2Right 20s infinite linear; animation: left2Right 20s infinite linear;
} }
.leftRight:hover { .leftRight:hover {
animation-play-state:paused; animation-play-state:paused;
} }
@ -73,19 +73,19 @@
.rightLeft { .rightLeft {
animation: right2Left 20s infinite linear; animation: right2Left 20s infinite linear;
} }
.rightLeft:hover { .rightLeft:hover {
animation-play-state:paused; animation-play-state:paused;
} }
.upDown { .upDown {
animation: updown 3s infinite ease; animation: updown 3s infinite ease;
} }
.upDown:hover { .upDown:hover {
animation-play-state:paused; animation-play-state:paused;
} }
.video { .video {
/*animation: rickRoll 1s infinite ease;*/ /*animation: rickRoll 1s infinite ease;*/
animation: amogus 10s infinite linear; animation: amogus 10s infinite linear;
@ -102,11 +102,11 @@
animation: blink 1s infinite linear; animation: blink 1s infinite linear;
} }
@keyframes blink { @keyframes blink {
50% { 50% {
background-color:yellow; background-color:yellow;
color:red; color:red;
} }
} }
@ -117,7 +117,7 @@
} }
} }
@keyframes updown { @keyframes updown {
50% { 50% {
transform: translateY(calc(100% - 560px)); transform: translateY(calc(100% - 560px));
@ -157,7 +157,7 @@
transform: translateX(0vw); transform: translateX(0vw);
} }
100% { 100% {
transform: translateX(-50vw); transform: translateX(-50vw);
} }
} }
@ -253,7 +253,7 @@
<br /> <br />
<div class="article"> <div class="article">
<p>Alias: <b><code>Blobert</code></b></p> <p>Alias: <b><code>Blobert</code></b></p>
<p>Github Page: <a href="https://github.com/JDobeshow" target="_blank">Julian;</a></p> <p>Github Page: <a href="https://github.com/JDobeshow" target="_blank">Julian;</a></p>
<p>E-Mail: <a href="mailto:money-manager@cringe-studios.com" target="_blank">money-manager@cringe-studios.com</a></p> <p>E-Mail: <a href="mailto:money-manager@cringe-studios.com" target="_blank">money-manager@cringe-studios.com</a></p>
<b>Favorites:</b> <b>Favorites:</b>
<ul> <ul>
@ -306,7 +306,7 @@
<li><a href="https://jg-cody.de/" target="_blank">JG-Cody</a> (E-Mail: <a href="mailto:cody@cringe-studios.com" target="_blank">cody@cringe-studios.com</a>)</li> <li><a href="https://jg-cody.de/" target="_blank">JG-Cody</a> (E-Mail: <a href="mailto:cody@cringe-studios.com" target="_blank">cody@cringe-studios.com</a>)</li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
<div> <div>
<div class="row"> <div class="row">
@ -317,7 +317,7 @@
<li>Axel Geilmann - ブタでした</li> <li>Axel Geilmann - ブタでした</li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -385,7 +385,7 @@
xhr.open("GET", "/visited.php"); xhr.open("GET", "/visited.php");
xhr.send(); xhr.send();
} }
let lastVisited = window.localStorage.lastVisited; let lastVisited = window.localStorage.lastVisited;
if(lastVisited == null) { if(lastVisited == null) {
window.localStorage.lastVisited = new Date().getTime(); window.localStorage.lastVisited = new Date().getTime();
@ -436,11 +436,11 @@
var previousValue2; var previousValue2;
function leapYear(year){ function leapYear(year){
return ((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0); return ((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0);
} }
const dayOfYear = date => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24); const dayOfYear = date => Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);
function myTimer2() { function myTimer2() {
var d = new Date(); var d = new Date();
if(Math.floor((d.getMilliseconds() + 1000 * (d.getSeconds() % 2))/400) != previousValue2){ if(Math.floor((d.getMilliseconds() + 1000 * (d.getSeconds() % 2))/400) != previousValue2){
@ -455,10 +455,127 @@
} }
} }
previousValue2 = Math.floor((d.getMilliseconds() + 1000 * (d.getSeconds() % 2))/400); previousValue2 = Math.floor((d.getMilliseconds() + 1000 * (d.getSeconds() % 2))/400);
document.getElementById("negclock").innerHTML = ((leapYear(d.getFullYear()) ? 365 : 364) - dayOfYear(d)).toString().padStart(3, '0') + "+" + (23 - d.getHours()).toString().padStart(2, '0') + ":" + (59 - d.getMinutes()).toString().padStart(2, '0') + ":" + (59 - d.getSeconds()).toString().padStart(2, '0') + "." + d.getMilliseconds().toString().padStart(3, '0'); document.getElementById("negclock").innerHTML = ((leapYear(d.getFullYear()) ? 366 : 365) - dayOfYear(d)).toString().padStart(3, '0') + "+" + (23 - d.getHours()).toString().padStart(2, '0') + ":" + (59 - d.getMinutes()).toString().padStart(2, '0') + ":" + (59 - d.getSeconds()).toString().padStart(2, '0') + "." + d.getMilliseconds().toString().padStart(3, '0');
} }
</script> </script>
</div> </div>
<div id="fireworks" style="pointer-events: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;">
<canvas id="fireworks-canvas"></canvas>
<script>
const EXPLOSION_TIME = 100;
const EXPLOSION_SIZE = 100;
const NUM_PARTICLES = 12;
const SPEED = 2;
function HSVtoRGB(h, s, v) {
var r, g, b, i, f, p, q, t;
if (arguments.length === 1) {
s = h.s, v = h.v, h = h.h;
}
i = Math.floor(h * 6);
f = h * 6 - i;
p = v * (1 - s);
q = v * (1 - f * s);
t = v * (1 - (1 - f) * s);
switch (i % 6) {
case 0: r = v, g = t, b = p; break;
case 1: r = q, g = v, b = p; break;
case 2: r = p, g = v, b = t; break;
case 3: r = p, g = q, b = v; break;
case 4: r = t, g = p, b = v; break;
case 5: r = v, g = p, b = q; break;
}
return "rgb(" + (r * 255) + "," + (g * 255) + "," + (b * 255) + ")";
}
const canvas = document.getElementById("fireworks-canvas");
const updateSize = () => {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
};
let rockets = [];
let rocketsAreFiring = false;
updateSize();
window.onresize = updateSize;
const ctx = canvas.getContext("2d");
window.addEventListener("keyup", e => {
if (e.key == 'h') {
canvas.style.display = canvas.style.display == 'none' ? null : 'none';
}
});
setInterval(() => {
const theTime = new Date();
if (theTime.getDate() != 1 || theTime.getMonth() != 0 || theTime.getHours() != 0) {
rockets = [];
rocketsAreFiring = false;
return;
}
rocketsAreFiring = true;
rockets.push({ x: Math.random() * canvas.width, y: canvas.height, life: (Math.random() * 0.75 + 0.25) * canvas.height, color: HSVtoRGB(Math.random(), 1, 1) });
}, 300);
setInterval(() => {
if (!rocketsAreFiring) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
return;
}
ctx.fillStyle = "#000044ff";
ctx.fillRect(0, 0, canvas.width, canvas.height);
rockets.forEach(rocket => {
rocket.life -= SPEED;
if (rocket.life <= EXPLOSION_TIME) {
if (rocket.life <= 0) {
rockets.splice(rockets.indexOf(rocket), 1);
return;
}
const explosionTime = 1 - (rocket.life / EXPLOSION_TIME);
const size = explosionTime * EXPLOSION_SIZE;
for (let i = 0; i < NUM_PARTICLES; i++) {
const angle = i / NUM_PARTICLES * Math.PI * 2;
const px = Math.cos(angle) * size;
const py = Math.sin(angle) * size;
ctx.fillStyle = rocket.color;
ctx.beginPath();
ctx.arc(rocket.x + px, rocket.y + py, 5, 0, Math.PI * 2, true);
ctx.fill();
}
} else {
rocket.y -= SPEED;
ctx.fillStyle = "black";
ctx.fillRect(rocket.x - 5, rocket.y - 5, 10, 10);
}
});
const theTime = new Date();
ctx.fillStyle = "white";
ctx.textAlign = "center";
ctx.font = "bold 50px Comic Mono";
ctx.fillText("Happy new year! 🥳", canvas.width / 2, canvas.height / 2);
ctx.font = "bold 100px Comic Mono";
ctx.fillText(theTime.getHours().toString().padStart(2, '0') + ":" + theTime.getMinutes().toString().padStart(2, '0') + ":" + theTime.getSeconds().toString().padStart(2, '0'), canvas.width / 2, canvas.height / 2 - 150);
ctx.font = "bold 10px Comic Mono";
ctx.fillStyle = "#0000ff";
ctx.textAlign = "left";
ctx.fillText("Press 'h' to hide", 10, canvas.height - 10);
}, 10);
</script>
</div>
<!-- <a href="https://zap-hosting.com/a/d0dfc6046400b7d0efcafb2c2823039127737029"><img src="https://zap-hosting.com/interface/download/images.php?type=affiliate&id=273408" alt="ZAP-Hosting Gameserver and Webhosting"></a> --> <!-- <a href="https://zap-hosting.com/a/d0dfc6046400b7d0efcafb2c2823039127737029"><img src="https://zap-hosting.com/interface/download/images.php?type=affiliate&id=273408" alt="ZAP-Hosting Gameserver and Webhosting"></a> -->
</body> </body>
</html> </html>