From 68d0aa767fbfae940840fbbe26da3fae8806e1a6 Mon Sep 17 00:00:00 2001
From: Steve Sutton <steve@gaslightmedia.com>
Date: Wed, 22 Aug 2018 16:01:23 -0400
Subject: [PATCH] Update member detail view file.

Update for new member maps.
---
 glm-member-db/views/front/members/detail.html | 64 ++++++++++++++++++-
 1 file changed, 62 insertions(+), 2 deletions(-)

diff --git a/glm-member-db/views/front/members/detail.html b/glm-member-db/views/front/members/detail.html
index 8684e88..db11fb1 100644
--- a/glm-member-db/views/front/members/detail.html
+++ b/glm-member-db/views/front/members/detail.html
@@ -136,9 +136,20 @@
                 </div>
 
                 {if $settings.detail_show_map}
-                <script src="//maps.googleapis.com/maps/api/js?sensor=true&key={$settings.google_maps_api_key}"></script>
+                
                 <div id="glm-locationMap-container">
-                    <div id="glm-locationMap" class="glm-map small-12 columns">(map loads here)</div>
+      {if $settings.selected_map_interface == 1}
+                    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
+                    <script src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js" integrity="sha512-tAGcCfR4Sc5ZP5ZoVz0quoZDYX5aCtEm/eu1KhSLj2c9eFrylXZknQYmxUssFaVJKvvc0dJQixhGjG2yXWiV9Q==" crossorigin=""></script>
+                    <link rel="stylesheet" href="{$jsUrl}/Leaflet.loading/src/Control.Loading.css" />
+                    <script src="{$jsUrl}/Leaflet.loading/src/Control.Loading.js"></script>
+                    <div id="LeafletMapContainer" style="height: 250px; width: 100%;">(map loads here)</div>
+      {/if}
+      {if $settings.selected_map_interface == 2}
+                    <script src="//maps.googleapis.com/maps/api/js?sensor=true&key={$settings.google_maps_api_key}"></script>
+                    <script type="text/javascript">var enableDraggable = true;</script>
+                    <div id="glm-locationMap" class="glm-map glmgrid-small-12 glmgrid-columns">(map loads here)</div>
+      {/if}   
                 </div>
                 <div id="glm-member-detail-map-button" class="button map-button">view map</div>
 
@@ -524,6 +535,55 @@
                 $(this).html(mapBtnTxt);
             });
 
+      {if $settings.selected_map_interface == 1}    
+            
+            /*
+             *  Leaflet Map
+             *  API reference: https://leafletjs.com/reference-1.3.2.html
+             */
+
+            // Get member location if available, otherwise use this site's default locatgion
+            var myLocation = false;
+        {if $member.lat != 0 && $member.lon != 0}
+            var memberLat = {$member.lat};
+            var memberLon = {$member.lon};
+        {else}
+            var memberLat = {$settings.maps_default_lat}};
+            var memberLon = {$settings.maps_default_lon}};
+        {/if}
+
+            function initMap() {
+            
+                var 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;
+                var geocoder;
+
+
+                // Tile server
+                L.tileLayer(leafletTileServer, {
+                    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.gaslightmedia.com/">Gaslight Media</a>',
+                    minZoom: leafletMinZoom,
+                    maxZoom: leafletMaxZoom,
+                    id: 'nothot'
+                }).addTo(leafletMap);
+
+                var loadingControl = L.Control.loading({
+                    separate: true,
+                    delayIndicator: 500
+                });
+                leafletMap.addControl(loadingControl);
+                
+                // Marker
+                var leafletMarker = L.marker([memberLat, memberLon]).addTo(leafletMap);
+            
+            }
+        
+      {/if}
+
+      {if $settings.selected_map_interface == 2}    
+      
             /*
              * Google Maps
              *  API reference: https://developers.google.com/maps/documentation/javascript/reference
-- 
2.17.1