{% load i18n %}
<div class="row" ng-controller="CartList">
  <div class="col-md-3">
    <div class="row">
      <div class="col-xs-12">
        {% load base_tags %}
        <nav class="filter">
            <h4><a href="" class="toggle toggle-nav">
                    <i class="fa fa-chevron-down"></i>
                    {% trans "search" %}
                </a></h4>
            <ul class="nav open" id="text">
                <li>
                    <div class="input-group">
                    <input name="text_search_input" id="text_search_input" ng-model="text_query" type="text"
                           placeholder="Search by name" class="form-control" data-query-key='name__icontains'>
                    <span class="input-group-btn">
                        <button class="btn btn-primary" type="submit" id="text_search_btn"><i class="fa fa-search"></i></button>
                    </span>
                    </div>
                </li>
            </ul>
        </nav>
        {% if facet_type == 'groups' %}

        <nav class="filter">
          <h4><a href="#" class="toggle toggle-nav"><i class="fa fa-chevron-right"></i>{% trans "Categories" %}</a></h4>
          <ul class="nav closed" id="groupcategories">
            {% verbatim %}
              <li ng-repeat="category in categories" ng-if="category.member_count > 0">
                <a data-value="{{ category.slug }}" data-filter="categories__slug"
                 ng-click="multiple_choice_listener($event)" class="{{category.active}}"><div class="fa-stack fa-1g"><i class="fa fa-square-o fa-stack-2x"></i><i class="fa {{category.fa_class}} fa-stack-1x"></i></div>{{ category.name | limitTo: 25 }}{{ category.name.length > 25 ? '...' : ''}}
                  <span class="badge pull-right">{{ category.member_count }}</span>
                </a>
              </li>
            {% endverbatim %}
          </ul>
        </nav>

        {% endif %}
      </div>
    </div>

  </div>
  <div class="col-md-9">
    <div class="col-md-2">
      <span>Total: </span>
      <span ng-bind="total_counts"></span>
    </div>
    {% include "search/_sort_filters.html" %}
    <div class="col-md-12 grid-spacer">
        {% if facet_type == 'groups' %}
            {% include 'search/_group_snippet.html' %}
        {% elif facet_type == 'groupcategories' %}
            {% include 'search/_groupcategory_snippet.html' %}
        {% elif facet_type == 'people' %}
            {% include "people/_profile_list_item.html" %}
        {% endif %}
    </div>
    {% include 'search/_pagination.html' %}
  </div>
</div>
