From c8e7a10be948c2405d46d8c3caf4a8c6675eee29 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Wed, 27 Feb 2019 19:35:54 +0100
Subject: rebuild

---
 client/map/index.js | 1 +
 1 file changed, 1 insertion(+)

(limited to 'client/map/index.js')

diff --git a/client/map/index.js b/client/map/index.js
index 2a6686be..d38855bf 100644
--- a/client/map/index.js
+++ b/client/map/index.js
@@ -78,6 +78,7 @@ export default function append(el, payload) {
     source = [address.lat, address.lng].map(n => parseFloat(n))
   }
 
+  // ....i dont think the sort order does anything??
   citations.sort((a,b) => sortOrder.indexOf(a) - sortOrder.indexOf(b))
   .forEach(citation => {
     const address = citation.addresses[0]
-- 
cgit v1.2.3-70-g09d2


From d8ea57ede73087e0590bc98c7a018f3f185d057a Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Thu, 28 Feb 2019 16:40:21 +0100
Subject: div over leaflet map

---
 client/map/index.js         | 38 ++++++++++++++++++++++++++------------
 site/assets/css/applets.css | 22 ++++++++++++++++++++++
 2 files changed, 48 insertions(+), 12 deletions(-)

(limited to 'client/map/index.js')

diff --git a/client/map/index.js b/client/map/index.js
index d38855bf..53d9439d 100644
--- a/client/map/index.js
+++ b/client/map/index.js
@@ -2,25 +2,25 @@ import L from 'leaflet'
 import './leaflet.bezier'
 
 const arcStyles = {
-  'edu': {
+  edu: {
     color: 'rgb(245, 246, 150)',
     fillColor: 'rgb(245, 246, 150)',
     opacity: 0.5,
     weight: '1',
   },
-  'company': {
+  company: {
     color: 'rgb(50, 100, 246)',
     fillColor: 'rgb(50, 100, 246)',
     opacity: 1.0,
     weight: '2',
   },
-  'gov': {
+  gov: {
     color: 'rgb(245, 150, 100)',
     fillColor: 'rgb(245, 150, 150)',
     opacity: 1.0,
     weight: '2',
   },
-  'mil': {
+  mil: {
     color: 'rgb(245, 0, 0)',
     fillColor: 'rgb(245, 0, 0)',
     opacity: 1.0,
@@ -79,17 +79,31 @@ export default function append(el, payload) {
   }
 
   // ....i dont think the sort order does anything??
-  citations.sort((a,b) => sortOrder.indexOf(a) - sortOrder.indexOf(b))
-  .forEach(citation => {
-    const address = citation.addresses[0]
-    const latlng = [address.lat, address.lng].map(n => parseFloat(n))
-    if (Number.isNaN(latlng[0]) || Number.isNaN(latlng[1])) return
-    addMarker(map, latlng, citation.title, address.name)
-    addArc(map, source, latlng, arcStyles[address.type])
-  })
+  citations.sort((a, b) => sortOrder.indexOf(a) - sortOrder.indexOf(b))
+    .forEach(citation => {
+      const citationAddress = citation.addresses[0]
+      const latlng = [citationAddress.lat, citationAddress.lng].map(n => parseFloat(n))
+      if (Number.isNaN(latlng[0]) || Number.isNaN(latlng[1])) return
+      addMarker(map, latlng, citation.title, citationAddress.name)
+      addArc(map, source, latlng, arcStyles[citationAddress.type])
+    })
 
   console.log(paper)
 
   const rootMarker = addMarker(map, source, paper.title, paper.address)
   rootMarker.openPopup()
+
+  // a transparent div to cover the map, so normal scroll events will not be eaten by leaflet
+  const mapCover = document.createElement("div")
+  mapCover.classList.add("map_cover")
+  mapCover.innerHTML = "<div class='cover_message'>Click here to explore the map</div>"
+  mapCover.querySelector('div').addEventListener('click', () => {
+    el.removeChild(mapCover)
+  })
+  function stopPropagation(e) {
+    e.stopPropagation()
+  }
+  mapCover.addEventListener('mousewheel', stopPropagation, true)
+  mapCover.addEventListener('DOMMouseScroll', stopPropagation, true)
+  el.appendChild(mapCover)
 }
diff --git a/site/assets/css/applets.css b/site/assets/css/applets.css
index 729737fe..e84fcfc2 100644
--- a/site/assets/css/applets.css
+++ b/site/assets/css/applets.css
@@ -140,6 +140,28 @@
 .map {
   margin-bottom: 20px;
 }
+.map_cover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+  background: rgba(0,0,0,0.8);
+  z-index: 9998; /* site header is 9999 */
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 36px;
+  transition: opacity 0.4s cubic-bezier(0,0,1,1);
+  opacity: 1;
+}
+.desktop .map_cover {
+  opacity: 0;
+}
+.desktop .map_cover:hover {
+  opacity: 1;
+}
 
 /* tabulator */
 
-- 
cgit v1.2.3-70-g09d2


From ce570d47b47017ee3fb42227e47ec345df08bd18 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Thu, 28 Feb 2019 16:52:14 +0100
Subject: scroll thing

---
 client/map/index.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

(limited to 'client/map/index.js')

diff --git a/client/map/index.js b/client/map/index.js
index 53d9439d..56a5abed 100644
--- a/client/map/index.js
+++ b/client/map/index.js
@@ -98,6 +98,7 @@ export default function append(el, payload) {
   mapCover.classList.add("map_cover")
   mapCover.innerHTML = "<div class='cover_message'>Click here to explore the map</div>"
   mapCover.querySelector('div').addEventListener('click', () => {
+    map.scrollWheelZoom.enable()
     el.removeChild(mapCover)
   })
   function stopPropagation(e) {
@@ -105,5 +106,16 @@ export default function append(el, payload) {
   }
   mapCover.addEventListener('mousewheel', stopPropagation, true)
   mapCover.addEventListener('DOMMouseScroll', stopPropagation, true)
+
+  map.scrollWheelZoom.disable()
+  map.on('focus', () => {
+    map.scrollWheelZoom.enable()
+    el.removeChild(mapCover)
+  })
+  map.on('blur', () => {
+    map.scrollWheelZoom.disable()
+    // el.appendChild(mapCover)
+  })
+
   el.appendChild(mapCover)
 }
-- 
cgit v1.2.3-70-g09d2