https://wcyt.org/podcasts

1<!doctype html>
2<html lang="en-US">
3<head>
4  <meta charset="utf-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1">
6  <title>Podcasts &mdash; The Point 91 FM &middot; WCYT</title>
7  <meta name="description" content="Listen to student-made programs and sportscasts from The Point 91 FM — WCYT at Homestead High School.">
8  <link rel="icon" type="image/x-icon" href="/images/squarespace/favicon.ico">
9  <link rel="preconnect" href="https://fonts.googleapis.com">
10  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
11  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap">
12
13  <style>
14    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
15
16    :root {
17      --black:  #0d0d0d;
18      --dark:   #111111;
19      --mid:    #1a1a1a;
20      --border: #222222;
21      --accent: #c8102e;
22      --muted:  #888888;
23      --white:  #ffffff;
24      --font:   'Space Grotesk', sans-serif;
25    }
26
27    html { font-family: var(--font); background: var(--black); color: var(--white); }
28    body { min-height: 100vh; display: flex; flex-direction: column; }
29    a    { color: inherit; text-decoration: none; }
30
31    /* ── Nav ── */
32    .site-nav {
33      background: var(--black);
34      display: flex;
35      align-items: center;
36      justify-content: space-between;
37      padding: 0 32px;
38      height: 64px;
39      position: sticky;
40      top: 0;
41      z-index: 100;
42      border-bottom: 1px solid #1a1a1a;
43    }
44    .site-nav-logo img { height: 36px; display: block; }
45    .site-nav-back {
46      color: #aaa;
47      font-size: 13px;
48      font-weight: 500;
49      letter-spacing: 0.04em;
50      display: flex;
51      align-items: center;
52      gap: 6px;
53      transition: color .2s;
54    }
55    .site-nav-back:hover { color: var(--white); }
56    .site-nav-back svg { width: 14px; height: 14px; }
57
58    /* ── Page header ── */
59    .page-header {
60      background: var(--black);
61      color: var(--white);
62      padding: 48px 32px 40px;
63      border-bottom: 3px solid var(--accent);
64    }
65    .page-header-eyebrow {
66      font-size: 11px;
67      font-weight: 600;
68      letter-spacing: 0.15em;
69      text-transform: uppercase;
70      color: #aaa;
71      margin-bottom: 8px;
72    }
73    .page-header h1 {
74      font-size: clamp(28px, 5vw, 48px);
75      font-weight: 700;
76      line-height: 1.1;
77    }
78    .page-header h1 strong { color: var(--accent); }
79    .page-header-note {
80      margin-top: 10px;
81      font-size: 13px;
82      color: #888;
83    }
84
85    /* ── Main ── */
86    .podcasts-main {
87      flex: 1;
88      max-width: 860px;
89      width: 100%;
90      margin: 0 auto;
91      padding: 48px 24px 80px;
92    }
93
94    /* ── Subscribe strip ── */
95    .subscribe-strip {
96      display: flex;
97      flex-wrap: wrap;
98      align-items: center;
99      gap: 10px;
100      margin-bottom: 40px;
101    }
102    .subscribe-label {
103      font-size: 11px;
104      font-weight: 700;
105      letter-spacing: 0.12em;
106      text-transform: uppercase;
107      color: var(--muted);
108      margin-right: 4px;
109    }
110    .platform-btn {
111      display: inline-flex;
112      align-items: center;
113      gap: 8px;
114      padding: 8px 16px;
115      background: var(--mid);
116      border: 1px solid var(--border);
117      border-radius: 8px;
118      font-size: 13px;
119      font-weight: 600;
120      color: var(--white);
121      transition: border-color .2s, background .2s, transform .15s;
122    }
123    .platform-btn:hover {
124      border-color: var(--accent);
125      background: #222;
126      transform: translateY(-2px);
127    }
128    .platform-btn svg {
129      width: 18px;
130      height: 18px;
131      flex-shrink: 0;
132    }
133
134    /* ── Section heading ── */
135    .section-heading {
136      font-size: 11px;
137      font-weight: 700;
138      letter-spacing: 0.15em;
139      text-transform: uppercase;
140      color: var(--muted);
141      border-bottom: 1px solid var(--border);
142      padding-bottom: 12px;
143      margin-bottom: 24px;
144    }
145
146    /* ── Latest episode (featured) ── */
147    .featured-episode {
148      background: var(--mid);
149      border: 1px solid var(--border);
150      border-left: 3px solid var(--accent);
151      border-radius: 12px;
152      padding: 24px;
153      display: flex;
154      gap: 20px;
155      align-items: flex-start;
156      margin-bottom: 40px;
157    }
158    .featured-art {
159      flex-shrink: 0;
160      width: 100px;
161      height: 100px;
162      border-radius: 8px;
163      object-fit: cover;
164      background: #333;
165    }
166    .featured-info { min-width: 0; }
167    .featured-badge {
168      font-size: 10px;
169      font-weight: 700;
170      letter-spacing: 0.12em;
171      text-transform: uppercase;
172      color: var(--accent);
173      margin-bottom: 6px;
174    }
175    .featured-title {
176      font-size: 18px;
177      font-weight: 700;
178      line-height: 1.3;
179      margin-bottom: 6px;
180    }
181    .featured-date {
182      font-size: 12px;
183      color: var(--muted);
184      margin-bottom: 10px;
185    }
186    .featured-desc {
187      font-size: 13px;
188      color: #bbb;
189      line-height: 1.6;
190      display: -webkit-box;
191      -webkit-line-clamp: 2;
192      -webkit-box-orient: vertical;
193      overflow: hidden;
194      margin-bottom: 16px;
195    }
196    .listen-btn {
197      display: inline-flex;
198      align-items: center;
199      gap: 6px;
200      padding: 9px 18px;
201      background: var(--accent);
202      color: var(--white);
203      border-radius: 6px;
204      font-size: 13px;
205      font-weight: 700;
206      transition: background .2s, transform .15s;
207    }
208    .listen-btn:hover { background: #a50d26; transform: translateY(-1px); }
209
210    /* ── Episode list ── */
211    .episode-list {
212      display: flex;
213      flex-direction: column;
214      gap: 12px;
215      margin-bottom: 48px;
216    }
217    .episode-card {
218      display: flex;
219      align-items: center;
220      gap: 16px;
221      padding: 16px;
222      background: var(--mid);
223      border: 1px solid var(--border);
224      border-radius: 10px;
225      transition: border-color .2s, transform .15s;
226    }
227    .episode-card:hover {
228      border-color: #444;
229      transform: translateY(-1px);
230    }
231    .episode-art {
232      flex-shrink: 0;
233      width: 60px;
234      height: 60px;
235      border-radius: 6px;
236      object-fit: cover;
237      background: #333;
238    }
239    .episode-info { flex: 1; min-width: 0; }
240    .episode-title {
241      font-size: 14px;
242      font-weight: 700;
243      line-height: 1.3;
244      margin-bottom: 4px;
245      white-space: nowrap;
246      overflow: hidden;
247      text-overflow: ellipsis;
248    }
249    .episode-date {
250      font-size: 12px;
251      color: var(--muted);
252    }
253    .episode-listen {
254      flex-shrink: 0;
255      font-size: 12px;
256      font-weight: 700;
257      color: var(--accent);
258      white-space: nowrap;
259      padding: 6px 12px;
260      border: 1px solid var(--accent);
261      border-radius: 6px;
262      transition: background .2s, color .2s;
263    }

264    .episode-listen:hover { background: var(--accent); color: var(--white); }
265
266    /* ── Loading / error ── */
267    .ep-loading, .ep-error {
268      color: var(--muted);
269      font-size: 14px;
270      padding: 24px 0;
271    }
272
273    /* ── Footer ── */
274    .site-footer {
275      background: var(--black);
276      color: #444;
277      text-align: center;
278      padding: 24px;
279      font-size: 12px;
280      border-top: 1px solid #1a1a1a;
281    }
282    .site-footer a { color: #666; }
283    .site-footer a:hover { color: #aaa; }
284
285    @media (max-width: 600px) {
286      .site-nav { padding: 0 20px; }
287      .page-header { padding: 32px 20px 28px; }
288      .podcasts-main { padding: 32px 16px 60px; }
289      .featured-episode { flex-direction: column; }
290      .featured-art { width: 80px; height: 80px; }
291      .episode-listen { display: none; }
292    }
293  </style>
294</head>
295
296<body>
297
298  <nav class="site-nav">
299    <a class="site-nav-logo" href="/" aria-label="The Point 91 FM – Home">
300      <img src="/images/squarespace/WCYT-removebg-preview.png" alt="WCYT The Point 91 FM">
301    </a>
302    <a class="site-nav-back" href="/">
303      <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 12L6 8l4-4"/></svg>
304      Back to site
305    </a>
306  </nav>
307
308  <header class="page-header">
309    <div class="page-header-eyebrow">The Point 91 FM &middot; WCYT</div>
310    <h1>Our <strong>Podcasts</strong></h1>
311    <p class="page-header-note">Student-made programs and sportscasts from Homestead High School.</p>
312  </header>
313
314  <main class="podcasts-main">
315
316    <!-- Subscribe strip -->
317    <div class="subscribe-strip">
318      <span class="subscribe-label">Listen on</span>
319
320      <a class="platform-btn" href="https://open.spotify.com/show/7g9PiMxCO93XMKJzLkLu7D" target="_blank" rel="noopener">
321        <svg viewBox="0 0 24 24" fill="#1DB954"><path d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z"/></svg>
322        Spotify
323      </a>
324
325      <a class="platform-btn" href="https://itunes.apple.com/us/podcast/wcyt-student-productions/id1354627392" target="_blank" rel="noopener">
326        <svg viewBox="0 0 24 24" fill="#fff"><path d="M18.77 11.085c-.03-3.3 2.694-4.89 2.817-4.965-1.532-2.244-3.921-2.55-4.773-2.58-2.025-.207-3.963 1.2-4.995 1.2-1.035 0-2.625-1.17-4.32-1.14-2.214.033-4.263 1.29-5.4 3.27-2.31 4.005-.591 9.945 1.65 13.2 1.098 1.59 2.4 3.375 4.125 3.315 1.65-.06 2.28-1.065 4.275-1.065 1.995 0 2.565 1.065 4.32 1.035 1.785-.03 2.91-1.62 3.99-3.225 1.26-1.845 1.785-3.63 1.815-3.72-.039-.015-3.48-1.335-3.51-5.325zm-3.285-9.78c.915-1.11 1.53-2.64 1.365-4.17-1.32.054-2.91.879-3.855 1.989-.846.975-1.59 2.535-1.395 4.02 1.47.114 2.97-.75 3.885-1.839z"/></svg>
327        Apple Podcasts
328      </a>
329
330      <a class="platform-btn" href="https://anchor.fm/s/2b0e634/podcast/rss" target="_blank" rel="noopener">
331        <svg viewBox="0 0 24 24" fill="#f26522"><path d="M6.18 15.64a2.18 2.18 0 0 1 2.18 2.18C8.36 19.01 7.38 20 6.18 20C4.98 20 4 19.01 4 17.82a2.18 2.18 0 0 1 2.18-2.18M6.18 11.8a6.02 6.02 0 0 1 6.02 6.02v.36H10.1v-.36a3.93 3.93 0 0 0-3.92-3.92a3.93 3.93 0 0 0-3.92 3.92v.36H.17v-.36A6.02 6.02 0 0 1 6.18 11.8m0-3.8A9.82 9.82 0 0 1 16 17.82v.36h-2.09v-.36A7.73 7.73 0 0 0 6.18 10.1a7.73 7.73 0 0 0-7.73 7.72v.36H-3.64v-.36A9.82 9.82 0 0 1 6.18 8z" transform="translate(4 2)"/></svg>
332        RSS Feed
333      </a>
334    </div>
335
336    <!-- Spotify embed (play directly on page) -->
337    <iframe
338      src="https://open.spotify.com/embed/show/7g9PiMxCO93XMKJzLkLu7D?utm_source=generator&theme=0"
339      width="100%" height="352" frameborder="0" allowfullscreen loading="lazy"
340      allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
341      style="border-radius:12px;display:block;margin-bottom:40px">
342    </iframe>
343
344    <!-- All episodes from RSS -->
345    <div class="section-heading" id="pod-all-heading">All Episodes</div>
346    <div id="pod-list"><p class="ep-loading">Loading episodes&hellip;</p></div>
347
348  </main>
349
350  <footer class="site-footer">
351    <p>&copy; WCYT &middot; The Point 91 FM &middot; Homestead High School, Fort Wayne, IN</p>
352  </footer>
353
354  

354<script src="/playlist-widget.js"></script>

354
355  

355<script>WCYTPlaylist.init(null, null, null);</script>

355
356
357  

357<script>
358    const RSS_URL = 'https://anchor.fm/s/2b0e634/podcast/rss';
359
360    function esc(s) {
361      return String(s ?? '').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
362    }
363
364    function fmtDate(str) {
365      if (!str) return '';
366      const d = new Date(str);
367      return isNaN(d) ? '' : d.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' });
368    }
369
370    function getText(el, tag) {
371      return el.querySelector(tag)?.textContent?.trim() || '';
372    }
373
374    function getAttr(el, tag, attr) {
375      return el.querySelector(tag)?.getAttribute(attr) || '';
376    }
377
378    function parseRSS(xml) {
379      const doc     = new DOMParser().parseFromString(xml, 'text/xml');
380      const channel = doc.querySelector('channel');
381      const showArt = channel?.querySelector('image url')?.textContent?.trim()
382                   || getAttr(channel, 'itunes\\:image, image', 'href')
383                   || '';
384      const items   = [...doc.querySelectorAll('item')].map(item => ({
385        title   : getText(item, 'title'),
386        date    : getText(item, 'pubDate'),
387        link    : getText(item, 'link') || getAttr(item, 'enclosure', 'url'),
388        art     : getAttr(item, 'itunes\\:image, image', 'href') || showArt,
389      }));
390      return { showArt, items };
391    }
392
393    function renderList(items) {
394      if (!items.length) {
395        document.getElementById('pod-list').innerHTML = '<p class="ep-error">No episodes found.</p>';
396        return;
397      }
398      document.getElementById('pod-list').innerHTML = `
399        <div class="episode-list">
400          ${items.map(ep => `
401            <a class="episode-card" href="${esc(ep.link)}" target="_blank" rel="noopener">
402              ${ep.art ? `<img class="episode-art" src="${esc(ep.art)}" alt="${esc(ep.title)}" loading="lazy">` : ''}
403              <div class="episode-info">
404                <div class="episode-title">${esc(ep.title)}</div>
405                <div class="episode-date">${fmtDate(ep.date)}</div>
406              </div>
407              <span class="episode-listen">Listen &rarr;</span>
408            </a>`).join('')}
409        </div>`;
410    }
411
412    fetch(RSS_URL)
413      .then(r => { if (!r.ok) throw new Error(r.status); return r.text(); })
414      .then(xml => {
415        const { items } = parseRSS(xml);
416        if (!items.length) throw new Error('empty');
417        renderList(items);
418      })
419      .catch(() => {
420        document.getElementById('pod-list').innerHTML = '';
421        document.getElementById('pod-all-heading').style.display = 'none';
422      });
423  </script>

423
424
425</body>
426</html>