{% load i18n %}
{% load static %}
{% load bootstrap3 %}
<!DOCTYPE html>
<html lang="en">
<head>
  <title>{% block title %}{% trans "Enhydris" %}{% endblock %}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {% block js-globals %}{% endblock %}
    {% block basecss %}
      <link href="{% static 'css/enhydris.css' %}" type="text/css" rel="stylesheet" />
      <link media="screen" href="{% static "css/olmap.css" %}" type="text/css" rel="stylesheet" />
      {% bootstrap_css %}
      <link rel="stylesheet" media="screen" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/css/bootstrap-datepicker.min.css">
    {% endblock %}
    {% block shortcut_icon %}{% endblock %}
    {% block extracss %}{% endblock %}
    {% block extra_head %}{% endblock %}
</head>
<body onload="enhydris.map = enhydris.mapModule.init()">
  <div class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="{% url "station_list" %}">{% trans "Stations" %}</a>
      </div>
      <div class="navbar-collapse collapse">
        <form class="navbar-form navbar-left" role="search" action='{% url "station_list" %}' method="get">
          <div class="form-group">
            <div class="input-group">
              <input id="search_input" type="text" name="q"
                value="{{ query|escape }}" class="form-control"
                placeholder="{% trans 'Search stations' %}">
              <input type="hidden" name="check" value="search" />
              <div class="input-group-btn">
                <button class="btn btn-primary btn-block glyphicon glyphicon-search"></button>
              </div>
            </div>
          </div>
          </form>
          <ul class="nav navbar-nav">
            <li>
                <a href="#searchtips" data-toggle="modal">
                  <i class="glyphicon glyphicon-eye-open"></i> {% trans "Search tips" %}
                </a>
            </li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            {% if user.is_authenticated %}
              <li>
                <p class="navbar-text">
                  &nbsp;&nbsp;&nbsp;{% trans "Logged in as" %} <span class="text-success">{{ user }}</span></p>
              </li>
              {% if perms.hcore.add_station %}
                <li>
                    <a href="{% url "station_add" %}">
                      <i class="glyphicon glyphicon-plus"></i> {% trans "New&nbsp;station" %}
                    </a>
                </li>
              {% endif %}
              {% with user.username as user_username %}
                <li>
                    <a href='{% url "current_user_profile" %}'>
                      <i class="glyphicon glyphicon-cog"></i> {% trans "Settings" %}
                    </a>
                </li>
                <li>
                    <a href='{% url "auth_logout" %}?next={{ request.path }}'>
                      <i class="glyphicon glyphicon-log-out"></i> {% trans "Logout" %}
                    </a>
                </li>
              {% endwith %}
            {% else %}
              <li>
                  <a href='{% url "auth_login" %}?next={{request.path}}'>
                    <i class="glyphicon glyphicon-off"></i> {% trans "Login" %}
                  </a>
              </li>
              {% if REGISTRATION_OPEN %}
                <li>
                    <a href='{% url "registration_register" %}'>
                      <i class="glyphicon glyphicon-user"></i> {% trans "Register" %}
                    </a>
                </li>
              {% endif %}
            {% endif %}
          </ul>
        </div> <!-- navbar-collapse -->
    </div> <!--container - fluid -->
  </div> <!-- navbar -->

    <div id="searchtips" class="modal fade" tabindex="-1" role="dialog"
        aria-hidden="true" aria-labelledby="SearchTips">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">{% trans "Search tips" %}
            <button type="button" class="close" data-target="#searchtips"
                data-toggle="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">
            <!-- List group -->
            <ul class="list-group">
              {% blocktrans %}
                <li class="list-group-item">
                  Stations having "diamond" and "emerald" in
                  their name or remarks (or various other fields):
                  <code>diamond&nbsp;emerald</code>
                </li>
                <li class="list-group-item">
                  Meteorological stations owned by George Michael or Boy
                  George or any George:
                  <code>owner:george&nbsp;type:meteorological</code>
                </li>
                <li class="list-group-item">
                  Stations measuring temperature in Celduin:
                  <code>variable:temperature&nbsp;water_basin:celduin</code>
                </li>
                <li class="list-group-item">
                  German stations that have time series:
                  <code>country:germany&nbsp;ts_only:</code>
                </li>
                <li class="list-group-item">
                  Stations that have at least one time series that
                  has values in 1988, at least one time series that has values
                  in 1989, and at least one time series that has values in
                  2004:
                  <code>ts_has_years:1988,1989,2004</code>
                </li>
              {% endblocktrans %}
            </ul>
          </div>
          <div class="modal-footer">
            <a href="#" class="btn" data-dismiss="modal">Close</a>
          </div>
        </div>
      </div>
    </div>

    <div>
      <div>
        {% if notifications %}
        <div class="alerts">
          {% for message in notifications %}
            <div class="alert alert-warning alert-dismissible" role="alert">
              <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <p> {{ message }} </p>
            </div>
          {% endfor %}
        {% endif %}
        {% block messages %}
          {% if messages %}
            <div class="alert alert-info alert-dismissible" role="alert">
              <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <p> {{ message }} </p>
            </div>
          {% endif %}
        {% endblock %}
        {% block content %}
            {% block content_main %}
            {% endblock %}
        {% endblock %}
      </div>
    </div>

  <footer>
    {% block footer %}
      {% block footerlinks %}{% endblock %}
      {% block powered %}{% endblock %}
      {% block extrafooter %}{% endblock %}
    {% endblock %}
  </footer>

{% block bodyend %}{% endblock %}
  </div>

{% block basejs %}
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  {% bootstrap_javascript %}
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/openlayers/2.12/OpenLayers.min.js"></script>
  <script type="text/javascript" src="{% static "js/arg.js.v1.1.min.js" %}"></script>
  <script type="text/javascript" src="//openstreetmap.org/openlayers/OpenStreetMap.js"></script>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/js/bootstrap-datepicker.min.js" charset="UTF-8"></script>
  <script type="text/javascript">
    var enhydris = {};

    // Translation strings for enhydris.coordinatesUI module
    enhydris.transCoordinatesUI = {
      btnSimpleView: '{% trans "Simple view" %}',
      btnAdvanceView: '{% trans "Advanced view" %}',
      formSridLabel:'{% trans "SRID" %}',
      formASridLabel: '{% trans "Altitude SRID" %}',
      formLongtitudeLabel:'{% trans "Longitude" %}',
      formLatitudeLabel:'{% trans "Latitude" %}',
      formOrdinateLabel:'{% trans "Ordinate" %}',
      formAbscissaLabel:'{% trans "Abscissa" %}',
    }
    // String Variables for enhydris.mapModule module
    enhydris.staticUrl = '{% static "" %}';
    enhydris.rootUrl = '{% url "station_list" %}';
    enhydris.boundingBoxUrl = '{% url "bounding_box" %}';
    enhydris.mapMode = 1;
    {{ map_js | safe }}
  </script>
  <script type="text/javascript" src="{% static "js/hcore.js" %}"></script>
{% endblock %}
{% block extrajs %}{% endblock %}
</body>
</html>
