From 78e950d2119286052569d89e5896b70caec17959 Mon Sep 17 00:00:00 2001
From: Lachlan Kermode <lachiekermode@gmail.com>
Date: Mon, 6 Apr 2020 19:56:51 +0200
Subject: [PATCH] better markers

---
 src/components/presentational/Timeline/Markers.js | 14 +++++---------
 src/components/presentational/Timeline/Project.js |  5 +++--
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/src/components/presentational/Timeline/Markers.js b/src/components/presentational/Timeline/Markers.js
index 2f97ab4..9709f9f 100644
--- a/src/components/presentational/Timeline/Markers.js
+++ b/src/components/presentational/Timeline/Markers.js
@@ -1,11 +1,10 @@
 import React from 'react'
 import colors, { sizes } from '../../../common/global'
 
-const MARKER_DISPLACED = sizes.eventDotR * 2
 const TimelineMarkers = ({
   styles,
   getEventX,
-  getCategoryY,
+  getY,
   transitionDuration,
   selected,
   dims,
@@ -24,7 +23,7 @@ const TimelineMarkers = ({
         stroke-linejoin='round'
         stroke-dasharray={styles ? styles['stroke-dasharray'] : '2,2'}
         style={{
-          'transform': `translate(${getEventX(event.timestamp)}px, ${getCategoryY(event.category)}px)`,
+          'transform': `translate(${getEventX(event.timestamp)}px, ${getY(event)}px)`,
           '-webkit-transition': `transform ${transitionDuration / 1000}s ease`,
           '-moz-transition': 'none',
           'opacity': 0.9
@@ -35,21 +34,18 @@ const TimelineMarkers = ({
       <rect
         className='timeline-marker'
         x={0}
-        y={-dims.marginTop - (noCategories > 2 ? noCategories * MARKER_DISPLACED : MARKER_DISPLACED)}
+        y={0}
         width={sizes.eventDotR}
-        height={dims.trackHeight}
+        height={dims.contentHeight - 55}
         stroke={styles ? styles.stroke : colors.primaryHighlight}
         stroke-opacity='1'
         stroke-width={styles ? styles['stroke-width'] : 1}
         stroke-dasharray={styles ? styles['stroke-dasharray'] : '2,2'}
         style={{
-          'transform': `translate(${getEventX(event.timestamp)}px, 40px)`,
-          '-webkit-transition': `transform ${transitionDuration / 1000}s ease`,
-          '-moz-transition': 'none',
+          'transform': `translate(${getEventX(event.timestamp)}px)`,
           'opacity': 0.9
         }}
       />
-
     )
   }
 
diff --git a/src/components/presentational/Timeline/Project.js b/src/components/presentational/Timeline/Project.js
index 9fd21c1..8b47bc2 100644
--- a/src/components/presentational/Timeline/Project.js
+++ b/src/components/presentational/Timeline/Project.js
@@ -8,11 +8,12 @@ export default ({
   end,
   getX,
   dims,
-  colour
+  colour,
+  onClick
 }) => {
   const length = getX(end) - getX(start)
   return <rect
-    onClick={() => console.error('TODO: associate all events')}
+    onClick={onClick}
     className='project'
     x={getX(start)}
     y={dims.trackHeight - offset}