{% extends 'base.html' %}

{% load static %}

{% block title %}deployment's 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();"
{% endblock %}

{% block content %}
  {{ user.username }}'s board
  {% if page_obj %}
    <table>
      <tr>
        <th>name</th>
        <th>type</th>
        <th>status</th>
        <th></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>details</button>
          </a>
        </th>
      </tr>
      {% endfor %}
    </table>
    <div class="pagination">
      <span class="step-links">
          {% if page_obj.has_previous %}
              <a href="?page=1">&laquo; first</a>
              <a href="?page={{ page_obj.previous_page_number }}">previous</a>
          {% endif %}
  
          <span class="current">
              Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
          </span>
  
          {% if page_obj.has_next %}
              <a href="?page={{ page_obj.next_page_number }}">next</a>
              <a href="?page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
          {% endif %}
      </span>
    </div>
  {% else %}
    <p>no deployments available</p>
  {% endif %}
  <a href="/deployment/create">
    <button>create</button>
  </a>
{% endblock %}

{% block script %}
<script>
  var start = function () {

  var es = new ReconnectingEventSource('{{ url|safe }}');

  es.onopen = function () {
    console.log('connected');
  };

  es.onerror = function () {
    console.log('connection error');
  };

  es.addEventListener('deployment', function (e) {
    e = JSON.parse(e.data);
    console.log('stream reset: ' + JSON.stringify(e.channels));
  }, false);
};
</script>
{% endblock %}