Refactor easter egg functionality, fetch strings from JSON
- Refactored the `initEasterEgg` function to fetch easter egg strings from a JSON file instead of hardcoding them. - Removed the unused `eastereggstrings` array. - Updated event listener to use arrow function syntax (`evt`) instead of `event`. - Added error handling for failed fetch requests.
This commit is contained in:
parent
d6b87569a6
commit
3305c26750
@ -1,5 +1,6 @@
|
|||||||
import '/assets/scss/page.scss';
|
import '/assets/scss/page.scss';
|
||||||
|
|
||||||
|
let eastereggsurl = '/assets/js/eastereggstrings.json'
|
||||||
document.addEventListener("readystatechange", event => {
|
document.addEventListener("readystatechange", event => {
|
||||||
if(event.target.readyState === 'complete') {
|
if(event.target.readyState === 'complete') {
|
||||||
initExternalLinks();
|
initExternalLinks();
|
||||||
@ -17,30 +18,20 @@ function initExternalLinks() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function initEasterEgg() {
|
function initEasterEgg() {
|
||||||
document.body.addEventListener('click', function(event) {
|
document.body.addEventListener('click', evt => {
|
||||||
// Check if the clicked element is an interactive element or triggers an event
|
fetch(eastereggsurl)
|
||||||
if (!isInteractiveElement(event.target)) {
|
.then((response) => {
|
||||||
let randomhue = Math.floor(Math.random() * 360)
|
if (!response.ok) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}).then((eastereggstrings) => {
|
||||||
let randomstring = Math.floor(Math.random() * eastereggstrings.length);
|
let randomstring = Math.floor(Math.random() * eastereggstrings.length);
|
||||||
// Apply the color shift filter to the body
|
|
||||||
document.body.style.filter = 'hue-rotate(' + randomhue + 'deg)';
|
|
||||||
document.querySelector('.easter-egg').innerHTML = eastereggstrings[randomstring];
|
document.querySelector('.easter-egg').innerHTML = eastereggstrings[randomstring];
|
||||||
}
|
})
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
let eastereggstrings = [
|
|
||||||
"No",
|
|
||||||
"Stop it",
|
|
||||||
"It not funny anymore",
|
|
||||||
"Odette does not like this",
|
|
||||||
"Garry has asked to stop scaring the birds",
|
|
||||||
"Seriously?",
|
|
||||||
"I'm out of here",
|
|
||||||
"Stop poking me. I' thinking",
|
|
||||||
"Oh boy"
|
|
||||||
]
|
|
||||||
|
|
||||||
function isInteractiveElement(element) {
|
function isInteractiveElement(element) {
|
||||||
// Check if the element is an interactive element or triggers an event
|
// Check if the element is an interactive element or triggers an event
|
||||||
return (
|
return (
|
||||||
|
Loading…
Reference in New Issue
Block a user