{% extends "base.html" %}
{% load i18n %}

{% block head_title%}{{pagetitle}} - {% trans "Ararteko maps" %}{% endblock %}

{% block searchbox%}{% endblock %}

{% block extraheader %}

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    function initialize() {
    var center = new google.maps.LatLng(43.0, -1.0);
    var myOptions = {
      zoom: 17,
      center: center,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var bounds = new google.maps.LatLngBounds();
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var infowindow = new google.maps.InfoWindow();

    {% for place in p_places %}{% if place.lat %}    
        var center = new google.maps.LatLng({{place.lat}}, {{place.lon}});
        bounds.extend(center);
        var image = '{{STATIC_URL}}icn/{{place.icon}}.png';        
        var contentString_{{forloop.counter}} = '<p><a href="{{ place.get_absolute_url }}">{{place.name}}</a><br />{{place.category}} -  {{ place.city }}</p><br /><div class="accessibility">';
        {% for key,value,vkey,vvalue in place.access_list %}
        contentString_{{forloop.parentloop.counter}} += '<div class="access_term">{{key}}</div><div class="access_definition {{key}}_{{value}}" title="{{vkey}} {{vvalue}}"><span>{{vvalue}}</span></div>'; 
        {% endfor %}
        contentString_{{forloop.counter}} += '</div>';
        var marker_{{forloop.counter}} = new google.maps.Marker({
            position: center,
            map: map,
            icon: image,
            title: "{{place.name}}"
        });
        google.maps.event.addListener(marker_{{forloop.counter}}, 'click',
            function(){
                infowindow.close();//hide the infowindow
                infowindow.setContent(contentString_{{forloop.counter}});//update the content for this marker
                infowindow.open(map, marker_{{forloop.counter}});//"move" the info window to the clicked marker and open it
                }
        );
        {% endif %}{% endfor %}
    map.fitBounds(bounds) 
    if(infowindow) {
      infowindow.close();
    }    

  }
</script>

<link rel="canonical" href="{{request.path}}"/>
{% endblock %}


{% block breadcrumb %}
<p id="breadcrumb">
   <a href="/">{% trans "Home" %}</a>
   &gt;
   <a href="{{city.parent.get_absolute_url}}">{{city.parent.name}}</a>
   &gt;
   {% if maincat %}
   <a href="{{city.get_absolute_url}}">{{city.name}}</a>
   {% else %}
   {{city.name}}
   {% endif %}
</p>
{% endblock %}

{% block mainmenu %}
<ul id="menu1">
{% for cat in rootcats %}
    {% ifequal cat.slug maincat %}<li class="selected">{% else %}<li>{% endifequal %}
    <a href="{{city.get_absolute_url}}{{ cat.slug }}/">{{cat}}</a></li>
{% endfor %}
</ul>

{% if maincat %}
<ul id="menu2">
{% for cat in subcats %}
    {% ifequal cat.slug subcat %}<li class="selected">{% else %}<li>{% endifequal %}
    <a href="{{city.get_absolute_url}}{{maincat}}/{{ cat.slug }}/">{{cat}}</a></li>
{% endfor %}
</ul>
{% endif %}
{% endblock %}


{% block main_content %}

{{all_cats}}

<div id="locacol1">

<h1>{{pagetitle}}</h1>

{% if request.user.is_staff %}
<a href="{% url 'admin:locations_location_change' city.id %}">Modificar este lugar</a>
{% endif %}

{% if maincat %}
<p class="returnlink"><a href="{{city.get_absolute_url}}">{% blocktrans with cityname=city.name %}Visit full {{ cityname }}{% endblocktrans %}</a></p>
{% endif %}

  <ul class="itemlist">
  {% for place in p_places %}
    <li>
    <img src="{{STATIC_URL}}icn/{{place.icon}}.png" alt="{% trans place.category.str2trans %}" class="mainicon" />
    <h4><a href="{{ place.get_absolute_url }}">{{ place.name }}</a></h4>
    <p>{{place.category}}</p>
    <dl class="accessibility">
        {% for key,value,vkey,vvalue in place.access_list %}
        <dt class="access_term">{{vkey}}</dt>
        <dd class="access_definition {{key}}_{{value}}" title="{{vkey}} {{vvalue}}"><span>{{vvalue}}</span></dd>
        {% endfor %}
    </dl>
    </li>
   {% endfor %}    
  </ul>

  {% if thispage.has_previous %}
 <a href="{{prev_url}}">{% trans "Previous" %}</a>
  {% endif %}
  
  {% if thispage.has_next %}
 <a href="{{next_url}}">{% trans "Next" %}</a>
  {% endif %}
</div>
<!-- locacol1 end -->

<div id="locacol2">
    <div id="map_container">
        <div id="map_canvas" style="width: 445px; height: 400px">MAPA</div>
    </div>
</div>
<!-- locacol2 end -->

{% endblock main_content %}
