{% extends "syncro_frontend/base.html" %}
{% block content %}
<script src="/static/script/syncro_series.js"></script>
<div class="container p-2 pt-4">
    <h1 class="mt-5">TV Series</h1>
    <table class="table">
        <thead>
        <tr>
            <th scope="col">Name</th>
            <th scope="col">Active</th>
        </tr>
        </thead>
        <tbody>
        {% for serie in series %}
        <tr>
            <th scope="row">{{ serie.name }}</th>
            <td>
                <div class="btn-group" role="group" aria-label="Basic radio toggle button group">
                    <input type="radio" class="btn-check" name="{{serie.uid}}" id="btnenabled_{{serie.uid}}"
                           autocomplete="off" {% if serie.uid in checkedseries %}checked{% endif %}>
                    <label class="btn btn-outline-primary" for="btnenabled_{{serie.uid}}">enabled</label>
                    <input type="radio" class="btn-check" name="{{serie.uid}}" id="btndisabled_{{serie.uid}}"
                           autocomplete="off" {% if serie.uid not in checkedseries %}checked{% endif %}>
                    <label class="btn btn-outline-secondary" for="btndisabled_{{serie.uid}}">disabled</label>
                </div>
            </td>
        </tr>

        {% endfor %}
        </tbody>
    </table>
</div>
{% endblock %}