{% extends 'game/base.html' %}
{% load static %}
{% load i18n %}

{% block title %}Code for Life - Rapid Router - Level moderation{% endblock %}

{% block scripts %}
{{block.super}}
<script src="{% static 'game/js/jquery.tablesorter.min.js' %}"></script>
<script type="text/javascript" src="{% static 'game/js/saving.js' %}"></script>
<script type="text/javascript" src="{% static 'game/js/level_moderation.js' %}"></script>
<script type="text/javascript" src="{% static 'game/js/foundation/vendor/js.cookie.min.js' %}"></script>
<script>
    var students = {% if students %} true {% else %} false {% endif %};
</script>
{% endblock %}

{% block css %}
{{block.super}}
<link href="{% static 'game/css/level_moderation.css' %}" rel="stylesheet" type="text/css">
{% endblock %}

{% block nav_ocargo_moderate %}
<a class="button button--secondary button--secondary--light" style="background-color: white; color: #fa1664;" href="{% url 'level_moderation' %}">{% trans "Moderate" %}</a>
{% endblock nav_ocargo_moderate %}

{% block content %}
<div class="background">
    <h4 class="text-center">{% trans "Level moderation" %}</h4>
    <div class="container">
        <div>
            <h5>{% trans "Filter levels" %}</h5>
            <p>{% trans "Filter the levels by class and student, and click 'Submit' to see the student's levels." %}</p>
            <div id="form" class="form">
                <form action="" method="post" id="levelModerationForm" class="form-row">
                    {% csrf_token %}
                    <div class="form-group col-md-6">
                        <label> {% trans "Class:" %} </label>
                        {{form.classes}}
                        {{form.classes.errors}}
                    </div>
                    <div class="form-group col-md-6">
                        <label> {% trans "Student:" %} </label>
                        {{form.students}}
                        {{form.students.errors}}
                    </div>
                    <div class="col-md-12 text-right">
                        <button class="button button--primary" type="submit">{% trans "Submit" %}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="mainBody container">
        {% include "portal/partials/popup.html" %}
        {% if levelData %}
        <div class="tableWrapper">
            {% if thead %}
            <table class="header-primary data-primary">
                <tr>
                    {% for header in thead %}
                    <th> {{header}} </th>
                    {% endfor %}
                </tr>

                {% for level in levelData %}
                <tr>
                    <td> {{level.student}} </td>
                    <td> {{level.name}} </td>
                    <td> {{level.shared_with}} </td>
                    <td> <button class="button button--small button--primary play" value={{level.id}}>{% trans "Play" %}</button> </td>
                    <td> <button class="button button--small button--primary--danger delete" value={{level.id}}>{% trans "Delete" %}</button> </td>
                </tr>
                {% endfor %}
            </table>
            {% endif %}
        </div>
        {% else %}
            {% if thead %}
            <p>{% trans "No levels found." %}</p>
            {% else %}
            <p>{% trans "Select a class and student to view their created levels." %}</p>
            {% endif %}
        {% endif %}
    </div>
</div>
{% endblock %}
