{% set idmap = id|default('mapid') %}
{% set prestataires = getAllPrestataires() %}
<script>
	var mymap = null;
	var mapFilters = [];

	$(function () {
		$('[data-toggle="tooltip"]').tooltip();

		function drawMap() {
			if ($('#{{idmap}}').length) {
				mymap = L.map('{{idmap}}').setView({{KOH_MAP_CENTER}}, {{KOH_MAP_ZOOM}});
				L.tileLayer('https://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png', {maxZoom: 18, attribution: '&copy; Openstreetmap France | &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'}).addTo(mymap);

				{# AJOUT DES MARQUEURS SUR LA CARTE #}
				{% set count = 1 %}
				{% for presta in prestataires %}
					{% if presta.geolocs|length > 0 %}
						{% for geolocp in presta.geolocs %}
							{% if geolocp.enabled and geolocp.geoloc.lat != null and geolocp.geoloc.lon != null %}
								var prestaRubriquesCount = parseInt('{{ presta.rubriques|length }}');
								var prestaRubriqueSlug = prestaRubriquesCount > 0 ? '{{ presta.rubriques.first.slug  }}' : '';

								if (
									mapFilters.length === 0
									|| mapFilters.length > 0
									&& mapFilters.includes(prestaRubriqueSlug)
								) {									
									{% if presta.rubriques|length > 0 and presta.rubriques.first.media is not null %}
										var iconClassName = 'kohinos-map-icon';
										{% if date(presta.getCreatedAt()) > date('-2months') %}
											iconClassName = 'kohinos-map-icon new-presta-icon';
										{% endif %}
										var icon = L.icon({ 
												iconSize: [50, 50],
												iconAnchor: [25,50],
												className: iconClassName,
												iconUrl : '{% path presta.rubriques.first.media, "preview" %}'
											});
										var marker_{{count}} = L.marker([{{geolocp.geoloc.lat}}, {{geolocp.geoloc.lon}}], {icon: icon}).addTo(mymap);
									{% else %}
										var marker_{{count}} = L.marker([{{geolocp.geoloc.lat}}, {{geolocp.geoloc.lon}}]).addTo(mymap);
									{% endif %}
									marker_{{count}}.bindPopup("{% spaceless %}{% if presta.media != null %}{% set media %}{% thumbnail presta.media, 'small' %}{% endset %} {{ media|raw|replace({'"' : "'"})|raw }}<br/><br/>{% endif %}
										{% if date(presta.getCreatedAt()) > date('-2months') %}
											<strong style='font-size:16px;'>[Nouveau] </strong>
										{% endif %}
										<a href='{{ path('show_prestataire', {'slug': presta.slug}) }}'>
											<strong style='font-size:16px;'>{{presta.__toString()}}</strong>
										</a>
										<br/>
										{% if presta.horaires is not null %}
											<p>{{presta.horaires}}</p>
										{% endif %}
										{% for rubrique in presta.rubriques %}
											<a class='maprubrique' href='{{ path('show_rubrique', {'slug': rubrique.slug}) }}'>{{rubrique.name|replace({"\n": '<br/>'})}}</a>{% if not loop.last %} - {% endif %}
										{% endfor %}
										{% endspaceless %}");
									{% set count = count+1 %}
								}
							{% endif %}
						{% endfor %}
					{% endif %}
				{% endfor %}
			}
		}

		drawMap();

		if ($('#map-filter-food-shops').length) {
			$('#map-filter-food-shops').click(() => {
				let index = mapFilters.indexOf('commerce-alimentaire');
				if (index === -1) {
					mapFilters.push('commerce-alimentaire');
					$('#map-filter-food-shops').removeClass('btn-primary').addClass('btn-success');
				} else {
					mapFilters.splice(index, 1); 
					$('#map-filter-food-shops').addClass('btn-primary').removeClass('btn-success');
				}

				// Redraw map
				mymap.remove();
				drawMap();
			});
		}

		if ($('#map-filter-markets').length) {
			$('#map-filter-markets').click(() => {
				let index = mapFilters.indexOf('marches-amap');
				if (index === -1) {
					mapFilters.push('marches-amap');
					$('#map-filter-markets').removeClass('btn-primary').addClass('btn-success');
				} else {
					mapFilters.splice(index, 1); 
					$('#map-filter-markets').addClass('btn-primary').removeClass('btn-success');
				}

				// Redraw map
				mymap.remove();
				drawMap();
			});
		}
	})
</script>
