2024-06-06 00:40:00 +02:00
|
|
|
|
// keep the main html clean by loading in ascii art from file
|
|
|
|
|
function asciiLoader() {
|
2024-06-05 21:53:45 +02:00
|
|
|
|
fetch('assets/ascii.txt')
|
|
|
|
|
.then(response => response.text())
|
|
|
|
|
.then(data => {
|
|
|
|
|
const asciiArtContainer = document.getElementById('ascii-art-container');
|
|
|
|
|
asciiArtContainer.innerText = data;
|
|
|
|
|
initAsciiEffect(data);
|
2024-06-06 00:40:00 +02:00
|
|
|
|
}); }
|
|
|
|
|
// because different screen sizes require different positioning and font size, we adjust it dynamically
|
2024-06-05 21:53:45 +02:00
|
|
|
|
function adjustFontSize() {
|
|
|
|
|
const asciiArtContainer = document.getElementById('ascii-art-container');
|
|
|
|
|
const windowWidth = window.innerWidth;
|
|
|
|
|
const windowHeight = window.innerHeight;
|
2024-06-06 00:40:00 +02:00
|
|
|
|
const baseFontSize = Math.min(windowWidth, windowHeight) / 145;
|
2024-06-05 21:53:45 +02:00
|
|
|
|
asciiArtContainer.style.fontSize = `${baseFontSize}px`;
|
|
|
|
|
asciiArtContainer.style.top = `${windowHeight / 2}px`;
|
|
|
|
|
asciiArtContainer.style.left = `${windowWidth / 2}px`;
|
2024-06-06 00:40:00 +02:00
|
|
|
|
asciiArtContainer.style.transform = 'translate(-50%, -50%)'; }
|
|
|
|
|
// if you are wondering why this function exists,
|
|
|
|
|
// i wanted to play with js, and it should show that everything will deteriorate eventually
|
|
|
|
|
// and nothing is permament, so enjoy it while it lasts.
|
2024-06-05 21:53:45 +02:00
|
|
|
|
function initAsciiEffect(asciiArt) {
|
|
|
|
|
const asciiArtContainer = document.getElementById('ascii-art-container');
|
|
|
|
|
const chars = asciiArt.split('');
|
2024-06-06 00:40:00 +02:00
|
|
|
|
const updateFrequency = 0;
|
2024-06-05 21:53:45 +02:00
|
|
|
|
function getRandomIndex() {
|
|
|
|
|
return Math.floor(Math.random() * chars.length);
|
2024-06-05 23:05:12 +02:00
|
|
|
|
}
|
2024-06-05 21:53:45 +02:00
|
|
|
|
function flipBit() {
|
|
|
|
|
const index = getRandomIndex();
|
|
|
|
|
const char = chars[index];
|
2024-06-06 00:40:00 +02:00
|
|
|
|
if (char === '@') {
|
2024-06-05 21:53:45 +02:00
|
|
|
|
chars[index] = '#';
|
|
|
|
|
} else if (char === '#') {
|
|
|
|
|
chars[index] = '@';
|
2024-06-06 00:40:00 +02:00
|
|
|
|
} else if (char === '*') {
|
|
|
|
|
chars[index] = '-';
|
2024-06-06 00:50:23 +02:00
|
|
|
|
} else if (char === '-') {
|
|
|
|
|
chars[index] = '*';
|
2024-06-05 21:53:45 +02:00
|
|
|
|
}
|
|
|
|
|
asciiArtContainer.innerText = chars.join('');
|
|
|
|
|
}
|
2024-06-06 00:40:00 +02:00
|
|
|
|
setInterval(flipBit, updateFrequency); }
|
|
|
|
|
function greetBeingOfUnknownHeritage() {
|
2024-06-06 00:50:23 +02:00
|
|
|
|
console.log(`___
|
2024-06-06 00:40:00 +02:00
|
|
|
|
/イ フ
|
|
|
|
|
| _ _|
|
|
|
|
|
/ ミ__xノ
|
|
|
|
|
/ |
|
|
|
|
|
/ ヽ ノ
|
|
|
|
|
│ | | |
|
|
|
|
|
/ ̄| | | |
|
|
|
|
|
| ( ̄ヽ_ヽ_)_)
|
|
|
|
|
\二つ
|
|
|
|
|
`);
|
|
|
|
|
console.log("hello there, have fun"); }
|
|
|
|
|
window.addEventListener('resize', adjustFontSize);
|
|
|
|
|
window.addEventListener('load', adjustFontSize);
|
|
|
|
|
window.addEventListener('load', asciiLoader);
|
|
|
|
|
window.addEventListener('load', greetBeingOfUnknownHeritage);
|
|
|
|
|
// meow
|