From e1dc09301bc426126ae87d80132225593b40bf43 Mon Sep 17 00:00:00 2001
From: Franc Camps-Febrer <francamps@gmail.com>
Date: Tue, 8 Jan 2019 15:43:07 +0100
Subject: [PATCH] Set map bounds on narrative

---
 src/components/Map.jsx |  6 +++++-
 src/reducers/app.js    | 12 +++++++++++-
 src/store/initial.js   |  1 +
 3 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/src/components/Map.jsx b/src/components/Map.jsx
index 5849087..894fcf2 100644
--- a/src/components/Map.jsx
+++ b/src/components/Map.jsx
@@ -44,7 +44,10 @@ class Map extends React.Component {
         this.map.setView([eventPoint.latitude, eventPoint.longitude]);
       }
     }
-  }
+    if (hash(nextProps.app.mapBounds) !== hash(this.props.app.mapBounds) && nextProps.app.mapBounds !== null) {
+      this.map.fitBounds(nextProps.app.mapBounds);
+    }
+  }  
 
   initializeMap() {
     /**
@@ -246,6 +249,7 @@ function mapStateToProps(state) {
       selected: state.app.selected,
       highlighted: state.app.highlighted,
       mapAnchor: state.app.mapAnchor,
+      mapBounds: state.app.filters.mapBounds
       narrative: state.app.narrative,
       flags: {
         isShowingSites: state.app.flags.isShowingSites
diff --git a/src/reducers/app.js b/src/reducers/app.js
index d2ea62a..7b8f828 100644
--- a/src/reducers/app.js
+++ b/src/reducers/app.js
@@ -39,6 +39,10 @@ function updateNarrative(appState, action) {
   let minTime = appState.filters.timerange[0];
   let maxTime = appState.filters.timerange[1];
 
+  let cornerBound0 = [180, 180];
+  let cornerBound1 = [-180, -180];
+
+  // Compute narrative time range and map bounds
   if (!!action.narrative) {
     minTime = parseDate('2100-01-01T00:00:00');
     maxTime = parseDate('1900-01-01T00:00:00');
@@ -47,6 +51,11 @@ function updateNarrative(appState, action) {
       const stepTime = parseDate(step.timestamp);
       if (stepTime < minTime) minTime = stepTime;
       if (stepTime > maxTime) maxTime = stepTime;
+
+      if (+step.longitude < cornerBound0[1]) cornerBound0[1] = +step.longitude;
+      if (+step.longitude > cornerBound1[1]) cornerBound1[1] = +step.longitude;
+      if (+step.latitude < cornerBound0[0]) cornerBound0[0] = +step.latitude;
+      if (+step.latitude > cornerBound1[0]) cornerBound1[0] = +step.latitude;
     });
   }
 
@@ -58,7 +67,8 @@ function updateNarrative(appState, action) {
     },
     filters: {
       ...appState.filters,
-      timerange: [minTime, maxTime]
+      timerange: [minTime, maxTime],
+      mapBounds: [cornerBound0, cornerBound1]
     }
   }
 }
diff --git a/src/store/initial.js b/src/store/initial.js
index ba29a5d..dbfbd19 100644
--- a/src/store/initial.js
+++ b/src/store/initial.js
@@ -41,6 +41,7 @@ const initial = {
         d3.timeParse("%Y-%m-%dT%H:%M:%S")("2013-02-23T12:00:00"),
         d3.timeParse("%Y-%m-%dT%H:%M:%S")("2016-02-23T12:00:00")
       ],
+      mapBounds: null,
       tags: [],
       categories: [],
       views: {