Untitled

<section>
	{% for track in tracklist | reverse %}
		{% if track.data.audiofile %}
		
		{# NJK-muuttuja ja oma filtteri joka strippaa väliviivat ja turhia kansionimiä pois #}
		{% set audioID = track.outputPath | stripForJS %}

		<article{% if track.url == url %} data-current="current item" {% endif %}>
			<h3 id="{{audioID}}-heading">
				<a href="{{ track.url | url }}">
					{% if track.data.title %}
					{{ track.data.title }}
					{% else %}
					Untitled
					{% endif %}
				</a>
			</h3>
			<div id="{{audioID}}-player"></div>
			<script>
				var {{audioID}} = WaveSurfer.create({
					container: '#{{audioID}}-player',
					backend: 'MediaElement'
				});
				{{audioID}}.load('{{ track.data.audiofile }}');
			</script>

			<button id="playPause" onclick="{{audioID}}.playPause()"></button>
			{% if track.data.description %}
				<p>
					{{ track.data.description }}
				</p>
			{% endif %}
			<p>
				<time datetime="{{ track.date | machineDate }}">
					<small>{{ track.date | readableDate }} by <a href="/authors/{{ track.data.artist | slug }}/">{{ track.data.author }}</a></small>
				</time>
			</p>

			{% if track.data.tags %}
				<p>
					{% for tag in track.data.tags %}
					{%- if tag != "track" -%}
					{% set tagUrl %}/tags/{{ tag }}/{% endset %}
					<a href="{{ tagUrl | url }}" rel="tag">{{ tag }}</a>
					{%- endif -%}
					{% endfor %}
				</p>
			{% endif %}
		</article>
		{% endif %}
	{% endfor %}
</section>