fevela homepage update

This commit is contained in:
2025-11-19 13:34:55 -05:00
parent 2c81078e77
commit 5a56ab5aa0
2 changed files with 143 additions and 124 deletions

View File

@@ -14,7 +14,7 @@ const links = [
"https://nosotros.btcforplebs.com", "https://nosotros.btcforplebs.com",
"https://mint.btcforplebs.com", "https://mint.btcforplebs.com",
"https://cashu.btcforplebs.com", "https://cashu.btcforplebs.com",
"https://shipyard.btcforplebs.com", "https://fevela.btcforplebs.com",
"https://live.btcforplebs.com", "https://live.btcforplebs.com",
"https://nsec.btcforplebs.com", "https://nsec.btcforplebs.com",
"https://flotilla.btcforplebs.com", "https://flotilla.btcforplebs.com",
@@ -23,17 +23,17 @@ const links = [
]; ];
// Optional: Only allow internal requests if you're not exposing this publicly // Optional: Only allow internal requests if you're not exposing this publicly
app.use((req, res, next) => { app.use((req, res, next) => {
const origin = req.headers.origin || 'unknown'; const origin = req.headers.origin || 'unknown';
console.log(`Request: ${req.method} ${req.url} | Origin: ${origin}`); console.log(`Request: ${req.method} ${req.url} | Origin: ${origin}`);
res.header("Access-Control-Allow-Headers", "Content-Type"); res.header("Access-Control-Allow-Headers", "Content-Type");
res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Methods", "GET, OPTIONS"); res.header("Access-Control-Allow-Methods", "GET, OPTIONS");
if (req.method === 'OPTIONS') { if (req.method === 'OPTIONS') {
return res.sendStatus(200); return res.sendStatus(200);
} }
next(); next();
}); });
app.get("/", (req, res) => { app.get("/", (req, res) => {

View File

@@ -1,151 +1,170 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BTCforPlebs</title> <title>BTCforPlebs</title>
<!-- Meta Description --> <!-- Meta Description -->
<meta name="description" content="BTCforPlebs is a resource to help ordinary people learn about Bitcoin. Explore guides, tools, and resources to start your Bitcoin journey."> <meta name="description"
content="BTCforPlebs is a resource to help ordinary people learn about Bitcoin. Explore guides, tools, and resources to start your Bitcoin journey.">
<!-- Open Graph Meta Tags --> <!-- Open Graph Meta Tags -->
<meta property="og:title" content="BTCforPlebs"> <meta property="og:title" content="BTCforPlebs">
<meta property="og:description" content="A place to help ordinary people learn about Bitcoin"> <meta property="og:description" content="A place to help ordinary people learn about Bitcoin">
<meta property="og:image" content="images/thumb.jpeg"> <meta property="og:image" content="images/thumb.jpeg">
<meta property="og:url" content="https://btcforplebs.com"> <meta property="og:url" content="https://btcforplebs.com">
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:card" content="summary_large_image">
<!-- favicon --> <!-- favicon -->
<link rel="icon" href="images/favicon.png" type="image/png"> <link rel="icon" href="images/favicon.png" type="image/png">
<!-- scripts --> <!-- scripts -->
<script src="assets/js/scripts.js"></script> <script src="assets/js/scripts.js"></script>
<link rel="stylesheet" href="assets/css/main.css"> <link rel="stylesheet" href="assets/css/main.css">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png"> <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" rel="stylesheet">
</head> </head>
<body>
<!-- Bitcoin Price Banner -->
<div class="container"> <body>
<!-- Bitcoin Price Banner -->
<div class="container">
<h1>Welcome to BTCforPlebs</h1> <h1>Welcome to BTCforPlebs</h1>
<h3>A place to help ordinary people learn about Bitcoin</h3> <h3>A place to help ordinary people learn about Bitcoin</h3>
<img src="/images/btcforplebs_profile.gif" alt="Profile Picture" class="profile-picture"> <img src="/images/btcforplebs_profile.gif" alt="Profile Picture" class="profile-picture">
<!-- Learn Links (unchanged) --> <!-- Learn Links (unchanged) -->
<a href="/learn-bitcoin" class="button prefetch">Learn About Bitcoin</a> <a href="/learn-bitcoin" class="button prefetch">Learn About Bitcoin</a>
<a href="/learn-nostr" class="button prefetch">Learn About Nostr</a> <a href="/learn-nostr" class="button prefetch">Learn About Nostr</a>
<a href="/learn-cashu" class="button prefetch">Learn About Cashu</a> <a href="/learn-cashu" class="button prefetch">Learn About Cashu</a>
<a href="/bitcoin-and-the-bible" class="button prefetch">Bitcoin & The Bible</a> <a href="/bitcoin-and-the-bible" class="button prefetch">Bitcoin & The Bible</a>
<!-- Bitcoin Links --> <!-- Bitcoin Links -->
<button class="button" id="bitcoin-folder-btn" onclick="toggleFolder('folder2', 'bitcoin-folder-btn')">Use Bitcoin <span style="color: #F7931A;"></span></button> <button class="button" id="bitcoin-folder-btn" onclick="toggleFolder('folder2', 'bitcoin-folder-btn')">Use Bitcoin
<div class="links" id="folder2"> <span style="color: #F7931A;"></span></button>
<a href="https://lightning.btcforplebs.com" target="_blank" class="prefetch">Lightning <span class="status-emoji" data-url="https://lightning.btcforplebs.com"></span></a> <div class="links" id="folder2">
<a href="https://mempool.btcforplebs.com" target="_blank" class="prefetch">Mempool <span class="status-emoji" data-url="https://mempool.btcforplebs.com"></span></a> <a href="https://lightning.btcforplebs.com" target="_blank" class="prefetch">Lightning <span class="status-emoji"
<a href="https://bitfeed.live" class="prefetch">Bitfeed.Live ⚪️ </a> data-url="https://lightning.btcforplebs.com"></span></a>
<a href="https://hodl.camp" class="prefetch">Hodl.Camp ⚪️ </a> <a href="https://mempool.btcforplebs.com" target="_blank" class="prefetch">Mempool <span class="status-emoji"
<a href="https://bitview.space" class="prefetch">Bitview.Space ⚪️ </a> data-url="https://mempool.btcforplebs.com"></span></a>
</div> <a href="https://bitfeed.live" class="prefetch">Bitfeed.Live ⚪️ </a>
<a href="https://hodl.camp" class="prefetch">Hodl.Camp ⚪️ </a>
<a href="https://bitview.space" class="prefetch">Bitview.Space ⚪️ </a>
</div>
<!-- Nostr Links --> <!-- Nostr Links -->
<button class="button" id="nostr-folder-btn" onclick="toggleFolder('folder1', 'nostr-folder-btn')">Use Nostr <span style="color: #F7931A;"></span></button> <button class="button" id="nostr-folder-btn" onclick="toggleFolder('folder1', 'nostr-folder-btn')">Use Nostr <span
<div class="links" id="folder1"> style="color: #F7931A;"></span></button>
<a href="https://nsec.btcforplebs.com" target="_blank" class="prefetch">Nsec Bunker <span class="status-emoji" data-url="https://nsec.btcforplebs.com"></span></a> <div class="links" id="folder1">
<a href="https://bloom.btcforplebs.com" target="_blank" class="prefetch">Bloom <span class="status-emoji" data-url="https://bloom.btcforplebs.com"></span></a> <a href="https://nsec.btcforplebs.com" target="_blank" class="prefetch">Nsec Bunker <span class="status-emoji"
<a href="https://nostrudel.btcforplebs.com" target="_blank" class="prefetch">Nostrudel <span class="status-emoji" data-url="https://nostrudel.btcforplebs.com"></span></a> data-url="https://nsec.btcforplebs.com"></span></a>
<a href="https://nosotros.btcforplebs.com" target="_blank" class="prefetch">Nosotros <span class="status-emoji" data-url="https://nosotros.btcforplebs.com"></span></a> <a href="https://bloom.btcforplebs.com" target="_blank" class="prefetch">Bloom <span class="status-emoji"
<a href="https://flotilla.btcforplebs.com" target="_blank" class="prefetch">Flotilla <span class="status-emoji" data-url="https://flotilla.btcforplebs.com"></span></a> data-url="https://bloom.btcforplebs.com"></span></a>
<a href="https://Jumble.btcforplebs.com" target="_blank" class="prefetch">Jumble <span class="status-emoji" data-url="https://jumble.btcforplebs.com"></span></a> <a href="https://nostrudel.btcforplebs.com" target="_blank" class="prefetch">Nostrudel <span class="status-emoji"
<a href="https://shipyard.btcforplebs.com" target="_blank" class="prefetch">Shipyard <span class="status-emoji" data-url="https://shipyard.btcforplebs.com"></span></a> data-url="https://nostrudel.btcforplebs.com"></span></a>
<a href="/relay" target="_blank" class="prefetch">Relay <span class="status-emoji" data-url="https://relay.btcforplebs.com"></span></a> <a href="https://nosotros.btcforplebs.com" target="_blank" class="prefetch">Nosotros <span class="status-emoji"
<a href="https://nostrapps.com" target="_blank">NostrApps.com ⚪️ </a> data-url="https://nosotros.btcforplebs.com"></span></a>
</div> <a href="https://flotilla.btcforplebs.com" target="_blank" class="prefetch">Flotilla <span class="status-emoji"
data-url="https://flotilla.btcforplebs.com"></span></a>
<a href="https://jumble.btcforplebs.com" target="_blank" class="prefetch">Jumble <span class="status-emoji"
data-url="https://jumble.btcforplebs.com"></span></a>
<a href="https://fevela.btcforplebs.com" target="_blank" class="prefetch">Fevela <span class="status-emoji"
data-url="https://fevela.btcforplebs.com"></span></a>
<a href="/relay" target="_blank" class="prefetch">Relay <span class="status-emoji"
data-url="https://relay.btcforplebs.com"></span></a>
<a href="https://nostrapps.com" target="_blank">NostrApps.com ⚪️ </a>
</div>
<!-- Cashu Links --> <!-- Cashu Links -->
<button class="button" id="cashu-folder-btn" onclick="toggleFolder('folder3', 'cashu-folder-btn')">Use Cashu <span style="color: #F7931A;"></span></button> <button class="button" id="cashu-folder-btn" onclick="toggleFolder('folder3', 'cashu-folder-btn')">Use Cashu <span
<div class="links" id="folder3"> style="color: #F7931A;"></span></button>
<a href="https://cashu.btcforplebs.com" class="prefetch">Cashu Wallet Web App <span class="status-emoji" data-url="https://cashu.btcforplebs.com"></span></a> <div class="links" id="folder3">
<a href="https://nutstash.btcforplebs.com" class="prefetch">Nutstash Wallet Web App <span class="status-emoji" data-url="https://nutstash.btcforplebs.com"></span></a> <a href="https://cashu.btcforplebs.com" class="prefetch">Cashu Wallet Web App <span class="status-emoji"
<a href="/mint" class="prefetch">Cashu Mint <span class="status-emoji" data-url="https://mint.btcforplebs.com"></span></a> data-url="https://cashu.btcforplebs.com"></span></a>
<a href="https://macadamia.cash" class="prefetch">Macadamia (iOS) ⚪️ </a> <a href="https://nutstash.btcforplebs.com" class="prefetch">Nutstash Wallet Web App <span class="status-emoji"
<a href="https://minibits.cash" class="prefetch">Minibits (Android) ⚪️ </a> data-url="https://nutstash.btcforplebs.com"></span></a>
</div> <a href="/mint" class="prefetch">Cashu Mint <span class="status-emoji"
data-url="https://mint.btcforplebs.com"></span></a>
<a href="https://macadamia.cash" class="prefetch">Macadamia (iOS) ⚪️ </a>
<a href="https://minibits.cash" class="prefetch">Minibits (Android) ⚪️ </a>
</div>
<a href="https://live.btcforplebs.com" class="button" class="prefetch">BTCforPlebs Live <span class="status-emoji" data-url="https://live.btcforplebs.com"></span></a> <a href="https://live.btcforplebs.com" class="button" class="prefetch">BTCforPlebs Live <span class="status-emoji"
<br></br> data-url="https://live.btcforplebs.com"></span></a>
<br></br>
<small>🟢 = online | 🔴 = offline | ⚪️ = external site</small> <small>🟢 = online | 🔴 = offline | ⚪️ = external site</small>
<br></br> <br></br>
</div> </div>
<script src="https://btcforplebs.com/nostr-chat-widget.js" <script src="https://btcforplebs.com/nostr-chat-widget.js"
data-nostr-pubkey="75462f4dece4fbde54a535cfa09eb0d329bda090a9c2f9ed6b5f9d1d2fb6c15b" data-nostr-pubkey="75462f4dece4fbde54a535cfa09eb0d329bda090a9c2f9ed6b5f9d1d2fb6c15b"
data-brand-name="Chat with BTCforPlebs" data-brand-name="Chat with BTCforPlebs" data-color="#fdad01" data-color-secondary="#222222">
data-color="#fdad01" </script>
data-color-secondary="#222222">
</script>
<script>
// emoji status fetcher
document.addEventListener('DOMContentLoaded', init);
const apiEndpoint = "/api/link-status"; <script>
// emoji status fetcher
document.addEventListener('DOMContentLoaded', init);
async function init() { const apiEndpoint = "/api/link-status";
try {
console.log("🔄 Fetching statuses from:", apiEndpoint);
const response = await fetch(apiEndpoint);
const statuses = await response.json();
console.log("✅ Received statuses:", statuses);
document.querySelectorAll(".status-emoji[data-url]").forEach(span => { async function init() {
const url = span.dataset.url; try {
console.log("🔍 Checking span for:", url); console.log("🔄 Fetching statuses from:", apiEndpoint);
const response = await fetch(apiEndpoint);
const statuses = await response.json();
console.log("✅ Received statuses:", statuses);
if (!url) { document.querySelectorAll(".status-emoji[data-url]").forEach(span => {
console.warn("⚠️ Span missing data-url:", span); const url = span.dataset.url;
return; console.log("🔍 Checking span for:", url);
}
const status = statuses[url]; if (!url) {
console.warn("⚠️ Span missing data-url:", span);
return;
}
if (!status) { const status = statuses[url];
console.warn(`⚠️ No status found in JSON for: ${url}`);
} else { if (!status) {
const emoji = status === "online" ? "🟢" : "🔴"; console.warn(`⚠️ No status found in JSON for: ${url}`);
console.log(`${url} is ${status}, setting emoji: ${emoji}`); } else {
span.textContent = `${emoji} `; const emoji = status === "online" ? "🟢" : "🔴";
span.style.display = 'inline-block'; console.log(`${url} is ${status}, setting emoji: ${emoji}`);
} span.textContent = `${emoji} `;
}); span.style.display = 'inline-block';
} catch (error) { }
console.error("❌ Error fetching or processing statuses:", error); });
} catch (error) {
console.error("❌ Error fetching or processing statuses:", error);
}
} }
} </script>
</script>
<script> <script>
// Toggle folders // Toggle folders
function toggleFolder(folderId, buttonId) { function toggleFolder(folderId, buttonId) {
const folder = document.getElementById(folderId); const folder = document.getElementById(folderId);
const button = document.getElementById(buttonId); const button = document.getElementById(buttonId);
if (!folder || !button) return; if (!folder || !button) return;
if (folder.style.display === "none" || folder.style.display === "") { if (folder.style.display === "none" || folder.style.display === "") {
folder.style.display = "block"; folder.style.display = "block";
button.innerHTML = button.innerHTML.replace("←", "↓"); button.innerHTML = button.innerHTML.replace("←", "↓");
} else { } else {
folder.style.display = "none"; folder.style.display = "none";
button.innerHTML = button.innerHTML.replace("↓", "←"); button.innerHTML = button.innerHTML.replace("↓", "←");
}
} }
} </script>
</script>
<div id="footer"></div> <div id="footer"></div>
</body> </body>
</html> </html>