{% extends "layout.html" %}
{% set active_page = "map" -%}

{% import "utils.html" as util %}

{% block container %}
<div id="mapid" class="large-map"></div>
{% endblock %}

{% block styles %}
{{ super() }}

<link rel="stylesheet" href="{{ url_for('static', filename='css/leaflet.css') }}">
<link rel="stylesheet" href="{{url_for('static', filename='css/map.css')}}">

{% endblock %}

{% block scripts %}
{{super()}}
<script src="{{ url_for('static', filename='js/leaflet.js')}}"></script>
<script src="{{ url_for('static', filename='js/map.js' ) }}"></script>
<script>
	let locations = [];

	{% for loc in locations -%}
		{% if loc.address %}
			locations.push({
				"address": "{{loc.address}}",
				"name": "{{loc.name}}",
				"url": "{{ url_for('general_bp.location', location_id=loc.id) }}"
			});
		{% endif %}
	{%- endfor %}

	map.setView([51.0231119, 3.7102741], 14);

	loadmap(locations);
</script>
{% endblock %}