{% extends "base.htm" %}
{% load i18n %}
{% load staticfiles %}
{% block css %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static 'css/plugins/bootstrap-slider.min.css' %}">    
{% endblock css%}
{% block content %}

<!--=== Search Block ===-->
<div class="search-block">
    
    <!-- Search Terms -->
    <div class="container">
        <div class="row">
            
            <!-- Search Widget -->
            <div class="col-xs-12 col-md-7 col-lg-8">
                <div class="form-group">       
                    <input class="select2 resource_search_widget" name="" style="width:100%" placeholder="{% trans "Search for a resource..." %}" value="">
                </div>
            </div>
            <!-- End Search Widget -->


            <!-- Advanced Search Option -->
            <div class="col-xs-12 col-md-5 col-lg-4">

                <button class="btn btn-success btn" id="map-filter-button" style=""> 
                    <i class="fa fa-map-marker" style="padding-right:8px;"></i>{% trans "Location Filter" %}
                </button>

                <button class="btn btn-success btn" id="time-filter-button" style=""> 
                    <i class="fa fa-clock-o" style="padding-right:8px;"></i>{% trans "Time Filter" %}
                </button>
                

                <div class="btn-group pull-right">
                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                        {% trans "Tools" %}
                        <i class="fa fa-chevron-down"></i>
                        <span class="sr-only">{% trans "Toggle Dropdown" %}</span>                            
                    </button>
                    <ul class="dropdown-menu" role="menu">
                        <li><a href="javascript:void(0);" id="view-saved-searches">{% trans "View Popular Searches" %}</a></li>
                        <li class="divider"></li>
                        <li><a href="#">{% trans "Export results to .SHP" %}</a></li>
                        <li><a href="#">{% trans "Export results to .CSV" %}</a></li>
                        <li class="divider"></li>
                        <li><a href="javascript:void(0);" id="clear-search">{% trans "Clear Search" %}</a></li>
                    </ul>
                </div>
            </div>
            <!-- End Advanced Search Option -->
        </div>
    </div>
    <!-- End Search Terms -->  

</div>    
<!--=== End Search Block ===-->


<!--=== Default Resource Summary ===-->
<div class="container margin-bottom-50">

    <div class="row" id="saved-searches" style="margin-left:0px; margin-right:0px;">
        <!-- Results Header -->
        <h2 style="margin-bottom:8px;">
            <div class="row">        
                <div class="col-xs-12">
                    <span class="text-muted" style="margin-bottom: 5px;">{% trans "Popular Searches:" %}</span>                                 
                </div>
            </div>
        </h2>   
        <!-- Results Header -->

        {% include 'views/saved-searches.htm' %}
    </div>

    <div class="row" id="search-results" style="margin-left:0px; margin-right:0px;">
       <!-- Results Header -->
        <h2 style="margin-bottom:8px;">
            <div class="row" id="search-results-count" data-count="">        
                <div class="col-xs-12" data-bind="if: total() >= 0">
                    <span class="" style="font-size:23px;" data-bind="text: total() + ' {% trans "Results" %}'"></span>                               
                </div>
            </div>
        </h2>   
        <!-- Results Header -->      
          
        <div class="s-results margin-bottom-50">
            <div class="row" id="map-filter-container" data-filtertext="{% trans "Map Filter Enabled" %}" style="margin-right: 20px;"> 
                {% include 'views/search/map-filter.htm' %}
            </div>
            <div class="row" id="time-filter-container" data-filtertext="{% trans "Time Filter Enabled" %}"> 
                {% include 'views/search/time-filter.htm' %}
            </div>
            <div class="row" id="search-results-container"> 
                {% include 'views/search/search-results.htm' %}
            </div>
        </div>
    </div>

</div>

{% endblock content %}
