https://schifflange.lu/wp-content/themes/schifflange/js/maps.js?ver=2

1jQuery(document).ready(function ($) {
2
3    var $body = $('body');
4    var $html = $('html');
5    var responsive_viewport = window.innerWidth;
6    var zoom = responsive_viewport < 768 ? 14 : 15;
7    var zoom_report_it = 15;
8
9
10    /**
11     * Report it map start
12     */
13    var $reportItMapContainer = $('#report-it-map');
14
15    if ($reportItMapContainer.length) {
16        reportItMap();
17    }
18
19    function reportItMap() {
20        var ReportItMap = new Geoportail('report-it-map', [49.50287330442398, 6.010696962475778], zoom_report_it);
21
22        ReportItMap.addLayer('basemap_2015_global');
23        var popup = L.popup();
24
25        //initialize marker to use for both reported and new picked live location marker
26        var customMarker = L.icon({
27            iconUrl: $reportItMapContainer.data('icon-url'),
28            iconSize: [30, 40],
29            iconAnchor: [15, 40],
30        });
31
32        //initialize marker to use for accepted reports
33        var acceptedMarker = L.icon({
34            iconUrl: $reportItMapContainer.data('icon-red'),
35            iconSize: [30, 40],
36            iconAnchor: [15, 40],
37        });
38
39        //initialize marker to use for resolved reports
40        var resolvedMarker = L.icon({
41            iconUrl: $reportItMapContainer.data('icon-green'),
42            iconSize: [30, 40],
43            iconAnchor: [15, 40],
44        });
45
46        //This marker is to be added on click associated with function do add it to map on click
47        var marker = L.marker(null, {icon: customMarker});
48
49        function onMapClick(e) {
50            var latlongString = e.latlng.lat.toString() + ', ' + e.latlng.lng.toString();
51            $('.add-report-it-lat-lng input').val(latlongString);
52            /* popup.setLatLng(e.latlng).setContent('Report this location?' + e.latlng.toString()).openOn(ReportItMap.map);*/
53            marker.setLatLng(e.latlng).addTo(ReportItMap.map);
54        }
55
56        ReportItMap.map.on('click', onMapClick);
57
58        //Get reported cases and spot them on the map
59        var reported_cases = $reportItMapContainer.data('reported');
60        if (reported_cases) {
61            for (let i = 0; i < reported_cases.length; i++) {
62
63                reported_cases[i] = new L.marker(reported_cases[i], {
64                    icon: customMarker,
65                }).addTo(ReportItMap.map);
66            }
67        }
68
69        //Get accepted cases and spot them on the map
70        var accepted_cases = $reportItMapContainer.data('accepted');
71        if (accepted_cases) {
72            for (let i = 0; i < accepted_cases.length; i++) {
73
74                accepted_cases[i] = new L.marker(accepted_cases[i], {
75                    icon: acceptedMarker,
76                }).addTo(ReportItMap.map);
77
78            }
79        }
80        //Get resolved cases and spot them on the map
81        var resolved_cases = $reportItMapContainer.data('resolved');
82        if (resolved_cases) {
83            for (let i = 0; i < resolved_cases.length; i++) {
84
85                resolved_cases[i] = new L.marker(resolved_cases[i], {
86                    icon: resolvedMarker,
87                }).addTo(ReportItMap.map);
88
89            }
90        }
91
92        /**
93         * Since hidden inputs cant be required with gravity forms, the input to be populated with the lat long is hidden
94         * with css, and if the input empty and hidden and required at the same time, the error message will not be displayed
95         * for this input, we append the error message related to this css hidden input manually on submit
96         */
97
98        $('#gform_3').on('submit', function (e) {
99
100            if ($('.add-report-it-lat-lng input').val() === '') {
101                e.preventDefault();
102                $('.gform_footer').append('<div>select a location on the map</div>');
103            }
104
105        });
106
107        /**
108         * Report it map end
109         */
110
111    }
112
113    /**
114     * Maps for all projects and associations
115     */
116
117    $('.project-map').each(function () {
118        var $this = $(this);
119        var lat_lng = $this.data('latlng');
120        lat_lng = lat_lng.split(',');
121        var id = $this.attr('id');
122
123        if (typeof lat_lng != 'undefined') {
124            var icon = $this.parents('.multi-maps-container').data('icon');
125
126            var acceptedMarker = L.icon({
127                iconUrl: icon,
128                iconSize: [30, 40],
129                iconAnchor: [15, 40],
130            });
131
132            var map = new Geoportail(id, [lat_lng[0], lat_lng[1]], 16);
133            map.addLayer('basemap_2015_global');
134            map.addMarker(lat_lng, acceptedMarker);
135        }
136    });
137
138    /**
139     * Hide hidden content if there is a map in the content, css is not  helping to give the map a size
140     * should be initialized after the map loaded
141     */
142    $('.has-map').css('display', 'none');
143
144
145    /**
146     * Contact map & parking map
147     */
148        //start contact map and parking map
149    var $contactAndParkingMap = $('#contact-map');
150    console.log($contactAndParkingMap.data('icon-url'));
151    if ($contactAndParkingMap.length) {
152        var contactAndParkingMap = new Geoportail('contact-map', [49.50287330442398, 6.010696962475778], zoom);
153        contactAndParkingMap.addLayer('basemap_2015_global');
154        var popup = L.popup();
155    }
156
157    var $keys = $('.map-key');
158    if ($keys.length) {
159        var acceptedMarker = L.icon({
160            iconUrl: $contactAndParkingMap.data('icon-url'),
161            iconSize: [30, 40],
162            iconAnchor: [15, 40],
163        });
164
165        var markerGroup = L.layerGroup();
166        var markers = [];
167
168        $keys.each(function () {
169            var $key = $(this);
170            var lat_long = $key.data('lat-long');
171            var address = $key.data('address');
172            var extra_fields = $key.find('.hidden-content');
173            var timing = $key.data('timing');
174            var id = $key.attr('id');
175            var content = '';
176
177            if ($key.parent('ul').hasClass('parking-filter')) {
178                content += '<div class="infos-on-map"><span class="span-wrapper">' + $key.find('a').text() + '</span>';
179                if (address && address !== '') {
180                    content += '<span class="span-wrapper" ><span class="icon-location"></span> ' + address + ' </span>';
181                }
182                content += extra_fields.html() + ' </div>';
183            } else {
184                content += '<div class="infos-on-map"><span class="span-wrapper">' + $key.find('a').text() + '</span>';
185                if (address && address !== '') {
186                    content += '<span class="span-wrapper" ><span class="icon-location"></span> ' + address + ' </span>';
187                }
188                if (timing && timing !== '') {
189                    content += '<span class="span-wrapper" ><span class="icon-clock"></span>  ' + timing + ' </span> ';
190                }
191
192                if (extra_fields.html()) {
193                    content += extra_fields.html();
194                }
195
196                content += ' </div>';
197            }
198
199
200            if (lat_long) {
201                var marker = L.marker(lat_long, {
202                    icon: acceptedMarker,
203                    id: 'marker-' + id,
204
205                }).addTo(markerGroup)
206                    .bindPopup(content);
207
208                marker.on('click', function () {
209                    marker.openPopup();
210                });
211
212                markers.push(marker);
213            }
214
215            markerGroup.addTo(contactAndParkingMap.map);
216        });
217
218
219        function toggleKeys() {
220            $keys.each(function () {
221
222                var $this = $(this);
223                if ($this.hasClass('selected')) {
224                    $('.map-key-all').removeClass('selected');
225                    contactAndParkingMap.map.panTo($(this).data('lat-long'));
226                    $.each(markers, function (i, marker) {
227                        if (marker.options.id == 'marker-' + $this.attr('id')) {
228                            $(marker._icon).fadeIn();
229                        }
230                    });
231                } else {
232                    $.each(markers, function (i, marker) {
233                        if (marker.options.id == 'marker-' + $this.attr('id')) {
234                            $(marker._icon).fadeOut();
235                        }
236                    });
237                }
238            });
239        }
240
241
242        $keys.on('click', function (e) {
243            e.preventDefault();
244            var $key = $(this);
245            $key.toggleClass('selected');
246
247            toggleKeys();
248
249        });
250
251        /**
252         * Select all filters
253         */
254
255        $('.map-key-all').on('click', function (e) {
256            e.preventDefault();
257
258            if (!$(this).hasClass('selected')) {
259                $(this).addClass('selected');
260
261                $.each(markers, function (i, marker) {
262                    $(marker._icon).fadeIn();
263                });
264            } else {
265                $(this).removeClass('selected');
266                toggleKeys();
267
268            }
269        });
270    }
271
272});