100 lines
4.1 KiB
JavaScript
100 lines
4.1 KiB
JavaScript
// Figure out what time-based lie to tell visitors about their life choices
|
|
const determineGreet = hours => {
|
|
document.getElementById("greeting").innerText = `It's ${hours < 12 ? "Morning and Currently" : hours < 18 ? "Afternoon and Currently" : "Evening and Currently"}`;
|
|
};
|
|
|
|
// Show the relentless march of time
|
|
function displayTime(time) {
|
|
document.getElementById("time").innerHTML = time;
|
|
}
|
|
|
|
// Passive-aggressively suggest blog reading at 2-hour intervals (we're persistent, not pushy)
|
|
const determineBlogMessage = hours => {
|
|
let message;
|
|
|
|
if (hours >= 0 && hours < 2) {
|
|
message = "Late night reading? Check out my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 2 && hours < 4) {
|
|
message = "Insomniac hours? Peruse my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 4 && hours < 6) {
|
|
message = "Early bird? Catch up on my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 6 && hours < 8) {
|
|
message = "Coffee and a <a href='blog/index.html' class='blog-link'>Blog</a>?";
|
|
} else if (hours >= 8 && hours < 10) {
|
|
message = "Morning routine? Add my <a href='blog/index.html' class='blog-link'>Blog</a> to it";
|
|
} else if (hours >= 10 && hours < 12) {
|
|
message = "Mid-morning break? Read my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 12 && hours < 14) {
|
|
message = "Lunch break? Browse my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 14 && hours < 16) {
|
|
message = "Afternoon slump? Perk up with my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 16 && hours < 18) {
|
|
message = "It's a good time to read my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 18 && hours < 20) {
|
|
message = "Get comfy and read my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else if (hours >= 20 && hours < 22) {
|
|
message = "Wind down with my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
} else {
|
|
message = "Nightcap? End your day with my <a href='blog/index.html' class='blog-link'>Blog</a>";
|
|
}
|
|
document.getElementById("blogMessage").innerHTML = message;
|
|
};
|
|
|
|
|
|
// Tick tock, tick tock - time marches on regardless of your location
|
|
setInterval(function () {
|
|
const today = new Date();
|
|
const time = today.toLocaleTimeString('en-US', {
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
hour12: false
|
|
});
|
|
displayTime(time);
|
|
}, 1000);
|
|
|
|
// Fetch the freshest posts to lure readers into the content trap
|
|
async function loadRecentPosts() {
|
|
try {
|
|
const response = await fetch('blog/api/posts.php');
|
|
const posts = await response.json();
|
|
const recentPostsContainer = document.getElementById("recentPosts");
|
|
|
|
// Only the top 3 - we're not monsters showing everything at once
|
|
const recentPosts = posts.slice(0, 3);
|
|
|
|
recentPosts.forEach(post => {
|
|
const postLink = document.createElement('a');
|
|
postLink.href = `blog/post.html?id=${post.id}`;
|
|
postLink.textContent = `${post.date} - ${post.title}`;
|
|
recentPostsContainer.appendChild(postLink);
|
|
});
|
|
} catch (error) {
|
|
console.error('Error loading blog posts:', error);
|
|
// Silence is golden when things break
|
|
}
|
|
}
|
|
|
|
// Boot up the whole circus when the page loads
|
|
window.addEventListener('load', (event) => {
|
|
const today = new Date();
|
|
const time = today.toLocaleTimeString('en-US', {
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
hour12: false
|
|
});
|
|
// Your timezone, your problem - we just display what your browser tells us
|
|
const localHours = today.getHours();
|
|
determineGreet(localHours);
|
|
determineBlogMessage(localHours);
|
|
displayTime(time);
|
|
loadRecentPosts();
|
|
// updateWeather(); // Weather is overrated anyway
|
|
});
|
|
|
|
// Keep harassing visitors about the blog every 60 seconds
|
|
setInterval(function () {
|
|
const today = new Date();
|
|
const localHours = today.getHours();
|
|
determineBlogMessage(localHours);
|
|
}, 60000);
|