Skip to content

Instantly share code, notes, and snippets.

@Specnr
Created February 17, 2025 17:18
Show Gist options
  • Select an option

  • Save Specnr/77e0cb6f737d5f535e440b8d2c8e2da1 to your computer and use it in GitHub Desktop.

Select an option

Save Specnr/77e0cb6f737d5f535e440b8d2c8e2da1 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Seedwave OBS Overlay</title>
<style>
body {
margin: 0;
padding: 0;
background: transparent;
font-family: 'Minecraft', sans-serif;
color: white;
text-align: left;
font-size: 36px;
overflow: hidden;
}
#seedwave {
font-size: 48px;
}
#bloodseed {
font-size: 36px;
}
#seedwave-number {
font-weight: bold;
}
#time-remaining {
font-size: 32px;
}
.green { color: #00FF00; }
.yellow { color: #FFFF00; }
.orange { color: #FFA500; }
.red { color: #FF0000; }
.purple { color: #800080; }
</style>
</head>
<body>
<div id="seedwave">
<span id="seedwave-text">Seedwave: </span>
<span id="seedwave-number"></span><span id="bloodseed"></span>
</div>
<!-- <span id="time-remaining"></span> -->
<script>
function getLevelColorClass(level) {
if (level <= 3) return 'green';
if (level <= 6) return 'yellow';
if (level <= 8) return 'orange';
if (level === 9) return 'red';
return 'purple';
}
function updateCountdown(expiresAt) {
const countdownElement = document.getElementById("time-remaining");
function update() {
const timeLeft = expiresAt - Date.now();
if (timeLeft <= 0) {
countdownElement.textContent = "Expired";
return;
}
const hours = Math.floor(timeLeft / 3600000);
const minutes = Math.floor((timeLeft % 3600000) / 60000);
const seconds = Math.floor((timeLeft % 60000) / 1000);
countdownElement.textContent = `${hours}h ${minutes}m ${seconds}s`;
}
update();
setInterval(update, 1000);
}
async function fetchSeedwaveData() {
try {
const response = await fetch('https://seedwave.vercel.app/api/seedwave'); // API URL
const data = await response.json();
// Update the overlay with the current seedwave data
const seedwaveNumberElement = document.getElementById("seedwave-number");
const seedwaveLevel = data.seedwave;
seedwaveNumberElement.textContent = seedwaveLevel;
seedwaveNumberElement.className = getLevelColorClass(seedwaveLevel);
if (data.isBloodseed) {
seedwaveNumberElement.className = "red"
document.getElementById("seedwave-text").className = "red";
document.getElementById("bloodseed").textContent = "🩸";
}
// Update the remaining time countdown
// updateCountdown(data.expiresAt);
} catch (error) {
console.error("Error fetching seedwave data:", error);
document.getElementById("seedwave-number").textContent = "Error";
document.getElementById("next-seedwave-text").textContent = "Error loading data";
}
}
// Initial fetch and periodic updates every 5 minutes
fetchSeedwaveData();
setInterval(fetchSeedwaveData, 600000); // Update every 5 minutes
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment