{% extends 'base.html' %}
{% load i18n %}
{% load static %}
{% load url from future %}

{% block title %}{% trans "Applications" %}{% endblock %}

{% block page_header %}
    <link rel="stylesheet" href="{% static 'muranodashboard/css/catalog.css' %}">
    <link rel="stylesheet" href="{% static 'horizon/lib/font-awesome/css/font-awesome.min.css' %}">
    {% include "horizon/common/_page_header.html" with title=_("Applications") %}
{% endblock page_header %}

{% block js %}
    {% include "horizon/_scripts.html" %}
{% endblock %}

{% block main %}
    <div class="table_wrapper">
        <h3 class="quota-heading">Recent Activity</h3>
        {% if latest_list|length > 0 %}
            <div class="app-row app-list">
                {% for app in latest_list %}
                    {% include 'catalog/app_tile.html' %}
                {% endfor %}
            </div>
        {% else %}
            <div class="alert alert-block alert-info fade in">
                <p>{% trans "No recent activity to report at this time." %}</p>
            </div>
        {% endif %}

        <div class="table_header catalog col-xs-12 col-sm-12 col-md-12 col-lg-12 col-row clearfix">

            <div class="table_actions clearfix row">
                <div class="col-xs-12 col-sm-3 col-md-4 col-lg-4 col-row">
                    <h3 class="heading_switcher">App Category: <div class="header dropdown">
                    <a href="#" class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown">
                        {{ current_category }}  <b class="caret"></b></a>
                      <ul class="dropdown-menu row_actions clearfix">
                          {% for category in categories %}
                            <li class="clearfix"><a tabindex="-1" href="
                            {% url 'horizon:murano:catalog:index' %}?category={{ category|urlencode }}" class="btn btn-small">
                                {{ category }}</a></li>
                          {% endfor %}
                      </ul>
                    </h3>
                </div>

                <div class="col-xs-12 col-sm-3 col-md-4 col-lg-4 col-row">
                    {% include 'catalog/env_switcher.html' %}
                </div>

                <div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-row">
                    <div class="table_search client pull-right">
                        <form class="search" method="GET" action="{% url 'horizon:murano:catalog:index' %}">
                            <div class="form-group has-feedback">
                                <input class="form-control" value="{{ search }}" type="text" name="search" placeholder="Filter">
                                <span class="glyphicon glyphicon-search form-control-feedback"></span>
                            </div>
                            <div class="form-group">
                                <button type="submit" class="btn btn-default btn-sm" id="apps__action_filter">Filter</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

        </div>

        {% if object_list|length > 0 %}
            <div class="app-row app-list row">
                {% for app in object_list %}
                    {% include 'catalog/app_tile.html' %}
                {% endfor %}
            </div>
        {% else %}
            <div class="row">
                <div class="alert alert-block alert-info fade in">
                    <p>{% trans "There are no applications matching your search criteria." %}</p>
                </div>
            </div>
        {% endif %}

        <div class="row">
            <div class="btn-toolbar centering">
              <div class="btn-group">
                  {% if view.has_prev_page %}
                      <a class="btn btn-default" href="{{ view.prev_page_url }}">Previous Page</a>
                  {% endif %}
                  {% if view.has_next_page %}
                      <a class="btn btn-default" href="{{ view.next_page_url }}">Next Page</a>
                  {% endif %}
              </div>
            </div>
        </div>

    </div>
{% endblock %}
