refactor: prep for fallback to organisation latlng

people/static/js/map.js

@@ -10,28 +10,13 @@ const marker_label_offset = 0.27 * marker_scale;
 const marker_edge_alpha = 1.0;
 const marker_edge_width = 1.0;
 
-let map = null
+let map = null;
+let selected_marker_info = null;
 
-// The function called when Google Maps starts up
-function initMap() {
-    // const centre_latlng = new google.maps.LatLng(settings.centre_lat, settings.centre_lng);
-    // The map, centered at Soton
-    map = new google.maps.Map(
-        // document.getElementById('map'), { zoom: settings.zoom, center: centre_latlng });
-        document.getElementById('map'));
-
-    const bounds = new google.maps.LatLngBounds()
-    const markers_data = JSON.parse(
-        document.getElementById('map-markers').textContent
-        ).filter(data => data.lat !== null && data.lng !== null);
-
-    // For each data entry in the json...
-    for (const pin_data of markers_data) {
+function createMarker(map, marker_data) {
     // Get the lat-long position from the data
-        const lat_lng = new google.maps.LatLng(pin_data.lat, pin_data.lng);
-        console.log(lat_lng)
+    const lat_lng = new google.maps.LatLng(marker_data.lat, marker_data.lng);
 
-        // Generate a new marker
     const marker = new google.maps.Marker({
         position: lat_lng,
         map: map,
@@ -47,26 +32,71 @@ function initMap() {
         },
     });
 
-        console.log(marker)
-
-        bounds.extend(marker.position)
-
-        // Build the info window content to tell the user the last time it was visited.
     marker.info = new google.maps.InfoWindow({
         content: "<div id='content'>" +
-                "<h3><a href=" + pin_data.url + ">" + pin_data.name.replace('&apos;', "'") + "</a></h3>" +
+            "<h3><a href=" + marker_data.url + ">" + marker_data.name.replace('&apos;', "'") + "</a></h3>" +
             "</div>"
     });
 
     // We bind a listener to the current marker so that if it's clicked, it checks for an open info window,
     // closes it, then opens the info window attached to it specifically. Then sets that as the last window.
     google.maps.event.addListener(marker, 'click', function () {
-            if (last_info) {
-                last_info.close();
+        if (selected_marker_info) {
+            selected_marker_info.close();
         }
-            last_info = this.info;
+
+        selected_marker_info = this.info;
         this.info.open(map, this);
     })
+
+    return marker;
+}
+
+function search_missing_locations(map, markers_data) {
+    service = new google.maps.places.PlacesService(map)
+
+    for (let data of markers_data) {
+        if (data.organisation !== null && (data.lat === null || data.lng === null)) {
+            let query = data.organisation;
+            if (data.country !== null) {
+                query += ' ' + data.country;
+            }
+
+            const request = {
+                query: query,
+                fields: ['name', 'geometry'],
+            };
+
+            service.findPlaceFromQuery(request, (results, status) => {
+                if (status === google.maps.places.PlacesServiceStatus.OK) {
+                    for (let i = 0; i < results.length; i++) {
+                        // createMarker(results[i]);
+                        console.log(results[i])
+                    }
+                    map.setCenter(results[0].geometry.location);
+                }
+            });
+
+            break;
+        }
+    }
+}
+
+// The function called when Google Maps starts up
+function initMap() {
+    map = new google.maps.Map(
+        // document.getElementById('map'), { zoom: settings.zoom, center: centre_latlng });
+        document.getElementById('map'));
+
+    const bounds = new google.maps.LatLngBounds()
+    const markers_data = JSON.parse(
+        document.getElementById('map-markers').textContent)
+    search_missing_locations(map, markers_data);
+
+    // For each data entry in the json...
+    for (const marker_data of markers_data) {
+        const marker = createMarker(map, marker_data);
+        bounds.extend(marker.position)
     }
 
     map.fitBounds(bounds)
@@ -75,10 +105,6 @@ function initMap() {
         map.setZoom(max_zoom)
     }
 
-
-    // Set the last info window to null
-    var last_info = null;
-
     setTimeout(setMaxZoom, 100)
 }
 

people/templates/people/person/map.html

@@ -7,7 +7,7 @@
     <script src="{% static 'js/map.js' %}"></script>
 
     <script async defer
-            src="https://maps.googleapis.com/maps/api/js?key={{ settings.GOOGLE_MAPS_API_KEY }}&callback=initMap"
+            src="https://maps.googleapis.com/maps/api/js?key={{ settings.GOOGLE_MAPS_API_KEY }}&libraries=places&callback=initMap"
             type="text/javascript"></script>
 {% endblock %}
 

people/views/person.py

@@ -106,15 +106,21 @@ def get_map_data(person: models.Person) -> typing.Dict[str, typing.Any]:
     try:
         latitude = answer_set.latitude or None
         longitude = answer_set.longitude or None
+        organisation = answer_set.organisation.name or None
+        country = answer_set.country_of_residence.name or None
 
     except AttributeError:
         latitude = None
         longitude = None
+        organisation = None
+        country = None
 
     return {
         'name': person.name,
         'lat': latitude,
         'lng': longitude,
+        'organisation': organisation,
+        'country': country,
         'url': reverse('people:person.detail', kwargs={'pk': person.pk})
     }