aircox-radiocampus/aircox_cms/templates/aircox_cms/sections/playlist.html

{% extends 'aircox_cms/sections/item.html' %}

{% load staticfiles %}
{% load i18n %}
{% load aircox_cms %}

{% block content %}
{% with playlist_id="playlist"|gen_id %}
<a-playlist class="playlist" id="{{ playlist_id }}">
    <noscript>
        {% for track in tracks %}
        <li class="item">
            <span class="name">{{ track.name }} ({{ track.duration|date:"H\"i's" }}): </span>
            <span class="podcast">
            {% if not track.embed %}
            <audio src="{{ track.url|escape }}" controls>
            {% else %}
            {{ track.embed|safe }}
            {% endif %}
            </span>
        </li>
        {% endfor %}
    </noscript>
    <script>
        window.addEventListener('load', function() {
            var playlist = new Playlist({
                data: {
                    id: "{{ playlist_id }}",
                    {% if is_default %}
                    default: true,
                    {% endif %}
                    {% if single_mode %}
                    single_mode: true,
                    {% endif %}
                    {% if modifiable %}
                    modifiable: true,
                    {% endif %}
                    {% if storage_key %}
                    storage_key: "{{ storage_key }}",
                    {% endif %}
                    tracks: [
                        {% for track in tracks %}
                        new Track({{ track.to_json }}),
                        {% endfor %}
                    ],
                },
            });
            playlist.$mount('#{{ playlist_id }}');
        }, false);
    </script>
</a-playlist>
{% endwith %}
{% endblock %}