fix formating of radio page

This commit is contained in:
Set Hallstrom 2020-11-04 17:23:48 +01:00
parent 50840e9fa4
commit 4ce8e746d3
2 changed files with 67 additions and 73 deletions

View file

@ -54,7 +54,11 @@ a:hover {
-moz-transition: all var(--anim-speed) ease-in-out; -moz-transition: all var(--anim-speed) ease-in-out;
-ms-transition: all var(--anim-speed) ease-in-out; -ms-transition: all var(--anim-speed) ease-in-out;
transition: all var(--anim-speed) ease-in-out; transition: all var(--anim-speed) ease-in-out;
background-image: linear-gradient(228deg, var(--accent1-alt), var(--accent2-alt));
background-size: 400% 400%;
-webkit-animation: backgroundBlink 2s ease infinite;
-moz-animation: backgroundBlink 2s ease infinite;
animation: backgroundBlink 2s ease infinite;
} }

View file

@ -15,109 +15,103 @@ video_path: /assets/vid/radio.mp4
image: /assets/vid/radio.jpg image: /assets/vid/radio.jpg
layout: default layout: default
--- ---
{% include relBase.html %} {% include relBase.html %}
<script src="{{ relBase }}/assets/js/jquery-3.5.1.min.js"></script> <script src="{{ relBase }}/assets/js/jquery-3.5.1.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
function getData() { function getData() {
$.getJSON('https://radio.basspistol.com/status-json.xsl', function(json) { $.getJSON('https://radio.basspistol.com/status-json.xsl', function (json) {
output = "<p>" + "<span style='font-size:14px;'>Now Playing:</span> " + "<br/>"; output = "<h4>Now Playing: </h4>";
output += "<strong>" + json.icestats.source.title + "</strong></p>"; output += "<h3>" + json.icestats.source.title + "</h3>";
output += "<p style='font-size:14px;'>" + json.icestats.source.listeners + " peers are listening in MP3 <br />"; output += "<p style='font-size:14px;'>" + json.icestats.source.listeners + " peers are listening<br />";
document.getElementById("radioPlaceholder").innerHTML=output; document.getElementById("radioPlaceholder").innerHTML = output;
}); });
} }
setInterval(getData, 7000); setInterval(getData, 7000);
$(function() { $(function () {
getData(); getData();
}); });
</script> </script>
<!-- Banner --> <!-- Banner -->
<div id="trackArt"> <div id="trackArt">
<section> <section>
<div class="coverartwrapper"> <div class="coverartwrapper">
<div class="coverartwrapped" id="coverart" style="background-image: url({{ page.image }});"></div> <div class="coverartwrapped" id="coverart" style="background-image: url({{ page.image }});"></div>
</div> </div>
<div class="playbutton hideWhenNoJS"> <div class="playbutton hideWhenNoJS">
<a id="mu_pause" class="button">🎶 Play!</a> <a id="mu_pause" class="button">🎶 Play!</a>
</div> </div>
</section>
</p>
</section>
</div> </div>
<!-- Content --> <!-- Content -->
<div id="trackInfo"> <div id="trackInfo">
<section style="padding-right: 40px;"> <section>
<h1>{{ page.title }}</h1> <h1>{{ page.title }}</h1>
<p>{{ page.description }}</p> <p>{{ page.description }} To enjoy the stream in your favorite player <a target="_blank" rel="noopener noreferrer"
<div id="radioPlaceholder"></div> href='https://radio.basspistol.com/radio.mp3.m3u'>click here</a></p>
<p><strong><span id="tracktime"></span></strong><br /></p>
<p>To enjoy the stream in your favorite player <a target="_blank" rel="noopener noreferrer" href='https://radio.basspistol.com/radio.mp3.m3u'>click here</a></p>
<p><strong>Questions about the playlist? Requests? Want to submit tracks? Chat with us!<br /><br /></strong></p>
<h2 style="text-align:left">Featured on the Radio</h2>
<p>This is the list of all the generous artists making this radio possible. Some of them simply have no crib on the internet. If you know that they now have a URL, if you somehow find a missing name or if you are featured on this list but no longer wish to be, please <a href="/chat/#read">conact us ASAP.</a> Also feel free to contact us if you think your music would fit in the radio!</p>
<h3>
{% assign sorted = site.data.radio | sort: 'name' %}
{% for artist in sorted %}
{% if artist.url %}
<a href="{{ artist.url }}" target="_blank" rel="noopener">{{ artist.name }}</a> {% unless forloop.last %}-{% endunless %}
{% else %}
{{ artist.name }} {% unless forloop.last %}-{% endunless %}
{% endif %}
{% endfor %}
</h3>
<h2 style="text-align: left;">Chat with us!</h2>
<iframe src="https://kiwiirc.com/client/irc.freenode.net/?nick={{ site.social.irc.guest-nick }}|?&theme=cli{{ site.social.irc.channel }}" style="border:0; width:100%; height:540px;"></iframe>
<p>You do not need to register to participate. This chat is public. <strong>We never ask you to submit credit-card (or any other payment information) nor personal information.</strong> It is provided by kiwi via freenode. Read the privacy policy of <a target="_blank" rel="noopener" href="https://kiwiirc.com/privacy">Kiwi</a> and <a target="_blank" rel="noopener" href="https://freenode.net/policies">Freenode</a><br />Matrix user? <a href="{{ site.social.irc.matrix }}" target="_blank" rel="noopener">Click here</a></p>
<div id="radioPlaceholder"></div>
<p><strong><span id="tracktime"></span></strong></p>
<p><strong>Bellow is the list of all the generous artists making this radio possible.</strong> Some of them simply have no crib on the
internet. If you know that they now have a URL, if you somehow find a missing name or if you are featured on this
list but no longer wish to be, please <a href="/chat/#read">conact us ASAP.</a> Also feel free to contact us if
you think your music would fit in the radio!</p>
<h3>
{% assign sorted = site.data.radio | sort: 'name' %}
{% for artist in sorted %}
{% if artist.url %}
<a href="{{ artist.url }}" target="_blank" rel="noopener">{{ artist.name }}</a>
{% unless forloop.last %}-{% endunless %}
{% else %}
{{ artist.name }} {% unless forloop.last %}-{% endunless %}
{% endif %}
{% endfor %}
</h3>
<h2 style="text-align: left;">Chat with us!</h2>
<p><strong>Questions about the playlist? Requests? Want to submit tracks? Chat with us!<br /></strong>You do not
need to register to participate. This chat is public. <strong>We never ask you to submit credit-card (or any other
payment information) nor personal information.</strong> It is provided by kiwi via freenode. Read the privacy
policy of <a target="_blank" rel="noopener" href="https://kiwiirc.com/privacy">Kiwi</a> and <a target="_blank"
rel="noopener" href="https://freenode.net/policies">Freenode</a><br />Matrix user? <a
href="{{ site.social.irc.matrix }}" target="_blank" rel="noopener">Click here</a></p>
<div>
<iframe
src="https://kiwiirc.com/client/irc.freenode.net/?nick={{ site.social.irc.guest-nick }}|?&theme=cli{{ site.social.irc.channel }}"
style="border:0; width:100%; height:540px;"></iframe>
</div>
{% include author.html %} {% include author.html %}
<p class="noJSalbum"><a class="button" target="_blank" rel="noopener" href="https://radio.basspistol.com/radio.mp3"><span class="fas fa-play"></span> Play!</a></p>
<p class="noJSalbum"><a class="button" target="_blank" rel="noopener"
href="https://radio.basspistol.com/radio.mp3"><span class="fas fa-play"></span> Play!</a></p>
</section> </section>
{% include footer.html %}
<!-- End Post Navigation -->
</section>
{% include footer.html %}
<!-- End Post Navigation -->
</div> </div>
<!-- Audio player--> <!-- Audio player-->
<div id="fixedPlayer" class="showplayer hideplayer"> <div id="fixedPlayer" class="showplayer hideplayer">
<div id="audiowrap"> <div id="audiowrap">
<div id="audio0"> <div id="audio0">
<audio controls autoplay preload="none" data-matomo-title="Basspistol Radio"> <audio controls autoplay preload="none" data-matomo-title="Basspistol Radio">
<source src="https://radio.basspistol.com/radio.mp3" type="audio/mpeg" ontimeupdate='updateTrackTime(this);' /> <source src="https://radio.basspistol.com/radio.mp3" type="audio/mpeg" ontimeupdate='updateTrackTime(this);' />
<h1>Your browser isn't ready for so much hotness. Use the download-link instead.</h1>. <h1>Your browser isn't ready for so much hotness. Use the download-link instead.</h1>.
</audio> </audio>
</div> </div>
</div> </div>
<div id="nowPlay"> <div id="nowPlay">
</div> </div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
function loadUrl(newLocation) { function loadUrl(newLocation) {
window.location = newLocation; window.location = newLocation;
return false; return false;
@ -134,23 +128,20 @@ layout: default
mu.currentTime = 0; mu.currentTime = 0;
loadUrl("{{ relBase }}{{ page.next.url }}"); return false; loadUrl("{{ relBase }}{{ page.next.url }}"); return false;
}); });
mu.onplaying = function() { mu.onplaying = function () {
pauseButton.innerHTML = "Pause"; pauseButton.innerHTML = "Pause";
fixedplayer.classList.remove("hideplayer"); fixedplayer.classList.remove("hideplayer");
};
};
pauseButton.addEventListener("click", function () { pauseButton.addEventListener("click", function () {
if (mu.paused) { if (mu.paused) {
mu.play(); mu.play();
} }
else { else {
mu.pause(); mu.pause();
} }
}); });
mu.addEventListener('playing', function () { mu.addEventListener('playing', function () {
spincover.classList.add("spinnit"); spincover.classList.add("spinnit");
spincover.classList.remove("paused"); spincover.classList.remove("paused");
@ -170,5 +161,4 @@ layout: default
thecurrentSpan.innerHTML = formatted; thecurrentSpan.innerHTML = formatted;
}); });
</script>
</script>