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

View File

@@ -1,151 +1,170 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BTCforPlebs</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BTCforPlebs</title>
<!-- 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 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.">
<!-- Open Graph Meta Tags -->
<meta property="og:title" content="BTCforPlebs">
<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:url" content="https://btcforplebs.com">
<meta name="twitter:card" content="summary_large_image">
<!-- Open Graph Meta Tags -->
<meta property="og:title" content="BTCforPlebs">
<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:url" content="https://btcforplebs.com">
<meta name="twitter:card" content="summary_large_image">
<!-- favicon -->
<link rel="icon" href="images/favicon.png" type="image/png">
<!-- favicon -->
<link rel="icon" href="images/favicon.png" type="image/png">
<!-- scripts -->
<script src="assets/js/scripts.js"></script>
<link rel="stylesheet" href="assets/css/main.css">
<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">
<!-- scripts -->
<script src="assets/js/scripts.js"></script>
<link rel="stylesheet" href="assets/css/main.css">
<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">
</head>
<body>
<!-- Bitcoin Price Banner -->
<div class="container">
<body>
<!-- Bitcoin Price Banner -->
<div class="container">
<h1>Welcome to BTCforPlebs</h1>
<h3>A place to help ordinary people learn about Bitcoin</h3>
<img src="/images/btcforplebs_profile.gif" alt="Profile Picture" class="profile-picture">
<!-- Learn Links (unchanged) -->
<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-cashu" class="button prefetch">Learn About Cashu</a>
<a href="/bitcoin-and-the-bible" class="button prefetch">Bitcoin & The Bible</a>
<!-- Learn Links (unchanged) -->
<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-cashu" class="button prefetch">Learn About Cashu</a>
<a href="/bitcoin-and-the-bible" class="button prefetch">Bitcoin & The Bible</a>
<!-- Bitcoin Links -->
<button class="button" id="bitcoin-folder-btn" onclick="toggleFolder('folder2', 'bitcoin-folder-btn')">Use Bitcoin <span style="color: #F7931A;"></span></button>
<div class="links" id="folder2">
<a href="https://lightning.btcforplebs.com" target="_blank" class="prefetch">Lightning <span class="status-emoji" data-url="https://lightning.btcforplebs.com"></span></a>
<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://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>
<!-- Bitcoin Links -->
<button class="button" id="bitcoin-folder-btn" onclick="toggleFolder('folder2', 'bitcoin-folder-btn')">Use Bitcoin
<span style="color: #F7931A;"></span></button>
<div class="links" id="folder2">
<a href="https://lightning.btcforplebs.com" target="_blank" class="prefetch">Lightning <span class="status-emoji"
data-url="https://lightning.btcforplebs.com"></span></a>
<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://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 -->
<button class="button" id="nostr-folder-btn" onclick="toggleFolder('folder1', 'nostr-folder-btn')">Use Nostr <span style="color: #F7931A;"></span></button>
<div class="links" id="folder1">
<a href="https://nsec.btcforplebs.com" target="_blank" class="prefetch">Nsec Bunker <span class="status-emoji" data-url="https://nsec.btcforplebs.com"></span></a>
<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://nostrudel.btcforplebs.com" target="_blank" class="prefetch">Nostrudel <span class="status-emoji" data-url="https://nostrudel.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://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://shipyard.btcforplebs.com" target="_blank" class="prefetch">Shipyard <span class="status-emoji" data-url="https://shipyard.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>
<!-- Nostr Links -->
<button class="button" id="nostr-folder-btn" onclick="toggleFolder('folder1', 'nostr-folder-btn')">Use Nostr <span
style="color: #F7931A;"></span></button>
<div class="links" id="folder1">
<a href="https://nsec.btcforplebs.com" target="_blank" class="prefetch">Nsec Bunker <span class="status-emoji"
data-url="https://nsec.btcforplebs.com"></span></a>
<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://nostrudel.btcforplebs.com" target="_blank" class="prefetch">Nostrudel <span class="status-emoji"
data-url="https://nostrudel.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://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 -->
<button class="button" id="cashu-folder-btn" onclick="toggleFolder('folder3', 'cashu-folder-btn')">Use Cashu <span style="color: #F7931A;"></span></button>
<div class="links" id="folder3">
<a href="https://cashu.btcforplebs.com" class="prefetch">Cashu Wallet Web App <span class="status-emoji" data-url="https://cashu.btcforplebs.com"></span></a>
<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="/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>
<!-- Cashu Links -->
<button class="button" id="cashu-folder-btn" onclick="toggleFolder('folder3', 'cashu-folder-btn')">Use Cashu <span
style="color: #F7931A;"></span></button>
<div class="links" id="folder3">
<a href="https://cashu.btcforplebs.com" class="prefetch">Cashu Wallet Web App <span class="status-emoji"
data-url="https://cashu.btcforplebs.com"></span></a>
<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="/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>
<br></br>
<a href="https://live.btcforplebs.com" class="button" class="prefetch">BTCforPlebs Live <span class="status-emoji"
data-url="https://live.btcforplebs.com"></span></a>
<br></br>
<small>🟢 = online | 🔴 = offline | ⚪️ = external site</small>
<br></br>
<small>🟢 = online | 🔴 = offline | ⚪️ = external site</small>
<br></br>
</div>
<script src="https://btcforplebs.com/nostr-chat-widget.js"
data-nostr-pubkey="75462f4dece4fbde54a535cfa09eb0d329bda090a9c2f9ed6b5f9d1d2fb6c15b"
data-brand-name="Chat with BTCforPlebs"
data-color="#fdad01"
data-color-secondary="#222222">
</script>
<script>
// emoji status fetcher
document.addEventListener('DOMContentLoaded', init);
<script src="https://btcforplebs.com/nostr-chat-widget.js"
data-nostr-pubkey="75462f4dece4fbde54a535cfa09eb0d329bda090a9c2f9ed6b5f9d1d2fb6c15b"
data-brand-name="Chat with BTCforPlebs" data-color="#fdad01" data-color-secondary="#222222">
</script>
const apiEndpoint = "/api/link-status";
<script>
// emoji status fetcher
document.addEventListener('DOMContentLoaded', init);
async function init() {
try {
console.log("🔄 Fetching statuses from:", apiEndpoint);
const response = await fetch(apiEndpoint);
const statuses = await response.json();
console.log("✅ Received statuses:", statuses);
const apiEndpoint = "/api/link-status";
document.querySelectorAll(".status-emoji[data-url]").forEach(span => {
const url = span.dataset.url;
console.log("🔍 Checking span for:", url);
async function init() {
try {
console.log("🔄 Fetching statuses from:", apiEndpoint);
const response = await fetch(apiEndpoint);
const statuses = await response.json();
console.log("✅ Received statuses:", statuses);
if (!url) {
console.warn("⚠️ Span missing data-url:", span);
return;
}
document.querySelectorAll(".status-emoji[data-url]").forEach(span => {
const url = span.dataset.url;
console.log("🔍 Checking span for:", url);
const status = statuses[url];
if (!url) {
console.warn("⚠️ Span missing data-url:", span);
return;
}
if (!status) {
console.warn(`⚠️ No status found in JSON for: ${url}`);
} else {
const emoji = status === "online" ? "🟢" : "🔴";
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);
const status = statuses[url];
if (!status) {
console.warn(`⚠️ No status found in JSON for: ${url}`);
} else {
const emoji = status === "online" ? "🟢" : "🔴";
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);
}
}
}
</script>
</script>
<script>
// Toggle folders
function toggleFolder(folderId, buttonId) {
const folder = document.getElementById(folderId);
const button = document.getElementById(buttonId);
if (!folder || !button) return;
<script>
// Toggle folders
function toggleFolder(folderId, buttonId) {
const folder = document.getElementById(folderId);
const button = document.getElementById(buttonId);
if (!folder || !button) return;
if (folder.style.display === "none" || folder.style.display === "") {
if (folder.style.display === "none" || folder.style.display === "") {
folder.style.display = "block";
button.innerHTML = button.innerHTML.replace("←", "↓");
} else {
} else {
folder.style.display = "none";
button.innerHTML = button.innerHTML.replace("↓", "←");
}
}
}
</script>
</script>
<div id="footer"></div>
<div id="footer"></div>
</body>
</html>