{% load i18n avatar_tags announcements_tags %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>{% block title %}{{ SITE_NAME }}{% endblock %}</title>
    {% block head %}
      <link href="{{ STATIC_URL }}geonode/css/base.css" rel="stylesheet" />
      <link href='{{ STATIC_URL }}geonode/font/lato_font.css' rel='stylesheet' type='text/css' />
      <link href="{{ STATIC_URL }}geonode/css/ext-compatibility.css" rel="stylesheet" />
      {% if DEBUG_STATIC %}
      <link href="{{ STATIC_URL }}lib/css/jquery.dataTables.css" rel="stylesheet" />
      <link href="{{ STATIC_URL }}lib/css/select2.css" rel="stylesheet"/>
      {% else %}
      <link href="{{ STATIC_URL }}lib/css/assets.min.css" rel="stylesheet"/>
      {% endif %}
      {% block extra_head %}
      {% endblock %}
    {% endblock %}
    <!--[if lt IE 9]>
      <script src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  
  <body class="{% block body_class %}{% endblock %}">

    {% block header %}
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a href="{% url "home" %}"><span class="nav-logo"></span></a>
          <div class="nav-collapse">
            <ul class="nav">
              <!-- <li id="nav_home">
                <a href="{% url "home" %}">{% trans "Home" %}</a>
              </li> -->
              <li id="nav_data">
                <a href="{% url "layer_browse" %}">{% trans "Layers" %}</a>
              </li>
              <li id="nav_maps">
                <a href="{% url "maps_browse" %}">{% trans "Maps" %}</a>
              </li>
              {% if USE_DOCUMENTS %}
              <li id="nav_documents">
                <a href="{% url "documents_browse" %}">{% trans "Documents" %}</a>
              </li>
              {% endif %}
              <li id="nav_people">
                <a href="{% url "profile_browse" %}">{% trans "People" %}</a>
              </li>
              {% if GROUPS_APP %}
              <li id="nav_groups">
                <a href="{% url "group_list" %}">{% trans "Groups" %}</a>
              </li>
              {% endif %}
            </ul>
            <form class="input-append pull-left" action="{% url "search" %}" method="GET">
              {# csrf_token #}
              <input id="search" type="text" name="q"/>
            </form>
            <ul class="nav pull-right">
              {% if user.is_authenticated %}
              <li class="user-avatar">
                {% avatar user 30 %}
              </li>
              <li class="dropdown user">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                  {{ user.username }}
                  <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                  <li><a href="{{ user.get_profile.get_absolute_url }}"><i class="icon-user"></i> {% trans "Profile" %}</a></li>
                  <li><a href="{% url "messages_inbox" %}"><i class="icon-inbox"></i> {% trans "Inbox" %}</a></li>
                  {% if user.is_staff %}
                  <li><a href="{% url "admin:index" %}"><i class="icon-cog"></i> {% trans "Admin" %}</a></li>
                  {% endif %}
                  {% if perms.announcements.can_manage %}
                  <li><a href="{% url "announcements_list" %}"><i class="icon-bullhorn"></i> {% trans "Announcements" %}</a></li>
                  {% endif %}
                  {% if user.is_superuser %}
                  <li><a href="{{ GEOSERVER_BASE_URL }}"><i class="icon-globe"></i> {% trans "GeoServer" %}</a></li>
                  {% endif %}
                  <li><a href="{% url "recent-activity" %}"><i class="icon-fire"></i> {% trans "Recent Activity" %}</a></li>
                  <li class="divider"></li>
                  <li>
                    <form action="{% url "account_logout" %}" id="logout_form" method="post">
                      {% csrf_token %}
                      <a class="navbar-logout" href="javascript:{}" onclick="document.getElementById('logout_form').submit();"><i class="icon-off"></i> {% trans "Log out" %}</a>
                    </form>
                  </li>
                </ul>
              </li>
              {% else %}
              <li class="dropdown">
                <a href="#" class="dropdown-toggle login" data-toggle="dropdown">Sign in <b class="caret"></b></a>
                <ul class="dropdown-menu">
                  <li>
                    <form action="{% url "account_login" %}?next={{ request.path }}" method="post" class="sign-in">
                    {% csrf_token %}
                      <label for="id_username">{% trans "Username" %}:</label>
                      <input id="id_username" name="username" type="text" />
                      <label for="id_password">{% trans "Password" %}:</label>
                      <input id="id_password" name="password" type="password" />
                      <label class="checkbox">
                        <input type="checkbox" />
                        {% trans "Remember Me" %}
                      </label>
                      <button type="submit" class="btn pull-right">{% trans "Sign in" %}</button>
                    </form>
                  </li>
                </ul>
              </li>
              {% if REGISTRATION_OPEN %}
              <!-- <li class="navbar-text">{% trans "or" %}</li> -->
              <li><a href="{% url "account_signup" %}">{% trans "Register" %}</a></li>
              {% endif %}
              {% endif %}
            </ul>
            
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>
    {% endblock header %}

    {% block middle %}
    {% announcements as site_wide_announcements %}
    <div class="content-wrap">
      {% if site_wide_announcements %}
      <div id="site_wide_announcements">
        {% for announcement in site_wide_announcements %}
        <div class="alert alert-block announcement">
          <a type="button" class="close" data-dismiss="alert" data-dismiss-url="{% url "announcements_dismiss" announcement.pk %}" href="#">×</a>
          <h4><a href="{{ announcement.get_absolute_url }}">{{ announcement }}</a></h4>
          <p><small><em>{{ announcement.creation_date }}</em></small></p>
          <div>{{ announcement.content }}</div>
        </div>
        {% endfor %}
      </div>
      {% endif %}
      <div class="container">
        <div class="row">
        {% block body_outer %}
          <div class="span8">
          {% block body %}{% endblock %}
          </div>
          <div class="span4">
          {% block sidebar %}{% endblock %}
          </div>
        {% endblock %}
        </div>
      </div> <!-- /.container -->
    </div>
    {% endblock middle %}
    
    {% block footer %}
    <footer class="footer">
      <div class="container">
        <div class="pull-left">
          {% trans "Powered by" %} <a href="http://geonode.org">{% trans "GeoNode" %}</a> <em>{% trans "version" %} {{ VERSION }}</em> |
          <a href="{% url "developer" %}">{% trans "Developers" %}</a> |
          <a href="{% url "about" %}">{% trans "About" %}</a>
        </div>
        <div class="pull-right">
        {% if csrf_token != "NOTPROVIDED" %}
          {% get_current_language as LANGUAGE %}
          <form class="form-inline" action="/i18n/setlang/" method="post">
          {% csrf_token %}
            <label>{% trans "Language" %}</label>
            <select class="input span2" name="language" onchange="javascript:form.submit()">
              {% for lang in LANGUAGES %}
              <option value="{{ lang.0 }}" {% ifequal LANGUAGE_CODE lang.0 %} selected="selected"{% endifequal %}>
                {{ lang.1 }}
              </option>
              {% endfor %}
            </select>
          </form>
        {% endif %}
        </div> <!-- /.pull-right -->
      </div> <!-- /.container -->
    </footer>
    {% endblock footer %}
    
    {% if DEBUG_STATIC %}
    <script src="{{ STATIC_URL }}lib/js/jquery.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery.dataTables.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery.timeago.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery.ajaxprogress.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery.ajaxQueue.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery-ui.custom.js"></script>
    <script src="{{ STATIC_URL }}lib/js/jquery.raty.js"></script>
    <script src="{{ STATIC_URL }}lib/js/bootstrap.js"></script>
    <script src="{{ STATIC_URL }}lib/js/json2.js"></script>
    <script src="{{ STATIC_URL }}lib/js/select2.js"></script>
    <script src="{{ STATIC_URL }}lib/js/waypoints.js"></script>
    {% else %}
    <script src="{{ STATIC_URL }}lib/js/assets.min.js"></script>
    {% endif %}
    <script src="{{ STATIC_URL }}geonode/js/utils/utils.js"></script>
    <script src="{{ STATIC_URL }}geonode/js/base/base.js"></script>
    <script>
      $("#search").select2({
        minimumInputLength: 1,
        placeholder: 'Search...',
        width: 'element',     
        ajax: {
          url: '{% url "search_api" %}',
          data: function(term,page){
            page = (page - 1) * 10;
            return {
              type: 'all',
              limit: 10,
              sort: 'none',
              start: page,
              q: term.replace(/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '')
            }
          },
          results: function(data, page) {
            var more = (page * 10) < data.total;
            return {
              results: $.map(data.results,function(object){
                return {id: object.id, text: object.title, url: object.detail };
              }),
              more: more
            }
          }          
        },
        createSearchChoice:function(term, data) { 
            term = term.replace(/[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, '');
            if ($(data).filter(function() { 
                return this.text.localeCompare(term)===0; }).length===0) {
                    return {id:term, text:term};
                    } 
        },
        formatSelection: function(item){
          if(item.url != undefined) {
            window.location.href = item.url;
          } else {
            $('#search').val(item.text);
            $('#search').parent().submit();
          };
        }
      });
    </script>

    {% block extra_script %}{% endblock extra_script %}

    <script type="text/javascript" src="{% url "django.views.i18n.javascript_catalog" %}"></script>
    <script type="text/javascript" src="{% url "lang" %}"></script>
    <style type="text/css">
      .select2-drop{
        color: black;
      }
    </style>
  </body>
</html>
