{% comment %}
 coding: utf-8

 maposmatic, the web front-end of the MapOSMatic city map generation system
 Copyright (C) 2009  David Decotigny
 Copyright (C) 2009  Frédéric Lehobey
 Copyright (C) 2009  David Mentré
 Copyright (C) 2009  Maxime Petazzoni
 Copyright (C) 2009  Thomas Petazzoni
 Copyright (C) 2009  Gaël Utard

 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU Affero General Public License as
 published by the Free Software Foundation, either version 3 of the
 License, or any later version.

 This program is distributed in the hope that it will be useful,
 but WITHOUT ANY WARRANTY; without even the implied warranty of
 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 GNU Affero General Public License for more details.

 You should have received a copy of the GNU Affero General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
{% endcomment %}

{% load i18n %}
{% load extratags %}

<!DOCTYPE html>
<html lang="{{ LANGUAGE_CODE }}"{% if LANGUAGE_BIDI %} dir="rtl"{% endif %}>
  <head>
    <title>MapOSMatic{% if DEBUG %} [DEV]{% endif %}: {% block title %}Welcome!{% endblock %}</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <link rel="shortcut icon" href="/media/img/favicon.png" />
    <link rel="stylesheet" href="/media/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/media/css/bootstrap-responsive.min.css" />
    <link rel="stylesheet" href="/media/css/maposmatic.css" />
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css" />
    <link rel="feed" title="{% trans "Maps feed" %}" href="/feed/maps/" />
  </head>

  <body class="{% block body-class %}{% endblock %}">
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>

          <div class="menu-status menu-status-{{ platform_status }} dropdown">
          <a rel="popover" class="brand popovered"
            data-animation="false"
            data-html="true"
            data-original-title="{% trans "Platform status" %}"
            data-placement="bottom"
            data-content='<p>{% trans "Rendering daemon: " %}<i class="pull-right icon-{% if daemon_running %}ok{% else %}off{% endif %}"></i></p>
            <p>{% trans "GIS database: " %}<i class="pull-right icon-{% if gis_lag_ok %}ok{% else %}{% if gis_lastupdate %}warning-sign{% else %}off{% endif %}{% endif %}"></i></p>'>
            <i class="icon-white icon-{{ platform_status }}"></i>
            MapOSMatic
          </a>
          </div>

          <div class="nav-collapse collapse">
            <ul class="nav">
              <li class="{% block menu-home   %}{% endblock %}"><a href="{% url main   %}"><i class="icon-white icon-home"></i> {% trans "Home" %}</a></li>
              <li class="{% block menu-new    %}{% endblock %}"><a href="{% url new    %}"><i class="icon-white icon-edit"></i> {% trans "Create map" %}</a></li>
              <li class="{% block menu-maps   %}{% endblock %}"><a href="{% url maps   %}"><i class="icon-white icon-list"></i> {% trans "Maps" %}</a></li>
              <li class="{% block menu-about  %}{% endblock %}"><a href="{% url about  %}"><i class="icon-white icon-comment"></i> {% trans "About" %}</a></li>
              <li class="{% block menu-donate %}{% endblock %}"><a href="{% url donate %}"><i class="icon-white icon-gift"></i> {% trans "Donate" %}</a></li>

              <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                  <i class="icon-white icon-flag"></i> {{ LANGUAGES|getitem:LANGUAGE_CODE }} <b class="caret"></b>
                </a>
                <ul class="dropdown-menu">
                  <form action="/i18n/setlang/" method="post" name="langsel" class="navbar-form form-horizontal">
                  <input name="language" type="hidden" value="{{ LANGUAGE_CODE }}" />
                  {% for code, language in LANGUAGES.items %}
                  <li class="{% ifequal code LANGUAGE_CODE %}active{% endifequal %}">
                  <a href="javascript:(function() { document.langsel.language.value = '{{ code }}'; document.langsel.submit(); })();">{{ language }}</a>
                  </li>
                  {% endfor %}
                  </form>
                </ul>
              </li>

              <form action="{% url maps %}" method="get" class="navbar-form form-horizontal pull-right">
                <div class="control-group">
                  <div class="controls">
                    <div class="input-prepend">
                      <span class="add-on"><i class="icon-search"></i></span>
                      {{ searchform.query }}
                    </div>
                  </div>
                </div>
              </form>
            </ul>
          </div>
        </div>
      </div>
    </div>

    <div class="container" style="margin-top: 5em;">
      {% block page %}{% endblock %}
    </div>

    <footer class="footer">
      <p>
      {% blocktrans %}MapOSMatic is a free software webservice to generate maps of cities using OpenStreetMap data.{% endblocktrans %}
      </p>
      <p>
        <address><a href="mailto:contact@maposmatic.org">contact@maposmatic.org</a></address>
        &mdash;
        <code>irc://irc.freenode.net/#maposmatic</code>
      </p>
      <p class="hosted-by">
      {% blocktrans %}MapOSMatic website and rendering pipeline hosted by <a href="http://www.enix.org">eNiX</a>.<br />GIS database hosted by the <a href="http://www.fsffrance.org">Free Software Foundation France</a>.{% endblocktrans %}
      </p>
    </footer>

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script type="text/javascript" src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
    <script src="/media/js/bootstrap.min.js"></script>
    <script type="text/javascript">
      // Set focus to the search field
      $('#id_query').focus();

      $('.tooltipped').tooltip();
      $('.popovered').popover();

      var epsg_display_projection = new OpenLayers.Projection('EPSG:4326');
      var epsg_projection = new OpenLayers.Projection('EPSG:900913');

      function set_map_bounds(map, array, closest) {
        var bounds = new OpenLayers.Bounds();
        bounds.extend(new OpenLayers.LonLat(array[0][1], array[0][0]));
        bounds.extend(new OpenLayers.LonLat(array[1][1], array[1][0])); 
        bounds.transform(epsg_display_projection, epsg_projection);
        map.zoomToExtent(bounds, true);
      }

      function create_map(elt) {
        var map = new OpenLayers.Map(elt.attr('id'), {
          controls: [new OpenLayers.Control.Attribution()],
          maxExtent: new OpenLayers.Bounds(-20037508.34, - 20037508.34, 20037508.34, 20037508.34),
          numZoomLevels: 18,
          maxResolution: 156543.0399,
          projection: epsg_projection,
          displayProjection: epsg_display_projection
        });
        map.addLayer(new OpenLayers.Layer.OSM.Mapnik('Mapnik'));

        if (elt.attr('data-geo-osm-id') && elt.attr('data-geo-osm-id') != 'None') {
          $.getJSON('/apis/boundingbox/' + elt.attr('data-geo-osm-id') + '/',
            function(data) {
              set_map_bounds(map, data);
            })
            .error(function() {
              map.zoomToMaxExtent();
            });
        } else {
          set_map_bounds(map, [
            [elt.attr('data-geo-from-lat'), elt.attr('data-geo-from-lon')],
            [elt.attr('data-geo-to-lat'), elt.attr('data-geo-to-lon')]
          ]);
        }

        return map;
      }

      {% if gis_lastupdate %}
      $('.mapthumbnail').each(function(i, elt) {
        elt = $(elt);
        $('p', elt).hide();
        create_map(elt);
      });
      {% endif %}

      {% block extrajs %}{% endblock %}
    </script>

    <!-- Piwik statistics -->
    <script type="text/javascript">
      var pkBaseURL = (("https:" == document.location.protocol) ? "https://stats.maposmatic.org/piwik/" : "http://stats.maposmatic.org/piwik/");
      document.write(unescape("%3Cscript src='" + pkBaseURL
            + "piwik.js' type='text/javascript'%3E%3C/script%3E"));
    </script><script type="text/javascript">
      try {
        var piwikTracker = Piwik.getTracker(pkBaseURL + "piwik.php", {% if DEBUG %}3{% else %}2{% endif %});
        piwikTracker.trackPageView();
        piwikTracker.enableLinkTracking();
      } catch (err) {}
    </script>
    <noscript>
      <img src="http://stats.maposmatic.org/piwik/piwik.php?idsite={% if DEBUG %}3{% else %}2{% endif %}" />
    </noscript>
    <!-- End Piwik Tag -->
  </body>
</html>
