--- layout: default --- {% if page.category == 'releases' %} {% include header.html %} <section id="play"> <div class="album-player"> <!-- HERE BEGINS MADNESS --> {% for album in site.albums %} {% if page.album == album.slug %} {% assign onetracker = album.tracks | size %} <div class="player-wrap"> <div id="plwrap"> <h2>Track list</h2> <ul id="plList"> {% for track in album.tracks %} <li class="" {% if onetracker == 1 %}style="border-radius: 5px;"{% endif %}> <div class="plItem"> <div class="plNum">{{ track.common.track.no }}.</div> <div class="plTitle">{{ track.common.title }}</div> <div class="plLength"> {% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }} </div> </div> </li> {% endfor %} </ul> </div> <h2 style="text-align: center;"><a href="#support" class="button">🙏 Support</a></h2> </div> <div class="noJSalbum"> <div class="coverartwrapper"> <div class="coverartwrapped" style="background-image: url({{ page.image }});"></div> </div> {% for track in album.tracks %} <div class="plItem"> <div class="plNum">{{ track.common.track.no }}.</div> <div class="plTitle"><a href="{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.mp3" target="_blank" rel="noopener">{{ track.common.title }} </a></div> <div class="plLength"> {% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }} </div> </div> {% endfor %} </div> <div class="coverart"> <div class="coverartwrapper"> <div id="npImage" class="coverartwrapped"></div> </div> {% assign author_id = page.author | prepend: "/authors/" | append: "/" %} {% assign author = site.authors | where: "url", author_id | first %} <div id="author"> <div class="bio"> <p class="date"> Published the <time datetime="{{ page.date }}">{% include dates.html %}</time> </p> <h6> Share this page: </h6> <ul> <a target="_blank" rel="nofollow noopener" title="Share to facebook" alt="Share to facebook" href="https://touch.facebook.com/sharer.php?u={{ site.url }}{{ page.url | xml_escape }}?pk_campaign=homeshare&quote={{ page.description | xml_escape }}%20By%20{{ site.title | xml_escape }}%20via%20{{ site.url }}" class="icon smaller fab fa-facebook-f"><span class="label">Facebook</span></a> <a target="_blank" rel="nofollow noopener" title="Share to twitter" alt="Share to twitter" href="https://twitter.com/share?url={{ site.url }}{{ page.url | xml_escape }}?pk_campaign=homeshare&text={{ page.description | xml_escape }}%20via%20@{{ site.social.usernames.twitter }}%20&hashtags=#{{ site.social.hashtag }}" class="icon smaller fab fa-twitter"><span class="label">Twitter</span></a> <a target="_blank" rel="nofollow noopener" title="Share to telegram" alt="Share to telgram" href="https://telegram.me/share/url?url={{ site.url }}{{ page.url }}?pk_campaign=homeshare&text={{ page.description | xml_escape }}%20via%20@{{ site.social.usernames.telegram }}" class="icon smaller fab fa-telegram"><span class="label ">Telegram</span></a> <a target="_blank" rel="nofollow noopener" title="Share to reddit" alt="Share to reddit" href="https://reddit.com/submit/?url={{ site.url }}{{ page.url }}?pk_campaign=homeshare&title={{ page.description | xml_escape }}%20By%20{{ site.title | xml_escape }}" class="icon smaller fab fa-reddit"><span class="label">Reddit</span></a> </ul> </div> </div> </div> </div> </section> <section class="info"> <div class="container"> {{ content }} {% if page.link.url %} <p class="center"> <a href="{{ page.link.url }}?ref=TheMusicSyndicateWashere" target="_bank" rel="noopener" class="button">{% if page.link.buttontext %}{{ page.link.buttontext }}{% else %}👀 check it out{% endif %}</a> </p> {% endif %} </div> </section> <div id="fixedPlayer" class="showplayer hideplayer"> <div id="audiowrap"> <div id="audio0"> <audio id="audio1" preload="metadata" controls="controls"> Your browser does not support HTML5 Audio! </audio> </div> </div> <div id="nowPlay"> {% if onetracker > 1 %} <div id="tracks"> <a id="btnPrev"><span class="fas fa-fast-backward"></span></a> <a id="btnNext"><span class="fas fa-fast-forward"></span></a> </div> {% endif %} <p class="right" id="npTitle" style="font-weight: bold;"></p> <p class="left" id="npAction">Paused...</p> </div> </div> {% if onetracker > 1 %} <!-- Tracks --> {% for track in album.tracks %} <section class="track-picker"> <div class="full-image" style="background-image:url({{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg);"> </div> <div> <h2>{{ track.common.title }}</h2> <p> {% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{% assign seconds_without_zero = round_seconds | minus: leftover_seconds %}{% if seconds_without_zero < 10 %}0{% endif %}{{ seconds_without_zero }} | <strong>{{ track.common.genre }}</strong></p> <p>{{ track.common.year }}</p> <p><a href="{{ relBase }}/{{ track.slug }}/" class="button">🔊 Play</a></p> {% if track.all.UNSYNCEDLYRICS and track.all.USLT %} <p> {{ track.all.USLT.text | newline_to_br }} </p> {% elsif track.all.USLT and track.all.UNSYNCEDLYRICS == nil %} <p> {{ track.all.USLT.text | newline_to_br }} </p> {% elsif track.all.UNSYNCEDLYRICS and track.all.USLT == nil %} <p> {{ track.all.UNSYNCEDLYRICS | newline_to_br }} </p> {% elsif track.all.lyrics %} <p> {{ track.all.lyrics | newline_to_br }} </p> {% endif %} </div> </section> {% endfor %} <!-- END Tracks --> {% endif %} {% break %} {% endif %} {% endfor %} <!-- HERE ENDS MADNESS --> <!-- post Naviation --> <section class="post-navigation"> {% if page.previous.url or page.next.url %} <div class="container"> <div class="post-nav"> {% if page.previous.url %} <h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4> <h3>{{ page.previous.title }}</h3> <p>{{ page.previous.description }}</p> {% endif %} </div> <div class="post-nav-next"> {% if page.next.url%} <h4><a href="{{ page.next.url }}"><span class="fas fa-arrow-right" style="font-size:3em;"></span></a></h4> <h3>{{ page.next.title }}</h3> <p>{{ page.next.description }}</p> {% endif %} </div> </div> {% endif %} </section> <!-- End Post Navigation --> <script type="text/javascript"> // html5media enables <video> and <audio> tags in all major browsers // External File: http://api.html5media.info/1.1.8/html5media.min.js // Add user agent as an attribute on the <html> tag... // Inspiration: http://css-tricks.com/ie-10-specific-styles/ // var b = document.documentElement; // b.setAttribute('data-useragent', navigator.userAgent); // b.setAttribute('data-platform', navigator.platform); // HTML5 audio player + playlist controls... // Inspiration: http://jonhall.info/how_to/create_a_playlist_for_html5_audio // Mythium Archive: https://archive.org/details/mythium/ jQuery(function ($) { var supportsAudio = !!document.createElement('audio').canPlayType; if (supportsAudio) { var index = 0, playing = false, mediaPath = '', extension = '', tracks = [{% for album in site.albums %}{% if page.album == album.slug %}{% for track in album.tracks %}{ "track": {{ track.common.track.no }}, "name": "{{ track.common.title }}", "length": "{% assign round_seconds = track.format.duration | round %}{% assign minutes = round_seconds | divided_by: 60 %}{% assign leftover_seconds = minutes | times: 60 %}{{ minutes }}:{{ round_seconds | minus: leftover_seconds }}", "file": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}", "image": "{{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}" }{% unless forloop.last %},{% endunless %}{% endfor %}{% break %} {% endif %}{% endfor %}], trackCount = tracks.length, npAction = $('#npAction'), npTitle = $('#npTitle'), npImage = $('#npImage'), audio = $('#audio1').bind('play', function () { playing = true; npAction.text('Playing...'); $('#fixedPlayer').removeClass('hideplayer'); $("#npImage").addClass('spinnit'); }).bind('pause', function () { playing = false; npAction.text('Paused...'); $("#npImage").removeClass('spinnit'); }).bind('ended', function () { npAction.text('Paused...'); if ((index + 1) < trackCount) { index++; loadTrack(index); playTrack(index); audio.play(); } else { audio.pause(); index = 0; loadTrack(index); } }).get(0), btnPrev = $('#btnPrev').click(function () { if ((index - 1) > -1) { index--; loadTrack(index); playTrack(index); if (playing) { audio.play(); } } else { audio.pause(); index = 0; loadTrack(index); } }), btnNext = $('#btnNext').click(function () { if ((index + 1) < trackCount) { index++; loadTrack(index); playTrack(index); if (playing) { audio.play(); } } else { audio.pause(); index = 0; loadTrack(index); } }), li = $('#plList li').click(function () { var id = parseInt($(this).index()); if (id !== index || playing == false) { playTrack(id); }else { audio.pause(); } }), loadTrack = function (id) { npTitle.text(tracks[id].name); index = id; audio.src = mediaPath + tracks[id].file + extension; $('audio').attr("data-matomo-title", tracks[id].name); $("#npImage").attr('style', 'background-image:url(' + tracks[id].image + '.jpeg)'); }, playTrack = function (id) { $('.plSel').removeClass('plSel'); $('#plList li:eq(' + id + ')').addClass('plSel'); loadTrack(id); audio.play(); }; extension = audio.canPlayType('audio/mpeg') ? '.mp3' : audio.canPlayType('audio/ogg') ? '.ogg' : ''; loadTrack(index); } }); </script> {% else %} {% include header.html %} <section class="info" id="read"> <div class="info-pages"> <div class="container"> {{ content }} </div> {% if page.link.url %} <p class="center"> <a href="{{ page.link.url }}?ref=ToSettoSettoSentMeHere" target="_bank" rel="noopener" class="button">{% if page.link.buttontext %}{{ page.link.buttontext }}{% else %}👀 check it out{% endif %}</a> </p> {% endif %} {% include author.html %} </div> </section> <!-- post Naviation --> <section class="post-navigation"> {% if page.previous.url or page.next.url %} <div class="container"> <div class="post-nav"> {% if page.previous.url %} <h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4> <h3>{{ page.previous.title }}</h3> <p>{{ page.previous.description }}</p> {% endif %} </div> <div class="post-nav-next"> {% if page.next.url%} <h4><a href="{{ page.next.url }}"><span class="fas fa-arrow-right" style="font-size:3em;"></span></a></h4> <h3>{{ page.next.title }}</h3> <p>{{ page.next.description }}</p> {% endif %} </div> </div> {% endif %} </section> {% endif %}