From 13befd298ab9d039870946ef9b9a868c7d615a41 Mon Sep 17 00:00:00 2001
From: Lachlan Kermode <lachiekermode@gmail.com>
Date: Wed, 5 Dec 2018 11:36:29 +0000
Subject: [PATCH] clean handler semantics in Dashboard.jsx (further)

---
 src/components/CardStack.jsx |  1 -
 src/components/Dashboard.jsx | 12 +++++++-----
 src/components/Timeline.jsx  |  8 +-------
 src/js/map/map.js            |  3 +--
 src/store/initial.js         |  4 ++--
 5 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/components/CardStack.jsx b/src/components/CardStack.jsx
index 05fbddf..f5bc36e 100644
--- a/src/components/CardStack.jsx
+++ b/src/components/CardStack.jsx
@@ -22,7 +22,6 @@ class CardStack extends React.Component {
             event={event}
             language={this.props.language}
             tools={this.props.tools}
-            // isLoading={this.props.isLoading}
             getNarrativeLinks={this.props.getNarrativeLinks}
             getCategoryGroup={this.props.getCategoryGroup}
             getCategoryColor={this.props.getCategoryColor}
diff --git a/src/components/Dashboard.jsx b/src/components/Dashboard.jsx
index 162bd75..d9e93a2 100644
--- a/src/components/Dashboard.jsx
+++ b/src/components/Dashboard.jsx
@@ -94,8 +94,8 @@ class Dashboard extends React.Component {
       <div>
         <Viewport
           methods={{
-            select: this.handleSelect,
-            highlight: this.handleHighlight,
+            onSelect: this.handleSelect,
+            // onHighlight: this.handleHighlight,
             getCategoryColor: category => this.getCategoryColor(category)
           }}
         />
@@ -111,9 +111,11 @@ class Dashboard extends React.Component {
           getCategoryColor={category => this.getCategoryColor(category)}
         />
         <Timeline
-          onSelect={this.handleSelect}
-          onUpdateTimerange={this.updateTimerange}
-          getCategoryColor={category => this.getCategoryColor(category)}
+          methods={{
+            onSelect: this.handleSelect,
+            onUpdateTimerange: this.updateTimerange,
+            getCategoryColor: category => this.getCategoryColor(category)
+          }}
         />
         <InfoPopUp
           ui={this.props.ui}
diff --git a/src/components/Timeline.jsx b/src/components/Timeline.jsx
index 234d434..74e6455 100644
--- a/src/components/Timeline.jsx
+++ b/src/components/Timeline.jsx
@@ -19,13 +19,7 @@ class Timeline extends React.Component {
       dom: this.props.dom
     }
 
-    const methods = {
-      onSelect: this.props.onSelect,
-      onUpdateTimerange: this.props.onUpdateTimerange,
-      getCategoryColor: this.props.getCategoryColor
-    }
-
-    this.timeline = new TimelineLogic(this.props.app, ui, methods);
+    this.timeline = new TimelineLogic(this.props.app, ui, this.props.methods);
     this.timeline.update(this.props.domain, this.props.app);
     this.timeline.render(this.props.domain);
   }
diff --git a/src/js/map/map.js b/src/js/map/map.js
index d05e555..8d84554 100644
--- a/src/js/map/map.js
+++ b/src/js/map/map.js
@@ -21,7 +21,6 @@ export default function(newApp, ui, methods) {
   }
 
   const getCategoryColor = methods.getCategoryColor;
-  const select = methods.select;
   const narrativeProps = ui.narratives;
 
     // Map Settings
@@ -272,7 +271,7 @@ Stop and start the development process in terminal after you have added your tok
                   ${lMap.latLngToLayerPoint(d.LatLng).y})`;
       })
       .on('click', (location) => {
-        select(location.events);
+        methods.onSelect(location.events);
       });
 
     const eventsDom = g.selectAll('.location')
diff --git a/src/store/initial.js b/src/store/initial.js
index 4c8cdbb..b675188 100644
--- a/src/store/initial.js
+++ b/src/store/initial.js
@@ -119,10 +119,10 @@ const initial = {
 
       narratives: {
         default: {
-          style: 'solid',                  // ['dotted', 'solid']
+          style: 'dotted',                  // ['dotted', 'solid']
           opacity: 0.9,                     // range between 0 and 1
           stroke: 'red',               // Any hex or rgb code
-          strokeWidth: 5
+          strokeWidth: 2
         },
         narrative_1: {
           style: 'solid',                  // ['dotted', 'solid']