Front member list map gesture handling added based on Lakesideclub

diff --git a/css/front.css b/css/front.css
index d9e2b49..163cde5 100644 (file)
--- a/css/front.css
+++ b/css/front.css
@@ -496,6 +496,16 @@ glm-member-db-list.glm-member-db-grid-view .glm-member-list-image {
  * Grid-view styles end
  */
 
+/*
+ * Map view styles start
+ */
+ .glm-member-db-list.glm-member-db-map-view.filters-opened #glm-locationMap-container {
+    width: 100%;
+ }
+ /*
+ * Map view styles end
+ */
+
 /*
  * Member Detail Start
  */

diff --git a/views/front/members/list.html b/views/front/members/list.html
index 7589ba0..4aa884f 100755 (executable)
--- a/views/front/members/list.html
+++ b/views/front/members/list.html
@@ -14,6 +14,8 @@
         <script src="{$jsUrl}/LeafletMarkerCluster/dist/leaflet.markercluster-src.js"></script>
         <link rel="stylesheet" href="{$jsUrl}/Leaflet.loading/src/Control.Loading.css" />
         <script src="{$jsUrl}/Leaflet.loading/src/Control.Loading.js"></script>
+        <link rel="stylesheet" href="//unpkg.com/leaflet-gesture-handling/dist/leaflet-gesture-handling.min.css" type="text/css">
+        <script src="//unpkg.com/leaflet-gesture-handling"></script>
     {/if}
 
     {if $settings.selected_map_interface == 2}
@@ -107,7 +109,7 @@
 
                 {if $settings.selected_map_interface == 1}
                     <!--  Leaflet Map -->
-                    <div id="LeafletMapContainer" style="height: 400px; width: 90%; border: 1px black solid; z-index: +0; margin: 0 auto;"></div>
+                    <div id="LeafletMapContainer" style="height: 400px; width: 100%; border: 1px black solid; z-index: +0; margin: 0 auto;"></div>
                 {/if}
 
                 {if $settings.selected_map_interface == 2}
@@ -568,7 +570,7 @@
 
             function initMap() {
 
-                var leafletMap = L.map('LeafletMapContainer').setView([{$settings.maps_default_lat}, {$settings.maps_default_lon}], defZoom);
+                var leafletMap = L.map('LeafletMapContainer', {gestureHandling: true}).setView([{$settings.maps_default_lat}, {$settings.maps_default_lon}], defZoom);
                 var leafletTileServer = '{$settings.leaflet_tile_server}/{$settings.leaflet_tile_server_key}/' + {literal}'{z}/{x}/{y}.png'{/literal};
                 var leafletMinZoom = 3;
                 var leafletMaxZoom = 19;