Spaces:
Running
Running
| // Fetch and display podcast episodes from RSS feed | |
| document.addEventListener('DOMContentLoaded', function() { | |
| fetchEpisodes(); | |
| }); | |
| async function fetchEpisodes() { | |
| try { | |
| const response = await fetch('https://anchor.fm/s/10a42cdbc/podcast/rss'); | |
| const text = await response.text(); | |
| const parser = new DOMParser(); | |
| const xmlDoc = parser.parseFromString(text, "text/xml"); | |
| const items = xmlDoc.getElementsByTagName("item"); | |
| const episodesContainer = document.querySelector('#episodes-container'); | |
| // Clear placeholder content | |
| episodesContainer.innerHTML = ''; | |
| // Display latest 3 episodes | |
| for (let i = 0; i < Math.min(3, items.length); i++) { | |
| const item = items[i]; | |
| const title = item.getElementsByTagName("title")[0].textContent; | |
| const description = item.getElementsByTagName("description")[0].textContent; | |
| const pubDate = new Date(item.getElementsByTagName("pubDate")[0].textContent); | |
| const enclosure = item.getElementsByTagName("enclosure")[0]; | |
| const duration = item.getElementsByTagName("itunes:duration")[0].textContent; | |
| const episodeDiv = document.createElement('div'); | |
| episodeDiv.className = 'bg-gray-800 border border-gray-700 rounded-xl overflow-hidden transition-transform hover:scale-[1.02]'; | |
| episodeDiv.innerHTML = ` | |
| <div class="h-48 bg-gradient-to-r from-${i % 3 === 0 ? 'primary to-secondary' : i % 3 === 1 ? 'secondary to-accent' : 'accent to-primary'} flex items-center justify-center"> | |
| <i data-feather="play" class="w-12 h-12 text-white"></i> | |
| </div> | |
| <div class="p-5"> | |
| <h4 class="font-bold text-lg mb-2">${title}</h4> | |
| <p class="text-gray-400 text-sm mb-4">${description.substring(0, 100)}${description.length > 100 ? '...' : ''}</p> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span>${formatDuration(duration)}</span> | |
| <span>${pubDate.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}</span> | |
| </div> | |
| </div> | |
| `; | |
| episodesContainer.appendChild(episodeDiv); | |
| } | |
| feather.replace(); | |
| } catch (error) { | |
| console.error('Error fetching podcast episodes:', error); | |
| } | |
| } | |
| function formatDuration(seconds) { | |
| if (!seconds) return 'N/A'; | |
| if (seconds.includes(':')) return seconds; // Already formatted | |
| const secs = parseInt(seconds); | |
| const mins = Math.floor(secs / 60); | |
| const remainingSecs = secs % 60; | |
| return `${mins}:${remainingSecs < 10 ? '0' : ''}${remainingSecs}`; | |
| } |