2023-03-26 11:37:20 -05:00
<!doctype html>
< html lang = 'en' >
< head >
< title > Radiostasis< / title >
< meta charset = 'utf-8' >
2023-03-26 13:34:40 -05:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
2023-03-26 11:37:20 -05:00
< link rel = 'stylesheet' href = '/style.css' >
2023-03-26 19:51:05 -05:00
< link rel = 'icon' type = 'image/png' sizes = '32x32' href = '/favicon-32x32.png' >
< link rel = 'icon' type = 'image/png' sizes = '16x16' href = '/favicon-16x16.png' >
< link rel = 'icon' type = 'image/svg' href = '/favicon.svg' >
< link rel = 'manifest' href = '/site.webmanifest' >
< meta name = 'theme-color' content = '#ffffff' >
2023-03-26 11:37:20 -05:00
< / head >
< body >
< div id = 'container' >
< nav >
< a href = '#'
hx-get='/partial/home.html'
hx-push-url='/'
hx-target='main'
hx-swap='innerHTML show:top'>
< svg viewBox = '0 0 50 50' fill = 'currentColor' >
< path d = 'M 42 8 L 8 8 C 3.589844 8 0 11.589844 0 16 L 0 38 C 0 40.207031 1.792969 42 4 42 L 5 42 L 5 43 C 5 44.101563 5.898438 45 7 45 L 10 45 C 11.101563 45 12 44.101563 12 43 L 12 42 L 38 42 L 38 43 C 38 44.101563 38.898438 45 40 45 L 43 45 C 44.101563 45 45 44.101563 45 43 L 45 42 L 46 42 C 48.207031 42 50 40.207031 50 38 L 50 16 C 50 11.589844 46.410156 8 42 8 Z M 41 16 L 44 16 L 44 20 L 41 20 Z M 10 18.015625 L 10 33.988281 C 7.574219 32.160156 6 29.269531 6 26 C 6 22.730469 7.574219 19.839844 10 18.015625 Z M 15 35.949219 C 13.941406 35.84375 12.933594 35.570313 12 35.160156 L 12 16.835938 C 12.933594 16.429688 13.941406 16.15625 15 16.050781 Z M 20 35.160156 C 19.066406 35.570313 18.058594 35.84375 17 35.949219 L 17 16.050781 C 18.058594 16.15625 19.066406 16.429688 20 16.835938 Z M 22 33.984375 L 22 18.015625 C 24.425781 19.839844 26 22.730469 26 26 C 26 29.269531 24.425781 32.160156 22 33.984375 Z M 31 16 L 39 16 L 39 20 L 31 20 Z M 34 30 C 34 27.789063 35.792969 26 38 26 C 40.210938 26 42 27.789063 42 30 C 42 32.210938 40.210938 34 38 34 C 35.792969 34 34 32.210938 34 30 Z' / >
< / svg >
Radiostasis
< / a >
< a href = '#'
hx-get='/partial/series.html'
hx-push-url='/series'
hx-target='main'
hx-swap='innerHTML show:top'>All Series< / a >
< details >
< summary > Genres< / summary >
< ul >
<!-- begin genre list -->
< li hx-get = '/partial/genre/adventure.html'
hx-push-url='/genre/adventure'
hx-target='main'
hx-swap='innerHTML show:top'>Adventure< / li >
< li hx-get = '/partial/genre/children.html'
hx-push-url='/genre/children'
hx-target='main'
hx-swap='innerHTML show:top'>Children< / li >
< li hx-get = '/partial/genre/comedy.html'
hx-push-url='/genre/comedy'
hx-target='main'
hx-swap='innerHTML show:top'>Comedy< / li >
< li hx-get = '/partial/genre/crime.html'
hx-push-url='/genre/crime'
hx-target='main'
hx-swap='innerHTML show:top'>Crime< / li >
< li hx-get = '/partial/genre/detective.html'
hx-push-url='/genre/detective'
hx-target='main'
hx-swap='innerHTML show:top'>Detective< / li >
< li hx-get = '/partial/genre/documentary.html'
hx-push-url='/genre/documentary'
hx-target='main'
hx-swap='innerHTML show:top'>Documentary< / li >
< li hx-get = '/partial/genre/drama.html'
hx-push-url='/genre/drama'
hx-target='main'
hx-swap='innerHTML show:top'>Drama< / li >
< li hx-get = '/partial/genre/game-show.html'
hx-push-url='/genre/game-show'
hx-target='main'
hx-swap='innerHTML show:top'>Game-Show< / li >
< li hx-get = '/partial/genre/horror.html'
hx-push-url='/genre/horror'
hx-target='main'
hx-swap='innerHTML show:top'>Horror< / li >
< li hx-get = '/partial/genre/music.html'
hx-push-url='/genre/music'
hx-target='main'
hx-swap='innerHTML show:top'>Music< / li >
< li hx-get = '/partial/genre/mystery.html'
hx-push-url='/genre/mystery'
hx-target='main'
hx-swap='innerHTML show:top'>Mystery< / li >
< li hx-get = '/partial/genre/sci-fi.html'
hx-push-url='/genre/sci-fi'
hx-target='main'
hx-swap='innerHTML show:top'>Sci-Fi< / li >
< li hx-get = '/partial/genre/western.html'
hx-push-url='/genre/western'
hx-target='main'
hx-swap='innerHTML show:top'>Western< / li >
<!-- end genre list -->
< / ul >
< / details >
< / nav >
2023-04-05 18:48:21 -05:00
< main hx-history-elt > < / main >
2023-03-26 11:37:20 -05:00
< / div >
< footer >
< div id = 'nowPlaying' >
< img alt = 'cover image' title = 'No media playing'
src='/transparent.png'>
< div >
< span title = 'No episode playing' > No episode playing< / span >
< span title = '' > < / span >
< / div >
< / div >
< div id = 'controls' >
< button class = 'seek' title = 'Rewind 10 seconds' >
< svg viewBox = '0 0 16 16' fill = 'currentColor' >
< path d = 'M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16ZM7.729 5.055A.5.5 0 0 1 8 5.5v1.886l3.21-2.293A.5.5 0 0 1 12 5.5v5a.5.5 0 0 1-.79.407L8 8.614V10.5a.5.5 0 0 1-.79.407l-3.5-2.5a.5.5 0 0 1 0-.814l3.5-2.5a.5.5 0 0 1 .519-.038Z' / >
< / svg >
< / button >
< button class = 'play' title = 'Play/Pause' >
< svg title = 'Play/Pause' class = 'play' viewBox = '0 0 16 16' fill = 'currentColor' >
< path d = 'M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM6.79 5.093A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814l-3.5-2.5z' / >
< / svg >
< / button >
< button class = 'seek' title = 'Fast forward 30 seconds' >
< svg title = 'Fast forward 30 seconds' class = 'seek' viewBox = '0 0 16 16' fill = 'currentColor' >
< path d = 'M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16ZM4.79 5.093 8 7.386V5.5a.5.5 0 0 1 .79-.407l3.5 2.5a.5.5 0 0 1 0 .814l-3.5 2.5A.5.5 0 0 1 8 10.5V8.614l-3.21 2.293A.5.5 0 0 1 4 10.5v-5a.5.5 0 0 1 .79-.407Z' / >
< / svg >
< / button >
< / div >
< div id = 'timeVolume' >
< span > --:-- / --:--< / span >
< span >
< svg viewBox = '0 0 16 16' fill = 'currentColor' >
< path d = "M11.536 14.01A8.473 8.473 0 0 0 14.026 8a8.473 8.473 0 0 0-2.49-6.01l-.708.707A7.476 7.476 0 0 1 13.025 8c0 2.071-.84 3.946-2.197 5.303l.708.707z" / >
< path d = "M10.121 12.596A6.48 6.48 0 0 0 12.025 8a6.48 6.48 0 0 0-1.904-4.596l-.707.707A5.483 5.483 0 0 1 11.025 8a5.483 5.483 0 0 1-1.61 3.89l.706.706z" / >
< path d = "M8.707 11.182A4.486 4.486 0 0 0 10.025 8a4.486 4.486 0 0 0-1.318-3.182L8 5.525A3.489 3.489 0 0 1 9.025 8 3.49 3.49 0 0 1 8 10.475l.707.707zM6.717 3.55A.5.5 0 0 1 7 4v8a.5.5 0 0 1-.812.39L3.825 10.5H1.5A.5.5 0 0 1 1 10V6a.5.5 0 0 1 .5-.5h2.325l2.363-1.89a.5.5 0 0 1 .529-.06z" / >
< / svg >
< input title = 'Volume' type = 'range' max = '100' min = '0' value = '100' >
< / span >
< / div >
< / footer >
2023-03-26 13:34:40 -05:00
< script src = '/htmx.min.js' > < / script >
< script src = '/howler.min.js' > < / script >
< script src = '/radiostasis.js' > < / script >
2023-03-26 11:37:20 -05:00
< / body >
< / html >