{% extends "base.html" %}
<!-- Load Internationalization utils-->
{% load i18n %}
{% load static %}
{% load rules %}

{% block title %}{% trans 'Routes Information' %} {% endblock %}

{% block extrahead %}
    {% load leaflet_tags %}
    {% leaflet_css %}

    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" rel="stylesheet">
{% endblock %}

{% block content %}
{% has_perm 'sous_chef.edit' request.user as can_edit_data %}

{% include 'kitchen_count_steps.html' with step='routes' %}

<div class="ui secondary pointing fluid menu">
    <h1 class="ui header">{% trans "Delivery routes" %}</h1>
    <div class="right menu">
      <div class="ui item"><h3><i class="calendar icon"></i>{{ delivery_date }}</h3></div>
    </div>
</div>

<div class="row">
    <div class="column">
        <a href="?delivery_date={{ delivery_date.isoformat }}&download=yes" class="ui big labeled icon right basic pink button {% if not all_configured %}disabled{% endif %}" title="{% trans 'Download the route sheets report' %}">
            <i class="download icon"></i>{% trans 'Route Sheets' %}
        </a>
        <i class="help-text question pink icon link" data-content="{% trans 'This is activated after organising all deliverable routes.' %}"></i>
    </div>
</div>

<div class="row">
    <div class="sixteen wide column">
      <div class="ui middle aligned divided list">
          {% for route, order_count, has_organised, delivery_history in route_details %}
          <div class="item">
            <div class="right floated content">
              {% if order_count == 0 %}
              {# This route has no orders. No need to display useless buttons. #}
              {% elif has_organised == 'no' %}
              {# The delivery history instance doesn't exist yet. #}
              <form action="{% url 'delivery:create_delivery' pk=route.pk %}" method="post">
                {% csrf_token %}
                <input type="hidden" name="delivery_date" value="{{ delivery_date.isoformat }}">
                <button class="ui compact labeled icon button" title="{% trans "View, adjust and confirm today's route sequence" %}">
                  <i class="marker icon"></i>{% trans 'Confirm' %}
                </button>
                <a class="ui compact labeled disabled icon button">
                  <i class="list layout icon"></i>{% trans 'Route sheet' %}
                </a>
              </form>
              {% elif has_organised == 'invalid' %}
              {# The client sequence of the delivery history doesn't match the orders. #}
              <a href="{% url 'delivery:edit_delivery_route' pk=route.pk %}?delivery_date={{ delivery_date.isoformat }}" class="ui compact labeled red icon button" title="{% trans 'Clients have changed, please reconfirm.' %}">
                  <i class="warning icon"></i>{% trans 'Modified' %}
              </a>
              <a class="ui compact labeled disabled icon button">
                <i class="list layout icon"></i>{% trans 'Route sheet' %}
              </a>
              {% else %}
              {# Configured. #}
              <a href="{% url 'delivery:edit_delivery_route' pk=route.pk %}?delivery_date={{ delivery_date.isoformat }}" class="ui compact labeled gray icon button" title="{% trans 'View or edit the organised route' %}">
                  <i class="checkmark icon"></i>{% trans 'Organised' %}
              </a>
              <a href="{% url 'delivery:route_sheet' pk=route.pk %}?delivery_date={{ delivery_date.isoformat }}" class="ui compact labeled icon button" title="{% trans 'Print the route sheet' %}">
                  <i class="list layout icon"></i>{% trans 'Route sheet' %}
              </a>
              {% endif %}
            </div>
            <i class="large location arrow icon"></i>
            <div class="content">
              <div class="header">{{ route.name }}</div>
              <div class="description">
                {% if delivery_history.vehicle == 'cycling' or route.vehicle == 'cycling' %}
                  <i class="bicycle circular icon" title="{% trans 'Cycling' %}"></i>
                {% elif delivery_history.vehicle == 'driving' or route.vehicle == 'driving' %}
                  <i class="car circular icon" title="{% trans 'Driving' %}"></i>
                {% elif delivery_history.vehicle == 'walking' or route.vehicle == 'walking' %}
                  <i class="male circular icon" title="{% trans 'Walking' %}"></i>
                {% endif %}
                  <div class="ui circular pink basic label" title="{% trans 'Number of orders on this route' %}">{{ order_count }}</div>
              </div>
            </div>
          </div>
          {% endfor %}
      </div>
  </div>
</div>

{% if can_edit_data %}
<a class="ui labeled icon big button" href="{% url 'delivery:kitchen_count' %}?delivery_date={{ delivery_date.isoformat }}">
    <i class="chevron left icon"></i>{% trans "Back" %}
</a>
{% endif %}

{% endblock %}

{% block extrajs %}
    {% leaflet_js %}
    {% if debug %}
        <script src="{% static 'js/leaflet.js' %}" type="application/javascript"></script>
    {% else %}
        <script src="{% static 'js/leaflet.min.js' %}" type="application/javascript"></script>
    {% endif %}
{% endblock %}
