From 3eed45a5ef408139e1c789af944be68568533405 Mon Sep 17 00:00:00 2001
From: Franc Camps-Febrer <francamps@gmail.com>
Date: Thu, 31 Jan 2019 13:19:39 -0500
Subject: [PATCH] Allow customization of selected event ring on map, via config

---
 src/components/Map.jsx                               |  2 ++
 src/components/presentational/Map/SelectedEvents.jsx | 12 +++++++-----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/Map.jsx b/src/components/Map.jsx
index 7074381..aec6800 100644
--- a/src/components/Map.jsx
+++ b/src/components/Map.jsx
@@ -220,6 +220,7 @@ class Map extends React.Component {
         svg={this.svgRef.current}
         selected={this.props.app.selected}
         projectPoint={this.projectPoint}
+        styles={this.props.ui.mapSelectedEvents}
       />
     )
   }
@@ -279,6 +280,7 @@ function mapStateToProps (state) {
       tiles: state.ui.tiles,
       dom: state.ui.dom,
       narratives: state.ui.style.narratives,
+      mapSelectedEvents: state.ui.style.mapSelectedEvents,
       shapes: state.ui.style.shapes
     }
   }
diff --git a/src/components/presentational/Map/SelectedEvents.jsx b/src/components/presentational/Map/SelectedEvents.jsx
index abbf984..f252686 100644
--- a/src/components/presentational/Map/SelectedEvents.jsx
+++ b/src/components/presentational/Map/SelectedEvents.jsx
@@ -4,21 +4,23 @@ import { Portal } from 'react-portal'
 class MapSelectedEvents extends React.Component {
   renderMarker (event) {
     const { x, y } = this.props.projectPoint([event.latitude, event.longitude])
+    const styles = this.props.styles
+    const r = styles ? styles.r : 24
     return (
       <g
         className='location-marker'
-        transform={`translate(${x - 32}, ${y})`}
+        transform={`translate(${x - r}, ${y})`}
       >
         <path
           className='leaflet-interactive'
-          stroke='#ffffff'
+          stroke={styles ? styles.stroke : '#ffffff'}
           stroke-opacity='1'
-          stroke-width='3'
+          stroke-width={styles ? styles['stroke-width'] : 2}
           stroke-linecap=''
           stroke-linejoin='round'
-          stroke-dasharray='5,2'
+          stroke-dasharray={styles ? styles['stroke-dasharray'] : '2,2'}
           fill='none'
-          d='M0,0a32,32 0 1,0 64,0 a32,32 0 1,0 -64,0 '
+          d={`M0,0a${r},${r} 0 1,0 ${r*2},0 a${r},${r} 0 1,0 -${r*2},0 `}
         />
       </g>
     )