{% extends 'buybackprogram/page.html' %}
{% load i18n %}
{% load humanize %}
{% load bootstrap %}
{% load static %}

{% block body %}
<div class="panel-heading">
  <h3 class="panel-title">Buyback locations</h3>
</div>
<div class="panel-body" style="min-height: 100px;">
  <div>
    <form class="form" action="{% url 'buybackprogram:location_add' %}" method="POST">
      {% csrf_token %}
      {{ form|bootstrap }}
      <button type="submit" class="btn btn-primary">Add location</button>
    </form>
  </div>
  <div class="table-responsive" style="margin: 20px 0;">
    <table id="locations" style="margin: 20px auto;" class="table table-striped table-condensed">
      <thead>
        <th>Solar System</th>
        <th style="text-align: center;">Name</th>
      </thead>
      <tbody>
        {% for location in locations %}
          <tr>
            <td>{{location.eve_solar_system.name}}</td>
            <td style="text-align: center;">{{location.name}}</td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}

{% block extra_javascript %}
<script type="text/javascript" src="{% static 'buybackprogram/js/bootstrap-autocomplete.min.js' %}"></script>
<script type="text/javascript" src="{% static 'buybackprogram/js/autocomplete.js' %}"></script>
{% endblock %}

{% block extra_css %}
{% endblock %}

{% block extra_script %}
{% endblock %}
