fixing broken stuff
This commit is contained in:
Set Hallstrom
parent
c693ef328a
commit
2afa6893e9
|
|
@ -1,306 +1,3 @@
|
||||||
---
|
---
|
||||||
layout: default
|
layout: nil
|
||||||
---
|
---
|
||||||
<script src="{{ relBase }}/assets/js/jquery-3.5.1.min.js"></script>
|
|
||||||
{% include header.html %}
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<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>
|
|
||||||
</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><a href="mailto:{{ author.email }}"><strong>{{ author.name }}</strong></a></p>
|
|
||||||
<p>{{ author.position }}{% if author.gpg != nil %} | <a target="_blank" rel="noopener"
|
|
||||||
href="{{ author.gpg }}">GPG</a>{% endif %}</p>
|
|
||||||
<p class="date">
|
|
||||||
Published the
|
|
||||||
|
|
||||||
{% include dates.html %}
|
|
||||||
</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 }}&quote={{ page.title | 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 }}&text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}%20&hashtags=basspistol"
|
|
||||||
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 }}&text={{ page.title | xml_escape }}%20by%20{{ site.title | xml_escape }}"
|
|
||||||
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 }}&title={{ page.title | 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 }}
|
|
||||||
</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>
|
|
||||||
{% include streamer.html %}
|
|
||||||
|
|
||||||
{% 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 }}/albums/{{ track.slug }}/" class="button"><span class="fas fa-play"></span> Play</a></p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</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 %}
|
|
||||||
|
|
||||||
<h2>Check out more</h2>
|
|
||||||
<div class="post-nav">
|
|
||||||
{% if page.previous.url %}
|
|
||||||
<h3><a href="{{page.previous.url}}" alt="Read {{page.previous.title}}" title="Read {{page.previous.title}}"><span
|
|
||||||
class="fas fa-arrow-left"></span> {{page.previous.title}}</a></h3>
|
|
||||||
<p>{{ page.previous.description }}</p>
|
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
<div class="post-nav-next">
|
|
||||||
{% if page.next.url%}
|
|
||||||
|
|
||||||
<h3><a href="{{page.next.url}}">{{page.next.title}} <span class="fas fa-arrow-right"></span></a></h3>
|
|
||||||
<p>{{ page.next.description }}</p>
|
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
</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>
|
|
||||||
|
|
|
||||||
|
|
@ -130,7 +130,6 @@ layout: default
|
||||||
|
|
||||||
<section class="track-picker">
|
<section class="track-picker">
|
||||||
<div class="full-image" style="background-image:url({{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg);">
|
<div class="full-image" style="background-image:url({{ site.mediaurl }}/{{ track.albumSlug }}/{{ track.trackSlug }}.jpeg);">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h2>{{ track.common.title }}</h2>
|
<h2>{{ track.common.title }}</h2>
|
||||||
|
|
@ -139,11 +138,7 @@ layout: default
|
||||||
| <strong>{{ track.common.genre }}</strong></p>
|
| <strong>{{ track.common.genre }}</strong></p>
|
||||||
<p>{{ track.common.year }}</p>
|
<p>{{ track.common.year }}</p>
|
||||||
<p><a href="{{ relBase }}/tracks/{{ track.slug }}/" class="button"><span class="fas fa-play"></span> Play</a></p>
|
<p><a href="{{ relBase }}/tracks/{{ track.slug }}/" class="button"><span class="fas fa-play"></span> Play</a></p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
@ -156,17 +151,13 @@ layout: default
|
||||||
|
|
||||||
<!-- post Naviation -->
|
<!-- post Naviation -->
|
||||||
<section class="post-navigation">
|
<section class="post-navigation">
|
||||||
|
|
||||||
|
|
||||||
{% if page.previous.url or page.next.url %}
|
{% if page.previous.url or page.next.url %}
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
|
||||||
<div class="post-nav">
|
<div class="post-nav">
|
||||||
|
|
||||||
{% if page.previous.url %}
|
{% if page.previous.url %}
|
||||||
<h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span
|
<h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}"
|
||||||
class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
|
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>
|
<h3>{{ page.previous.title }}</h3>
|
||||||
<p>{{ page.previous.description }}</p>
|
<p>{{ page.previous.description }}</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
@ -178,13 +169,8 @@ layout: default
|
||||||
<p>{{ page.next.description }}</p>
|
<p>{{ page.next.description }}</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
<!-- End Post Navigation -->
|
<!-- End Post Navigation -->
|
||||||
|
|
||||||
|
|
@ -315,6 +301,9 @@ layout: default
|
||||||
<div class="info-pages">
|
<div class="info-pages">
|
||||||
<h1>{{ page.title }}</h1>
|
<h1>{{ page.title }}</h1>
|
||||||
{{ content }}
|
{{ content }}
|
||||||
|
{% if page.link %}
|
||||||
|
<p><a href="{{ page.link }}?ref=TheMusicSyndicateWashere" target="_bank" rel="noopener" class="button">👀 Check it out!</a></p>
|
||||||
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
@ -322,14 +311,9 @@ layout: default
|
||||||
|
|
||||||
<!-- post Naviation -->
|
<!-- post Naviation -->
|
||||||
<section class="post-navigation">
|
<section class="post-navigation">
|
||||||
|
|
||||||
|
|
||||||
{% if page.previous.url or page.next.url %}
|
{% if page.previous.url or page.next.url %}
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
|
||||||
<div class="post-nav">
|
<div class="post-nav">
|
||||||
|
|
||||||
{% if page.previous.url %}
|
{% if page.previous.url %}
|
||||||
<h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span
|
<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>
|
class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
|
||||||
|
|
@ -344,12 +328,7 @@ layout: default
|
||||||
<p>{{ page.next.description }}</p>
|
<p>{{ page.next.description }}</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
@ -85,14 +85,8 @@ layout: default
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
<!-- post Naviation -->
|
<!-- post Naviation -->
|
||||||
<section class="post-navigation">
|
<section class="post-navigation">
|
||||||
|
|
||||||
|
|
||||||
{% if page.previous.url or page.next.url %}
|
{% if page.previous.url or page.next.url %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="post-nav">
|
<div class="post-nav">
|
||||||
|
|
||||||
{% if page.previous.url %}
|
{% if page.previous.url %}
|
||||||
<h4><a href="{{ relBase }}{{ page.previous.url }}" alt="Read {{ page.previous.title }}" title="Read {{ page.previous.title }}"><span
|
<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>
|
class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
|
||||||
|
|
@ -107,13 +101,7 @@ layout: default
|
||||||
<p>{{ page.next.description }}</p>
|
<p>{{ page.next.description }}</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</section>
|
</section>
|
||||||
{% include footer.html %}
|
{% include footer.html %}
|
||||||
<!-- End Post Navigation -->
|
<!-- End Post Navigation -->
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,6 @@ body {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
letter-spacing: _font(kerning);
|
letter-spacing: _font(kerning);
|
||||||
background-color: var(--bg);
|
background-color: var(--bg);
|
||||||
|
|
||||||
}
|
}
|
||||||
#main-wrapper {
|
#main-wrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -23,7 +22,6 @@ body {
|
||||||
-ms-transition: filter var(--anim-speed) ease-in-out;
|
-ms-transition: filter var(--anim-speed) ease-in-out;
|
||||||
transition: filter var(--anim-speed) ease-in;
|
transition: filter var(--anim-speed) ease-in;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
|
||||||
}
|
}
|
||||||
.content-wrapper {
|
.content-wrapper {
|
||||||
max-width: var(--max-width);
|
max-width: var(--max-width);
|
||||||
|
|
@ -56,7 +54,8 @@ body {
|
||||||
|
|
||||||
div {
|
div {
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
h1, p {
|
h1,
|
||||||
|
p {
|
||||||
flex: 1 0 100%;
|
flex: 1 0 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
|
@ -75,7 +74,7 @@ body {
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background-image: url('../img/vignette.svg');
|
background-image: url("../img/vignette.svg");
|
||||||
background-size: 240px;
|
background-size: 240px;
|
||||||
background-repeat: repeat-x;
|
background-repeat: repeat-x;
|
||||||
background-position: bottom;
|
background-position: bottom;
|
||||||
|
|
@ -84,7 +83,7 @@ body {
|
||||||
width: 90vw;
|
width: 90vw;
|
||||||
height: auto;
|
height: auto;
|
||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
line-height: .85em;
|
line-height: 0.85em;
|
||||||
letter-spacing: -0.08em;
|
letter-spacing: -0.08em;
|
||||||
color: var(--bg);
|
color: var(--bg);
|
||||||
font-size: 15vw;
|
font-size: 15vw;
|
||||||
|
|
@ -126,12 +125,11 @@ section:first-of-type {
|
||||||
padding: 80px;
|
padding: 80px;
|
||||||
}
|
}
|
||||||
footer {
|
footer {
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 160px 20px 200px 20px;
|
padding: 160px 20px 200px 20px;
|
||||||
background-color: var(--fg);
|
background-color: var(--fg);
|
||||||
color: var(--bg);
|
color: var(--bg);
|
||||||
background-image: url('../img/vignette-footer.svg');
|
background-image: url("../img/vignette-footer.svg");
|
||||||
background-size: 400px;
|
background-size: 400px;
|
||||||
background-repeat: repeat-x;
|
background-repeat: repeat-x;
|
||||||
background-position: top;
|
background-position: top;
|
||||||
|
|
@ -142,7 +140,6 @@ footer {
|
||||||
}
|
}
|
||||||
.icon {
|
.icon {
|
||||||
border: 1px solid var(--bg);
|
border: 1px solid var(--bg);
|
||||||
|
|
||||||
}
|
}
|
||||||
.footframe {
|
.footframe {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -167,7 +164,7 @@ footer {
|
||||||
a {
|
a {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: var(--bg)
|
color: var(--bg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -194,20 +191,22 @@ footer {
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-navigation {
|
.post-navigation {
|
||||||
padding: 80px 40px 80px 40px;
|
margin: 0;
|
||||||
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
padding: 40px;
|
||||||
|
align-items: flex-start;
|
||||||
max-width: var(--max-width);
|
max-width: var(--max-width);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
flex: 0 0 100%;
|
flex: 0 0 100%;
|
||||||
margin-top: 40px;
|
margin-top: 40px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.post-nav, .post-nav-next {
|
.post-nav,
|
||||||
|
.post-nav-next {
|
||||||
flex: 1 0 200px;
|
flex: 1 0 200px;
|
||||||
|
|
||||||
h4 {
|
h4 {
|
||||||
|
|
@ -223,14 +222,12 @@ footer {
|
||||||
margin: 0 0 0 40px;
|
margin: 0 0 0 40px;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// album index
|
// album index
|
||||||
.releases {
|
.releases {
|
||||||
|
|
||||||
padding: 80px 0;
|
padding: 80px 0;
|
||||||
|
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
max-width: var(--max-width);
|
max-width: var(--max-width);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
|
@ -254,14 +251,12 @@ footer {
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Streambox
|
// Streambox
|
||||||
.streambox {
|
.streambox {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 2em;
|
line-height: 2em;
|
||||||
|
|
||||||
}
|
}
|
||||||
.streamer {
|
.streamer {
|
||||||
max-width: var(--max-width);
|
max-width: var(--max-width);
|
||||||
|
|
@ -279,5 +274,4 @@ footer {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
justify-self: center;
|
justify-self: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
251
backupindex.html
251
backupindex.html
|
|
@ -1,251 +0,0 @@
|
||||||
---
|
|
||||||
title: Music Syndicate
|
|
||||||
subtitle: Basspistol
|
|
||||||
description: >-
|
|
||||||
Homepage of Basspistol, The Outernational Music Syndicate established in 2010.
|
|
||||||
The underground is dead, Long Live the Underground!
|
|
||||||
tags:
|
|
||||||
- basspistol
|
|
||||||
- uuternational
|
|
||||||
- music
|
|
||||||
- syndicate
|
|
||||||
- homepage
|
|
||||||
- collective
|
|
||||||
- free
|
|
||||||
- culture
|
|
||||||
video_path: /assets/vid/intro_loop_.mp4
|
|
||||||
image: /assets/vid/intro_loop_.jpg
|
|
||||||
logo_image: /siteicon.png
|
|
||||||
---
|
|
||||||
{% include relBase.html %}
|
|
||||||
<!-- Banner -->
|
|
||||||
<section
|
|
||||||
class="banner onload-image-fade-in onload-content-fade-right style5 fullscreen content-align-center image-position-center;"
|
|
||||||
style="background-size:cover;background-repeat:no-repeat;background-position: center;min-height: 100vh;">
|
|
||||||
<div
|
|
||||||
style="z-index:0;position:absolute; top:0; left:0; width:100%;min-height:100%;background-color: rgba(13, 13 ,13, 0.5);">
|
|
||||||
</div>
|
|
||||||
<div class="content" style="z-index:1">
|
|
||||||
<h1 style="margin-top:80px">{{ page.title }}</h1>
|
|
||||||
|
|
||||||
<p>{{ page.description }}</p>
|
|
||||||
<ul class="actions stacked">
|
|
||||||
<li><a href="#music" class="button small smooth-scroll">Gimme Music!</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="image">
|
|
||||||
<img src="{{ relBase }}{{ page.logo_image }}" alt="{{ site.title }} logo" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Radio -->
|
|
||||||
<section
|
|
||||||
id="music"
|
|
||||||
class="banner onload-image-fade-in onload-content-fade-right style3 fullscreen content-align-left image-position-center">
|
|
||||||
<div style="z-index:0;position:absolute; top:0; left:0; width:100%;min-height:100%;"></div>
|
|
||||||
|
|
||||||
<div id="mainwrap" class="content" style="z-index:1">
|
|
||||||
<h1 style="margin-top:80px">Radio</h1>
|
|
||||||
<div id="radioPlaceholder"></div>
|
|
||||||
<p><strong><span id="tracktime"></span></strong><br /></p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<ul class="actions stacked">
|
|
||||||
<li><button id="mu_pause" class="button small icon solid fa-play">Play!</button></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="noJSalbum" style="z-index:1000;">
|
|
||||||
<h1 style="margin-top:80px">Radio</h1>
|
|
||||||
<div id="radioPlaceholder"></div>
|
|
||||||
<p><strong><span id="tracktime"></span></strong><br /></p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<a href="https://radio.basspistol.com/radio.mp3" id="mu_pause" class="button smaller icon solid fa-play">MP3</a> <a href="https://radio.basspistol.com/radio.ogg" id="mu_pause" class="button smaller icon solid fa-play">OGG</a>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="image">
|
|
||||||
<img src="{{ relBase }}/assets/vid/radio.jpg" alt="{{ page.title }} logo" id="coverart" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Audio player-->
|
|
||||||
|
|
||||||
<audio 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.ogg" type="audio/ogg" ontimeupdate='updateTrackTime(this);' />
|
|
||||||
<h1>Your browser isn't ready for so much hotness. Use the download-link instead.</h1>.
|
|
||||||
</audio>
|
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
function loadUrl(newLocation) {
|
|
||||||
window.location = newLocation;
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
var mu = document.getElementsByTagName("audio")[0];
|
|
||||||
var pauseButton = document.getElementById("mu_pause");
|
|
||||||
var spincover = document.getElementById("coverart");
|
|
||||||
var links = document.getElementsByTagName('a');
|
|
||||||
|
|
||||||
mu.addEventListener('ended', function () {
|
|
||||||
// only functional if "loop" is removed
|
|
||||||
mu.pause();
|
|
||||||
mu.currentTime = 0;
|
|
||||||
loadUrl("{{ relBase }}/{{ page.nextTrack.slug }}/"); return false;
|
|
||||||
});
|
|
||||||
mu.onplaying = function() {
|
|
||||||
pauseButton.innerHTML = "Pause";
|
|
||||||
pauseButton.classList.remove("fa-play");
|
|
||||||
pauseButton.classList.add("fa-pause");
|
|
||||||
spincover.classList.add("spinnit");
|
|
||||||
spincover.classList.remove("paused");
|
|
||||||
for (var i=0, len=links.length; i < len; i++) {
|
|
||||||
links[i].target = '_blank';
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
pauseButton.addEventListener("click", function () {
|
|
||||||
if (mu.paused) {
|
|
||||||
mu.play();
|
|
||||||
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
mu.pause();
|
|
||||||
pauseButton.innerHTML = "Resume";
|
|
||||||
pauseButton.classList.add("fa-play");
|
|
||||||
pauseButton.classList.remove("fa-pause");
|
|
||||||
spincover.classList.add("paused");
|
|
||||||
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
mu.addEventListener('timeupdate', function () {
|
|
||||||
var timestamp = Math.floor(mu.currentTime);
|
|
||||||
var hours = Math.floor(timestamp / 60 / 60);
|
|
||||||
var minutes = Math.floor(timestamp / 60) - (hours * 60);
|
|
||||||
var seconds = timestamp % 60;
|
|
||||||
var formatted = hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0');
|
|
||||||
var thecurrentSpan = document.getElementById("tracktime");
|
|
||||||
thecurrentSpan.innerHTML = formatted;
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
<!-- End Radio -->
|
|
||||||
{% include streamer.html %}
|
|
||||||
<!-- Posts -->
|
|
||||||
|
|
||||||
{% for post in site.posts limit: '2' %}
|
|
||||||
|
|
||||||
<section id="album{% increment var %}"
|
|
||||||
class="section-shadow banner style1 orient-{% cycle 'left', 'right' %} content-align-{% cycle 'right', 'left' %} image-position-center fullscreen onload-image-fade-in onload-content-fade-right">
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<h1>{{ post.title }}</h1>
|
|
||||||
<p>{{ post.description }}</p>
|
|
||||||
{% if post.category == 'releases' %}
|
|
||||||
{% capture album_name -%}
|
|
||||||
{{ post.album }}
|
|
||||||
{%- endcapture %}
|
|
||||||
{% for album in site.albums %}
|
|
||||||
{% capture name -%}
|
|
||||||
{{ album.relative_path | replace_first: album.collection, '' | replace_first: '_/', '' | replace_first: '.md', '' }}
|
|
||||||
{%- endcapture %}
|
|
||||||
{% if name == album_name %}
|
|
||||||
<p>{{ album.date | date: '%Y' }}</p>
|
|
||||||
|
|
||||||
{% for track in album.tracks %}
|
|
||||||
<p style="margin-bottom: 30px;font-size: 14px">
|
|
||||||
<strong>{{ track.common.track.no }}. {{ track.common.title }}</strong><br />
|
|
||||||
<span id="{{ track.common.title | slugify | remove: '-' }}"></span> |
|
|
||||||
<span style="font-size: 14px">{{ track.common.genre }} </span>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
var {{ track.common.title | slugify | remove: '-' }}timestamp = {{ track.format.duration | round }};
|
|
||||||
var {{ track.common.title | slugify | remove: '-' }}hours = Math.floor({{ track.common.title | slugify | remove: '-' }}timestamp / 60 / 60);
|
|
||||||
var {{ track.common.title | slugify | remove: '-' }}minutes = Math.floor({{ track.common.title | slugify | remove: '-' }}timestamp / 60) - ({{ track.common.title | slugify | remove: '-' }}hours * 60);
|
|
||||||
var {{ track.common.title | slugify | remove: '-' }}seconds = {{ track.common.title | slugify | remove: '-' }}timestamp % 60;
|
|
||||||
var {{ track.common.title | slugify | remove: '-' }}formatted = {{ track.common.title | slugify | remove: '-' }}hours.toString().padStart(2, '0') + ':' + {{ track.common.title | slugify | remove: '-' }}minutes.toString().padStart(2, '0') + ':' + {{ track.common.title | slugify | remove: '-' }}seconds.toString().padStart(2, '0');
|
|
||||||
var theSpan = document.getElementById("{{ track.common.title | slugify | remove: '-' }}");
|
|
||||||
theSpan.innerHTML = {{ track.common.title | slugify | remove: '-' }}formatted;
|
|
||||||
</script>
|
|
||||||
{% endfor %}
|
|
||||||
{% break %} {% endif %} {% endfor %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<br />
|
|
||||||
<ul class="actions stacked">
|
|
||||||
|
|
||||||
<li><a href="{{ relBase }}{{ post.url }}"
|
|
||||||
class="button small {% if post.category == 'releases' %}icon solid fa-volume-up{% endif %}">{% if post.category == 'releases' %}Listen{% else %}Read more{% endif %}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="image">
|
|
||||||
<img src="{{ relBase }}{{ post.image }}" alt="{{ post.title }}" title="{{ post.title }}" />
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Releases -->
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<section class="wrapper style1 align-center">
|
|
||||||
<div class="inner" style="padding-top: 40px;">
|
|
||||||
<h2>Releases</h2>
|
|
||||||
<p>Collection of releases through time</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{% assign sorted = site.albums | sort: 'date' | reverse %}
|
|
||||||
{% for album in sorted %}
|
|
||||||
|
|
||||||
<section class="spotlight style5 orient-{% cycle 'left', 'right' %} content-align-{% cycle 'right', 'left' %} image-position-center onscroll-image-fade-in" {% if forloop.index == 1 %}style="box-shadow: none;" {% endif %}>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<h3>{{ album.title }}</h3>
|
|
||||||
<p>{{ album.date | date: "%Y" }}</p>
|
|
||||||
<!-- <p>{{ artist.bio }}</p> -->
|
|
||||||
|
|
||||||
<ul class="actions stacked">
|
|
||||||
<li><a href="{{ album.url }}" style="text-decoration:none;" class="button small icon solid fa-volume-up">Listen</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="image">
|
|
||||||
<img src="{{ site.mediaurl }}/{{ album.slug }}/{{ album.tracks[0].trackSlug }}.jpeg" alt="{{ album.title | smartify }}" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
<!-- END Insta -->
|
|
||||||
|
|
||||||
{% include footer.html %}
|
|
||||||
|
|
@ -50,7 +50,7 @@ layout: default
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p><a class="button" href="{{ relBase }}{{ post.url }}">Read Highlight</a></p>
|
<p><a class="button" href="{{ relBase }}{{ post.url }}">🔊 play this release</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,7 @@ layout: default
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p><a class="button" href="{{ relBase }}{{ post.url }}">Read Highlight</a></p>
|
<p><a class="button" href="{{ relBase }}{{ post.url }}">📰 Read Highlight</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -22,7 +22,7 @@ image: /assets/vid/links.jpg
|
||||||
|
|
||||||
<div style="background-image:url({{ post.image }})">
|
<div style="background-image:url({{ post.image }})">
|
||||||
<p class="editor-link"><a href="cloudcannon:collections/_posts/{{ post.path }}" rel="nofollow"
|
<p class="editor-link"><a href="cloudcannon:collections/_posts/{{ post.path }}" rel="nofollow"
|
||||||
class="btn"><strong>✎</strong> Edit Posy</a></p>
|
class="btn"><strong>✎</strong> Edit Post</a></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="description">
|
<div class="description">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
@ -33,7 +33,7 @@ image: /assets/vid/links.jpg
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p><a class="button" href="{{ post.url }}" rel="noopener" target="_blank">{{ post.title }}</a></p>
|
<p><a class="button" href="{{ post.url }}" rel="noopener" target="_blank">🔗 {{ post.title }}</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
27
log.html
27
log.html
|
|
@ -1,27 +0,0 @@
|
||||||
---
|
|
||||||
title: Web-Log
|
|
||||||
description: 'highlights, announcenments and thoughts going on in the 徒 setto セット Cypher. In written form intertwined with audio'
|
|
||||||
image: /images/pages/4-darkweb-instrumental-.jpeg
|
|
||||||
---
|
|
||||||
|
|
||||||
{% include relBase.html %}
|
|
||||||
{% include header.html %}
|
|
||||||
<section>
|
|
||||||
<h2>Latest News</h2>
|
|
||||||
</section>
|
|
||||||
{% for post in site.posts %}
|
|
||||||
{% if post.category == 'highlights' %}
|
|
||||||
<section class="news" style="margin:0;">
|
|
||||||
|
|
||||||
<div style="background-image:url({{ relBase }}{{ post.image }}"></div>
|
|
||||||
<div class="description">
|
|
||||||
<h2>{{ post.title }}</h2>
|
|
||||||
<p><strong>{% include forloop-dates.html %}</strong></p>
|
|
||||||
<p>{{ post.description }}</p>
|
|
||||||
<p><a href="{{ relBase }}{{ post.url }}" class="button">Read post</a></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
</section>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
Loading…
Reference in a new issue