Merge pull request #367 from UniversityRadioYork/alyx-new-map

Change map to use OSM
UniversityRadioYork · Jun 13, 2024 · 6c56fd0 · 6c56fd0
2 parents fca0575 + 767ed63
commit 6c56fd0
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 51 deletions.
diff --git a/config.toml.example b/config.toml.example
@@ -68,8 +68,7 @@
 		cinPlaylistID = "PLsxUDJzU4VKAAH1pOogbzJx7pZgd-2zOx"
 		channelURL = "//youtube.com/ury1350"
 
-	[pageContext.gmaps]
-		APIKey = "AIzaSyACeeyIgdIhiSxV01OIPiA3MyJDqrOspLQ"
+	[pageContext.osm]
 		latitude = 53.948193
 		longitude = -1.054030
 

diff --git a/public/js/responsivemap.js b/public/js/responsivemap.js
@@ -1,38 +1,7 @@
-/*global google:true placeName*/
-
-$(document).ready(function () {
-  //Google Maps JS
-  //Set Map
-  function initialize() {
-    var uryLocation = new google.maps.LatLng(Lat, Lng);
-    var mapOptions = {
-      zoom: 15,
-      center: uryLocation
-    };
-
-    var map = new google.maps.Map(document.getElementById("map"), mapOptions);
-    //Callout Content
-    var contentString = placeName;
-    //Set window width + content
-    var infowindow = new google.maps.InfoWindow({
-      content: contentString,
-      maxWidth: 500
-    });
-
-    //Add Marker
-    var marker = new google.maps.Marker({
-      position: uryLocation,
-      map,
-      title: placeName
-    });
-
-    //Resize Function
-    google.maps.event.addDomListener(window, "resize", function () {
-      var center = map.getCenter();
-      google.maps.event.trigger(map, "resize");
-      map.setCenter(center);
-    });
-  }
-
-  google.maps.event.addDomListener(window, "load", initialize);
-});
+var map = L.map('map').setView([Lat, Lng], 15);
+L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+    maxZoom: 19,
+    attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+}).addTo(map);
+var marker = L.marker([Lat, Lng]).addTo(map);
+marker.bindPopup("University Radio York").openPopup();
diff --git a/structs/config.go b/structs/config.go
@@ -50,7 +50,7 @@ type PageContext struct {
 	CacheBuster      string                `toml:"cacheBuster"`
 	Pages            []Page
 	Youtube          youtube
-	Gmaps            gmaps
+	Osm              osm
 	CurrentYear      int
 }
 
@@ -99,8 +99,7 @@ type youtube struct {
 	ChannelURL         string `toml:"channelURL"`
 }
 
-type gmaps struct {
-	APIKey string  `toml:"apiKey"`
+type osm struct {
 	Lat    float32 `toml:"latitude"`
 	Lng    float32 `toml:"longitude"`
 }

diff --git a/views/cin.tmpl b/views/cin.tmpl
@@ -1,7 +1,10 @@
 {{define "title"}}{{.PageContext.ShortName}} | Candidate Interview Night{{end}}
 
-{{define "content"}}
+{{define "head"}}
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+{{end}}
+
+{{define "content"}}
 <div class="container-fluid bg-cin-2">
 <div class="container bg-cin bg-cin-space">
     <div class="container container-padded">

diff --git a/views/contact.tmpl b/views/contact.tmpl
@@ -11,6 +11,11 @@
 <meta property="og:image" content="{{.PageContext.FullURL}}{{url "/images/open_graph-general.jpg"}}">
 <meta property="og:url" content="{{.PageContext.FullURL}}{{url "/contact/"}}">
 {{end}}
+{{define "head"}}
+<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
+     integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
+     crossorigin=""/>
+{{end}}
 
 {{define "content"}}
 <div class="container-fluid banner-2 text-overlay">
@@ -142,9 +147,11 @@
 <!-- Responsive map script -->
 <script>
 var placeName = "{{.PageContext.LongName}}";
-var Lat = {{.PageContext.Gmaps.Lat}};
-var Lng = {{.PageContext.Gmaps.Lng}};
+var Lat = {{.PageContext.Osm.Lat}};
+var Lng = {{.PageContext.Osm.Lng}};
 </script>
+ <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
+     integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
+     crossorigin=""></script>
 <script src='{{url "/js/responsivemap.js"}}?ver={{ .PageContext.CacheBuster }}'></script>
-<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key={{.PageContext.Gmaps.APIKey}}"></script>
 {{end}}
diff --git a/views/partials/base.tmpl b/views/partials/base.tmpl
@@ -14,7 +14,7 @@
     <meta name="description" content="{{.PageContext.SiteDescription}}">
 
     <title>{{block "title" .}}{{.PageContext.LongName}}{{end}}</title>
-    
+
     {{block "open-graph" .}}
     <meta name="twitter:card" content="summary_large_image">
     <meta name="twitter:site" content="@{{.PageContext.MainTwitter}}">
@@ -27,6 +27,9 @@
     <meta property="og:url" content='{{.PageContext.FullURL}}{{url "/"}}'>
     {{end}}
 
+    {{block "head" .}}
+    {{end}}
+
     <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha256-4+XzXVhsDmqanXGHaHvgh1gMQKX40OUvDEBTu8JcmNs=" crossorigin="anonymous"></script>
     <!-- bootstrap -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>

diff --git a/views/podcast_player.tmpl b/views/podcast_player.tmpl
@@ -19,6 +19,11 @@
 <meta property="og:description" content="{{ stripHtml .PageData.Podcast.Description}}">
 {{end}}
 
+{{define "head"}}
+<link rel="stylesheet" href='{{url "/css/podcast_player.css"}}'>
+<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway:400,500">
+{{end}}
+
 {{define "content"}}
 
 {{with .PageData}}
@@ -87,7 +92,5 @@
   });
 
 </script>
-<link rel="stylesheet" href='{{url "/css/podcast_player.css"}}'>
-<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway:400,500">
 {{end}}
 {{end}}
diff --git a/views/show.tmpl b/views/show.tmpl
@@ -15,6 +15,9 @@
 <meta property="og:url" content='{{.PageContext.FullURL}}{{url "/schedule/shows/"}}{{.PageData.Show.ShowID}}'>
 <meta property="og:description" content="{{ stripHtml .PageData.Show.Description}}">
 {{end}}
+{{define "head"}}
+<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.18/css/dataTables.bootstrap4.min.css">
+{{end}}
 
 {{define "content"}}
 <div class="container-fluid current-next">
@@ -241,7 +244,6 @@
 {{end}}
 {{end}}
 {{define "footer-scripts"}}
-<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.18/css/dataTables.bootstrap4.min.css">
 <script src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
 <script src="//cdn.datatables.net/1.10.18/js/dataTables.bootstrap4.min.js"></script>
 <script src="//cdn.datatables.net/plug-ins/1.10.16/api/fnFindCellRowIndexes.js"></script>