{% extends 'base.html' %}

{% load static %}

{% block title %} Deployments board {% endblock %}

{% block headscript %}
    <script src="{% static 'django_eventstream/json2.js' %}"></script>
    <script src="{% static 'django_eventstream/eventsource.min.js' %}"></script>
    <script src="{% static 'django_eventstream/reconnecting-eventsource.js' %}"></script>
{% endblock %}

{% block bodyattr %}
    onload="start('{{ url|safe }}');"
{% endblock %}

{% block content %}
    {% if user.is_authenticated %}
        <table class="table table-striped table-hover">
            <tr>
                <th scope="col-3">Name</th>
                <th scope="col-3">Type</th>
                <th scope="col-3">Status</th>
                <th class="col-1"></th>
                <th class="col-2"></th>
            </tr>
            {% for deployment in page_obj %}
                <tr id="{{ deployment.id }}">
                    <th name="name">{{ deployment.name }}</th>
                    <th name="type">{{ deployment.type }}</th>
                    <th name="status">{{ deployment.status }}</th>
                    <th>
                        <a href="{% url 'deployment-details' deployment.id %}">
                            <button class="btn btn-primary">Details</button>
                        </a>
                    </th>
                    {% if deployment.status == "FAILED" or deployment.status == "READY" %}
                        <th name="deploy">
                            <form action="{% url 'deployment-launch' deployment.id %}?page={{ page_obj.number }}" method="post">
                                {% csrf_token %}
                                <button class="btn btn-success" type="submit">Deploy</button>
                            </form>
                        </th>
                    {% elif deployment.status == "RUNNING" %}
                        <th name="deploy">
                            <button class="btn btn-primary" type="button" disabled>
                                <span class="spinner-border spinner-border-sm" aria-hidden="true"></span>
                                <span role="status">Deploy</span>
                            </button>
                        </th>
                    {% else %}
                        <th></th>
                    {% endif %}
                </tr>
            {% endfor %}
        </table>
        {% include 'pagination.html' %}
        <a class="btn btn-success" href="{% url 'deployment-create' %}" role="button">Create</a>
    {% else %}
        <div class="row justify-content-md-center">
            <div class="col-lg-8 col-md-8 col-sm-6">
                <h4 style="text-align: center;">Please log in !</h4>
            </div>
        </div>
    {% endif %}
{% endblock %}

{% block script %}
    <script src="{% static 'deployment/js/event_source.js' %}" />
    </script>
{% endblock %}