{% extends "core/navigation.html" %}
{% load static %}
{% load django_vite %}

{% block css %}
    <link rel="stylesheet" href="https://unpkg.com/vue-multiselect@2.1.0/dist/vue-multiselect.min.css">
    <link rel="stylesheet" href="{% static 'css/core/group_playlist.css' %}">
{% endblock %}

{% block content %}
    <h5>{{ title }}</h5>
    <br/>
    <div id="vue_app">
        {% csrf_token %}

        {% if is_host %}
            <play-dynamic-playlist-host></play-dynamic-playlist-host>
        {% else %}
            <play-dynamic-playlist-listener></play-dynamic-playlist-listener>
        {% endif %}
    </div>
{% endblock %}

{% block javascript %}
    {% vite_asset 'src/main.js' %}
    <script>window.context = {{ json_context | safe }};</script>
{% endblock %}