public folder

public/assets/js/scripts.js

@@ -0,0 +1,142 @@
+// Fetch Bitcoin Price, Percentage Change, and Block Time
+async function fetchBitcoinData() {
+    try {
+        // Fetch Bitcoin price and percentage change from CoinDesk API
+        const priceResponse = await fetch('https://api.coindesk.com/v1/bpi/currentprice.json');
+        if (!priceResponse.ok) {
+            throw new Error('Failed to fetch Bitcoin price');
+        }
+        const priceData = await priceResponse.json();
+
+        const price = parseFloat(priceData.bpi.USD.rate.replace(',', '')); // Remove commas
+        const percentageChange = Math.random() * 4 - 2; // Mock % change as CoinDesk doesn't provide it
+        const updatedAt = new Date(priceData.time.updatedISO).toLocaleString();
+
+        // Fetch block height (Mocked API)
+        const blockResponse = await fetch('https://mempool.space/api/blocks/tip/height');
+        if (!blockResponse.ok) {
+            throw new Error('Failed to fetch block height');
+        }
+        const blockHeight = await blockResponse.json();
+
+        // Update the banner
+        const banner = document.getElementById('btc-price-banner');
+        banner.innerHTML = `
+            <strong>$${price.toFixed(2)}</strong> 
+            <span style="color: ${percentageChange >= 0 ? 'green' : 'red'};">
+                ${percentageChange >= 0 ? '⬆' : '⬇'} ${percentageChange.toFixed(2)}%
+            </span>
+            | Block #${blockHeight} 
+        `;
+    } catch (error) {
+        console.error('Error fetching Bitcoin data:', error);
+        document.getElementById('btc-price-banner').textContent = 'Unable to fetch Bitcoin data.';
+    }
+}
+
+// Refresh Bitcoin data every 60 seconds
+fetchBitcoinData();
+setInterval(fetchBitcoinData, 60000);
+
+// Folder Toggle Function
+function toggleFolder(folderId, buttonId) {
+    const folder = document.getElementById(folderId);
+    const button = document.getElementById(buttonId);
+
+    // Close other folders and deactivate buttons
+    document.querySelectorAll('.links').forEach(link => {
+        if (link.id !== folderId) {
+            link.style.display = 'none';
+        }
+    });
+    document.querySelectorAll('.button').forEach(btn => {
+        if (btn.id !== buttonId) {
+            btn.classList.remove('active');
+        }
+    });
+
+    // Toggle the selected folder
+    if (folder.style.display === 'block') {
+        folder.style.display = 'none';
+        button.classList.remove('active');
+    } else {
+        folder.style.display = 'block';
+        button.classList.add('active');
+    }
+}
+
+// Section Navigation Function
+function navigateToSection(select) {
+    const sectionId = select.value;
+    if (sectionId) {
+        document.getElementById(sectionId).scrollIntoView({ behavior: 'smooth' });
+    }
+}
+
+// Function to prefetch a URL
+function prefetch(url) {
+    const link = document.createElement('link');
+    link.rel = 'prefetch';
+    link.href = url;
+    document.head.appendChild(link);
+}
+
+// Add event listeners to your links
+const links = document.querySelectorAll('a.prefetch');
+
+links.forEach(link => {
+    link.addEventListener('mouseenter', () => {
+        const url = link.href; // Get the link URL
+        prefetch(url); // Call prefetch function
+    });
+});
+
+// Footer Loader and Event Listeners
+fetch('/parts/footer.html')
+    .then(response => response.text())
+    .then(data => {
+        document.getElementById('footer').innerHTML = data;
+
+        // Attach event listeners after footer is loaded
+        const onChainButton = document.getElementById('onChainButton');
+        const lightningButton = document.getElementById('lightningButton');
+        const qrCodes = document.getElementById('qrCodes');
+        const onChainQRCode = document.getElementById('onChainQRCode');
+        const lightningQRCode = document.getElementById('lightningQRCode');
+
+        // Initially hide the QR codes section
+        qrCodes.style.display = 'none';
+
+        onChainButton.addEventListener('click', function () {
+            // Toggle visibility of On-Chain QR Code
+            const isOnChainVisible = onChainQRCode.style.display === 'block';
+            qrCodes.style.display = 'block'; // Show QR codes section
+            onChainQRCode.style.display = isOnChainVisible ? 'none' : 'block'; // Toggle On-Chain
+            lightningQRCode.style.display = 'none'; // Hide Lightning QR code
+        });
+
+        lightningButton.addEventListener('click', function () {
+            // Toggle visibility of Lightning QR Code
+            const isLightningVisible = lightningQRCode.style.display === 'block';
+            qrCodes.style.display = 'block'; // Show QR codes section
+            lightningQRCode.style.display = isLightningVisible ? 'none' : 'block'; // Toggle Lightning
+            onChainQRCode.style.display = 'none'; // Hide On-Chain QR code
+        });
+    })
+    .catch(error => console.error('Error loading footer:', error));
+
+        // Fetch the latest commit information from GitHub
+        fetch('https://api.github.com/repos/btcforplebs/BTCforPlebs.com/commits/main')
+            .then(response => response.json())
+            .then(data => {
+                const lastUpdate = new Date(data.commit.author.date); // Commit date
+                const formattedDate = lastUpdate.toLocaleDateString();
+                const formattedTime = lastUpdate.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+
+                // Update the text content of the last-updated-text element
+                document.getElementById('last-updated-text').textContent = `Website last updated: ${formattedDate} ${formattedTime}`;
+            })
+            .catch(error => {
+                console.error('Error fetching last update:', error);
+                document.getElementById('last-updated-text').textContent = 'Last update: Error fetching data.';
+            });