{% load i18n static %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{% block title %}Django Scrum Board{% endblock title %}</title>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" href="{% static "css/django_scrumboard.css" %}">
  </head>
  <body>
    <div class="wrapper">
      <header class="clear">
        <ul>
          <li>{% trans "Rejected" %}</li>
          <li>{% trans "Pending" %}</li>
          <li>{% trans "Developement" %}</li>
          <li>{% trans "Testing" %}</li>
          <li>{% trans "Done" %}</li>
        </ul>
      </header>
      <section id="dashboard" class="dashboard clear">
        <div id="rejected" class="rejected"></div>
        <div id="pending" class="pending"></div>
        <div id="development" class="development"></div>
        <div id="testing" class="testing"></div>
        <div id="production" class="production"></div>
      </section>

      <footer>
        <ul>
          <li class="branding">{% trans "Django Scrum <span>Board</span> <sup>Beta</sup>" %}</li>
        </ul>

        <ul class="controls">
          <li data-tooltip="{% trans "Drag to here to delete" %}">
            <a href="#" class="remove" id="remove">
              <img src="{% static "img/bin.svg" %}" alt="">
            </a>
          </li>
          <li data-tooltip="{% trans "Add" %}">
            <a href="#" id="add-task" class="add-task">
              <img src="{% static "img/plus.svg" %}" alt="">
            </a>
          </li>
          <li data-tooltip="Github" class="github-ref">
            <a href="https://github.com/delneg/django-scrumboard" target="_blank">
              <img src="{% static "img/github.svg" %}" alt="">
            </a>
          </li>
        </ul>
      </footer>
    </div>

    <div id="task-notification" class="removed-task-notification hide"></div>
    <div id="offline" class="offline-notification hide">OFFLINE</div>

    <div class="modal hide" id="add-task-modal">
      <div class="modal-wrapper">
        <form action="index.html" method="post" id="add-task-form" class="add-task-form" name="add_task">{% csrf_token %}
          <span class="close-modal">X</span>

          <h3>{% trans "Add" %}</h3>

          {{ form.non_field_errors }}
            <ul>
                <li>
                    {{ form.title }}
                </li>
                <li>
                    {{ form.description }}
                </li>
                <li>
                    {{ form.url }}
                </li>
                <li>
                    {{ form.assigned_to }}
                </li>
                <li>
                    <input type="submit" name="create_task" value="{% trans "Create task" %}">
                </li>
            </ul>
        </form>
      </div>

      <div class="create-task-branding">
        {% trans "Django Scrum <span>Board</span> <sup>Beta</sup>" %}
      </div>
    </div>

    <div class="hide" id="tips">
      {% trans "Double click on the task text to edit it, double click again to stop" %} <br> <span>({% trans "Task titles are not editable for now" %})</span>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
    <script src="{% static "js/lib/handlebars-v4.0.5.js" %}" charset="utf-8"></script>
    <script src="{% static "js/helper.js" %}"></script>
    <script src="{% static "js/localstorage.js" %}" charset="utf-8"></script>
    <script src="{% static "js/remotestorage.js" %}" charset="utf-8"></script>
    <script src="{% static "js/django_scrumboard.js" %}" charset="utf-8"></script>
  </body>
</html>
