fixing the leaflet map render issue regarding the container that is toggled.

globally scoped leafletmap var. updated function arguments.

diff --git a/glm-member-db/views/front/members/detail.html b/glm-member-db/views/front/members/detail.html
index e4b1997..6723905 100755 (executable)
--- a/glm-member-db/views/front/members/detail.html
+++ b/glm-member-db/views/front/members/detail.html
@@ -513,6 +513,7 @@
 
             // Open or close the appropriate section if a toggle is clicked
             $(".glm-member-detail-content-toggle").on("click", function() {
+                console.log("toggled")
                 if($(this).parents('.glm-member-detail-sub-data-links').length) {
                     var target = $(this).parent().parent().attr("id").slice(0, -10);
                 } else {
@@ -527,13 +528,22 @@
                 }
                 $("#"+target+"-container").toggleClass("selected");
                 $("#"+target+"-toggle").toggleClass("selected");
+
+                    
             });
 
             $("#glm-member-detail-locationMap-toggle").on("click", function() {
-                var container = L.DomUtil.get('map');
-                if(container != null){
-                    L.map.invalidateResize();
-                } 
+                // var container = L.DomUtil.get(leafletMap);
+                // // console.log(container)
+
+                // if(typeof container !== 'undefined'){
+                //     console.log(container)
+                //     // L.map.invalidateResize();
+                //     setTimeout(() => {
+                //         // container.invalidateResize();
+                //     }, 500)
+                //     // setTimeout(function(){ map.invalidateSize()}, 400);
+                //} 
             });
 
     {if $settings.detail_show_map}
@@ -557,6 +567,14 @@
 
                 });
                 $(this).html(mapBtnTxt);
+
+                var container = L.DomUtil.get(leafletMap);
+
+                if(typeof container !== 'undefined'){
+                    setTimeout(() => {
+                       container.invalidateSize()
+                    }, 500)
+                }
             });
 
       {if $settings.selected_map_interface == 1}
@@ -575,10 +593,10 @@
             var memberLat = {$settings.maps_default_lat}};
             var memberLon = {$settings.maps_default_lon}};
         {/if}
-
+            var leafletMap;
             function initMap() {
 
-                var leafletMap = L.map('LeafletMapContainer').setView([memberLat, memberLon], {$settings.maps_default_zoom});
+                leafletMap = L.map('LeafletMapContainer').setView([memberLat, memberLon], {$settings.maps_default_zoom});
                 var leafletTileServer = '{$settings.leaflet_tile_server}/{$settings.leaflet_tile_server_key}/' + {literal}'{z}/{x}/{y}.png'{/literal};
                 var leafletMinZoom = 5;
                 var leafletMaxZoom = 18;