451 lines
19 KiB
Django/Jinja
451 lines
19 KiB
Django/Jinja
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
<head>
|
|
<title>{{show_name}}</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,700,900">
|
|
<link rel="stylesheet" href="fonts/icomoon/style.css">
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="css/magnific-popup.css">
|
|
<link rel="stylesheet" href="css/jquery-ui.css">
|
|
<link rel="stylesheet" href="css/owl.carousel.min.css">
|
|
<link rel="stylesheet" href="css/owl.theme.default.min.css">
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mediaelement@4.2.7/build/mediaelementplayer.min.css">
|
|
|
|
<link rel="stylesheet" href="css/aos.css">
|
|
|
|
<link rel="stylesheet" href="css/style.css">
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div class="site-wrap">
|
|
|
|
<div class="site-mobile-menu">
|
|
<div class="site-mobile-menu-header">
|
|
<div class="site-mobile-menu-close mt-3">
|
|
<span class="icon-close2 js-menu-toggle"></span>
|
|
</div>
|
|
</div>
|
|
<div class="site-mobile-menu-body"></div>
|
|
</div>
|
|
|
|
|
|
<header class="site-navbar py-4 absolute transparent" role="banner">
|
|
|
|
<div class="container">
|
|
<div class="row align-items-center">
|
|
|
|
|
|
<!-- <div class="col-3" data-aos="fade-down"> -->
|
|
<!-- <h1><a href="#" class="text-white h2">{{show_name}}</a></h1> -->
|
|
<!-- </div> -->
|
|
<div class="col-9" data-aos="fade-down">
|
|
<nav class="site-navigation position-relative text-right text-md-right" role="navigation">
|
|
|
|
|
|
<div class="d-inline-block ml-md-0 mr-auto py-3"><a href="#" class="site-menu-toggle js-menu-toggle text-white"><span class="icon-menu h3"></span></a></div>
|
|
|
|
<ul class="site-menu js-clone-nav d-none">
|
|
<li class="has-children active">
|
|
<a href="index.html">Home</a>
|
|
<ul class="dropdown arrow-top">
|
|
<li><a href="#">Menu One</a></li>
|
|
<li><a href="#">Menu Two</a></li>
|
|
<li><a href="#">Menu Three</a></li>
|
|
<li class="has-children">
|
|
<a href="#">Sub Menu</a>
|
|
<ul class="dropdown">
|
|
<li><a href="#">Menu One</a></li>
|
|
<li><a href="#">Menu Two</a></li>
|
|
<li><a href="#">Menu Three</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="has-children">
|
|
<a href="#">Dropdown</a>
|
|
<ul class="dropdown arrow-top">
|
|
<li><a href="#">Menu One</a></li>
|
|
<li><a href="#">Menu Two</a></li>
|
|
<li><a href="#">Menu Three</a></li>
|
|
</ul>
|
|
</li>
|
|
<li><a href="about.html">About</a></li>
|
|
<li><a href="contact.html">Contact</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</header>
|
|
|
|
<div class="site-blocks-cover overlay" style="background-image: url(episode/{{episode_number}}/{{episode_image}});" data-aos="fade" data-stellar-background-ratio="0.5">
|
|
<div class="container">
|
|
<div class="row align-items-center justify-content-center text-center">
|
|
|
|
<div class="col-md-12" data-aos="fade-up" data-aos-delay="400">
|
|
<h2 class="text-white font-weight-light mb-2 display-4">{{show_name}}</h2>
|
|
<p class="text-white font-weight-light">{{about_show}}</p>
|
|
<h4 class="text-white font-weight-light mb-2 display-4">Latest Episode: # {{episode_number}}</h4>
|
|
<p class="text-white font-weight-light">This week music from: {{episode_artists}}</p>
|
|
|
|
<p><a href="episode/{{episode_number}}/index.html" class="btn btn-primary btn-sm py-3 px-4 small">Episode Details and Player</a></p>
|
|
<div class="text-white mb-4"><span class="text-white">Presented by: {{episode_author}} / Zavod Rizoma | {{episode_date}}</span>
|
|
|
|
<div class="player">
|
|
<audio id="player2" preload="none" controls style="max-width: 100%">
|
|
<source src="episode/{{episode_number}}/show.mp3" type="audio/mp3">
|
|
</audio>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<p class="text-white font-weight-light">{{show_url}}</p>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="site-section bg-light">
|
|
<div class="container">
|
|
|
|
<div class="row mb-5" data-aos="fade-up">
|
|
<div class="col-md-12 text-center">
|
|
<h2 class="font-weight-bold text-black">Previous Episodes</h2>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
{% for episode in episodes %}
|
|
<div class="d-block d-md-flex podcast-entry bg-white mb-5" data-aos="fade-up">
|
|
<div class="image" style="background-image: url('episode/{{episode.episode_number}}/{{episode_image}}');"></div>
|
|
<div class="text">
|
|
|
|
<h3 class="font-weight-light"><a href="episode/{{episode.episode_number}}/index.html">Episode: # {{episode.episode_number}} </a></h3>
|
|
<div class="text-white mb-3"><span class="text-black-opacity-05">
|
|
<small>Presented by Rob Canning <span class="sep">/</span> {{episode.episode_date}} <span class="sep">/</span> {{episode.episode_duration}}</small></span></div>
|
|
<p class="mb-4"><b>On this weeks show music from: {{episode.episode_artists}} </b> </p>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{% endfor %}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="container" data-aos="fade-up">
|
|
<div class="row">
|
|
<div class="col-md-12 text-center">
|
|
<div class="site-block-27">
|
|
<ul>
|
|
<li><a href="#"><</a></li>
|
|
<li class="active"><span>1</span></li>
|
|
<li><a href="#">2</a></li>
|
|
<li><a href="#">3</a></li>
|
|
<li><a href="#">4</a></li>
|
|
<li><a href="#">5</a></li>
|
|
<li><a href="#">></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="site-section">
|
|
</div>
|
|
|
|
|
|
<!-- <div class="site-section"> -->
|
|
<!-- <div class="container" data-aos="fade-up"> -->
|
|
<!-- <div class="row mb-5"> -->
|
|
<!-- <div class="col-md-12 text-center"> -->
|
|
<!-- <h2 class="font-weight-bold text-black">Behind The Mic</h2> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
<!-- <div class="row"> -->
|
|
<!-- <div class="col-md-6 col-lg-4 mb-5 mb-lg-5"> -->
|
|
<!-- <div class="team-member"> -->
|
|
|
|
<!-- <img src="images/rob_canning.jpeg" alt="Image" class="img-fluid"> -->
|
|
|
|
<!-- <div class="text"> -->
|
|
|
|
<!-- <h2 class="mb-2 font-weight-light h4">Rob Canning</h2> -->
|
|
<!-- <span class="d-block mb-2 text-white-opacity-05">Creative Director</span> -->
|
|
<!-- <p class="mb-4">Lorem ipsum dolor sit amet consectetur adipisicing elit ullam reprehenderit nemo.</p> -->
|
|
<!-- <p> -->
|
|
<!-- <a href="#" class="text-white p-2"><span class="icon-facebook"></span></a> -->
|
|
<!-- <a href="#" class="text-white p-2"><span class="icon-twitter"></span></a> -->
|
|
<!-- <a href="#" class="text-white p-2"><span class="icon-linkedin"></span></a> -->
|
|
<!-- </p> -->
|
|
<!-- </div> -->
|
|
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
|
|
<!-- <div class="site-section bg-light block-13"> -->
|
|
<!-- <div class="container"> -->
|
|
<!-- <div class="row mb-5"> -->
|
|
<!-- <div class="col-md-12 text-center"> -->
|
|
<!-- <h2 class="font-weight-bold text-black">Featured Labels</h2> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
<!-- <div class="nonloop-block-13 owl-carousel"> -->
|
|
|
|
<!-- <div class="text-center p-6 p-md-5 bg-white"> -->
|
|
<!-- <div class="mb-4"> -->
|
|
<!-- <img src="images/label_logos/kamizdat.png" alt="Image" class="w-50 mx-auto img-fluid rounded-circle"> -->
|
|
<!-- </div> -->
|
|
<!-- <div class=""> -->
|
|
<!-- <h3 class="font-weight-light h5">Kamizdat</h3> -->
|
|
<!-- <\!-- <p>Kamizdat is a Slovene free-form boutique netlabel for Creative Commons music by local artists exploring a wide range of genres often packaged in locally-made and unique hand-numbered limited editions.</p> -\-> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
<!-- <div class="text-center p-6 p-md-5 bg-white"> -->
|
|
<!-- <div class="mb-4"> -->
|
|
<!-- <img src="images/label_logos/sploh.jpeg" alt="Image" class="w-50 mx-auto img-fluid rounded-circle"> -->
|
|
<!-- </div> -->
|
|
<!-- <div class=""> -->
|
|
<!-- <h3 class="font-weight-light h5">Zavod Sploh</h3> -->
|
|
<!-- <\!-- <p>Sploh (Sound, Performing, Listening, Observing, Hearing) for art production and publishing is engaged in music, performing arts and intermedia arts production, publishing and education. Primarily it is oriented towards developing, staging, establishing and reflecting musical practices that dip a toe in the waters of: improvisation, contemporary composition, and sound/tech experiments. s</p> -\-> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
<!-- <div class="text-center p-6 p-md-5 bg-white"> -->
|
|
<!-- <div class="mb-4"> -->
|
|
<!-- <img src="images/label_logos/terraformer.jpeg" alt="Image" class="w-50 mx-auto img-fluid rounded-circle"> -->
|
|
<!-- </div> -->
|
|
<!-- <div class=""> -->
|
|
<!-- <h3 class="font-weight-light h5">Terraformer Research Facilities</h3> -->
|
|
<!-- <\!-- <p>Terraformer Research Facilities Label for experimental, drone, ambient, noise improvised music. Velenje, Slovenia.</p> -\-> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
<!-- <div class="text-center p-6 p-md-5 bg-white"> -->
|
|
<!-- <div class="mb-4"> -->
|
|
<!-- <img src="images/label_logos/PF.png" alt="Image" class="w-50 mx-auto img-fluid rounded-circle"> -->
|
|
<!-- </div> -->
|
|
<!-- <div class=""> -->
|
|
<!-- <h3 class="font-weight-light h5">Pharmafabrik Records</h3> -->
|
|
<!-- <\!-- <p>Delivers rare but comprehensive records of experimental, drone, ambient, electronic, and electro-acoustic music.</p> -\-> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
|
|
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
|
|
|
|
|
|
|
|
<footer class="site-footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-4">
|
|
<div class="mb-5">
|
|
<h3 class="footer-heading mb-4">About The {{show_name}} Podcast</h3>
|
|
<p>{{about_show}}</p>
|
|
</div>
|
|
|
|
<!-- <div class="mb-5"> -->
|
|
<!-- <h3 class="footer-heading mb-4">Previous Podcast</h3> -->
|
|
<!-- <div class="block-25"> -->
|
|
<!-- <ul class="list-unstyled"> -->
|
|
<!-- <li class="mb-3"> -->
|
|
<!-- <a href="#" class="d-flex"> -->
|
|
<!-- <figure class="image mr-4"> -->
|
|
<!-- <img src="images/img_1.jpg" alt="" class="img-fluid"> -->
|
|
<!-- </figure> -->
|
|
<!-- <div class="text"> -->
|
|
<!-- <h3 class="heading font-weight-light">Lorem ipsum dolor sit amet consectetur elit</h3> -->
|
|
<!-- </div> -->
|
|
<!-- </a> -->
|
|
<!-- </li> -->
|
|
<!-- <li class="mb-3"> -->
|
|
<!-- <a href="#" class="d-flex"> -->
|
|
<!-- <figure class="image mr-4"> -->
|
|
<!-- <img src="images/img_1.jpg" alt="" class="img-fluid"> -->
|
|
<!-- </figure> -->
|
|
<!-- <div class="text"> -->
|
|
<!-- <h3 class="heading font-weight-light">Lorem ipsum dolor sit amet consectetur elit</h3> -->
|
|
<!-- </div> -->
|
|
<!-- </a> -->
|
|
<!-- </li> -->
|
|
<!-- <li class="mb-3"> -->
|
|
<!-- <a href="#" class="d-flex"> -->
|
|
<!-- <figure class="image mr-4"> -->
|
|
<!-- <img src="images/img_1.jpg" alt="" class="img-fluid"> -->
|
|
<!-- </figure> -->
|
|
<!-- <div class="text"> -->
|
|
<!-- <h3 class="heading font-weight-light">Lorem ipsum dolor sit amet consectetur elit</h3> -->
|
|
<!-- </div> -->
|
|
<!-- </a> -->
|
|
<!-- </li> -->
|
|
<!-- </ul> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
|
|
</div>
|
|
<div class="col-lg-4 mb-5 mb-lg-0">
|
|
<div class="row mb-5">
|
|
<div class="col-md-12">
|
|
<h3 class="footer-heading mb-4">Quick Menu</h3>
|
|
</div>
|
|
<div class="col-md-6 col-lg-6">
|
|
<ul class="list-unstyled">
|
|
<li><a href="#">Home</a></li>
|
|
<li><a href="#">News</a></li>
|
|
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6 col-lg-6">
|
|
<ul class="list-unstyled">
|
|
<li><a href="#">About Us</a></li>
|
|
<li><a href="#">Contact Us</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
|
|
<h3 class="footer-heading mb-4">Follow Us on Social Media</h3>
|
|
|
|
We are on most of the social media platforms, please follow us and tell your friends about the podcast!
|
|
|
|
<div>
|
|
<a href="https://www.facebook.com/profile.php?id=61555936138715" class="pl-0 pr-3"><span class="icon-facebook"></span></a>
|
|
<a href="https://twitter.com/uho_podcast" class="pl-3 pr-3"><span class="icon-twitter"></span></a>
|
|
<a href="https://www.instagram.com/uho.podcast" class="pl-3 pr-3"><span class="icon-instagram"></span></a>
|
|
<a href="https://www.youtube.com/@uho.podcast" class="pl-3 pr-3"><span class="icon-youtube"></span></a>
|
|
<a href="https://soundcloud.com/uho-podcast" class="pl-3 pr-3"><span class="icon-soundcloud"></span></a>
|
|
|
|
</div>
|
|
<p></p>
|
|
<p></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<h3 class="footer-heading mb-4">Support us on Patreon</h3>
|
|
|
|
<div>
|
|
<a href="https://www.patreon.com/bePatron?u=116340955">Become a Patreon member! Support the show financially, for as little as 5 euros/dollars/pounds a month </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="col-lg-4 mb-5 mb-lg-0">
|
|
<div class="mb-5">
|
|
<h3 class="footer-heading mb-4">Subscribe to Podcast RSS Feed</h3>
|
|
<div class="block-16">
|
|
<figure>
|
|
<a href="{{show_url}}/{{show_rss}}">
|
|
<img src="episode/1/img/cover0.png" alt="podcast" class="img-fluid rounded">
|
|
</a>
|
|
</figure>
|
|
<a href="{{show_url}}/{{show_rss}}">{{show_url}}/{{show_rss}}</a>
|
|
</div>
|
|
You can also subscribe to our RSS feed via Soundcloud <a href="https://soundcloud.com/uho-podcast" class="pl-3 pr-3"><span class="icon-soundcloud"></span></a> or Youtube <a href="https://www.youtube.com/@uho.podcast" class="pl-3 pr-3"><span class="icon-youtube"></span></a>
|
|
</div>
|
|
|
|
<!-- <div class="mb-5"> -->
|
|
<!-- <h3 class="footer-heading mb-2">Subscribe Newsletter</h3> -->
|
|
|
|
<!-- <form action="#" method="post"> -->
|
|
<!-- <div class="input-group mb-3"> -->
|
|
<!-- <input type="text" class="form-control border-secondary text-white bg-transparent" placeholder="Enter Email" aria-label="Enter Email" aria-describedby="button-addon2"> -->
|
|
<!-- <div class="input-group-append"> -->
|
|
<!-- <button class="btn btn-primary" type="button" id="button-addon2">Send</button> -->
|
|
<!-- </div> -->
|
|
<!-- </div> -->
|
|
<!-- </form> -->
|
|
|
|
<!-- </div> -->
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row pt-5 mt-5 text-center">
|
|
<div class="col-md-12">
|
|
<p>
|
|
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
|
|
Copyright ©<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="icon-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank" >Colorlib</a>
|
|
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
|
|
</p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
|
|
<script src="js/jquery-3.3.1.min.js"></script>
|
|
<script src="js/jquery-migrate-3.0.1.min.js"></script>
|
|
<script src="js/jquery-ui.js"></script>
|
|
<script src="js/popper.min.js"></script>
|
|
<script src="js/bootstrap.min.js"></script>
|
|
<script src="js/owl.carousel.min.js"></script>
|
|
<script src="js/jquery.stellar.min.js"></script>
|
|
<script src="js/jquery.countdown.min.js"></script>
|
|
<script src="js/jquery.magnific-popup.min.js"></script>
|
|
<script src="js/aos.js"></script>
|
|
|
|
<script src="js/mediaelement-and-player.min.js"></script>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
var mediaElements = document.querySelectorAll('video, audio'), total = mediaElements.length;
|
|
|
|
for (var i = 0; i < total; i++) {
|
|
new MediaElementPlayer(mediaElements[i], {
|
|
pluginPath: 'https://cdn.jsdelivr.net/npm/mediaelement@4.2.7/build/',
|
|
shimScriptAccess: 'always',
|
|
success: function () {
|
|
var target = document.body.querySelectorAll('.player'), targetTotal = target.length;
|
|
for (var j = 0; j < targetTotal; j++) {
|
|
target[j].style.visibility = 'visible';
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
|
|
|
|
<script src="js/main.js"></script>
|
|
|
|
</body>
|
|
</html>
|