From 9d5d3b4507c168ec319b7fde515a3da654e2e8d6 Mon Sep 17 00:00:00 2001
From: Peter Stockings <pstockings@jadeworld.com>
Date: Sat, 9 Dec 2023 14:03:09 +1100
Subject: [PATCH] Instead of adding interactive popup on mouse over of plot
 point, switch to mouse over of rectangle around the timestamp (reduces file
 size by another third 29.7kb => 17.9)

---
 db.py                             |  3 +++
 templates/partials/sparkline.html | 15 ++++++++++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/db.py b/db.py
index 8f096bf..ec229f0 100644
--- a/db.py
+++ b/db.py
@@ -547,6 +547,8 @@ class DataBase():
             'points': list(weight_points)
         }
 
+        plot_labels = zip(relative_positions, messages)
+
         # Return exercise data with SVG dimensions and data points
         return {
             'exercise_name': topsets[0]['exercise_name'],
@@ -554,4 +556,5 @@ class DataBase():
             'vb_height': vb_height,
             'plots': [estimated_1rm, repetitions, weight],
             'best_fit_points': list(best_fit_points),
+            'plot_labels': plot_labels
         }
\ No newline at end of file
diff --git a/templates/partials/sparkline.html b/templates/partials/sparkline.html
index bd2e8c2..c9039cf 100644
--- a/templates/partials/sparkline.html
+++ b/templates/partials/sparkline.html
@@ -23,7 +23,6 @@
         {% set x = (position * vb_width)+margin %}
         {% set y = (vb_height - value)+margin %}
         <circle cx="{{ x | round(precision) }}" cy="{{ y | round(precision) }}" r="1" stroke="{{ color }}" fill="{{ color }}"></circle>
-        <circle cx="{{ x | round(precision) }}" cy="{{ y | round(precision) }}" r="5" class="plot_point cursor-pointer" data-message="{{ message }}" fill-opacity="0%"></circle>
     {% endfor %}
 {% endmacro %}
 
@@ -56,6 +55,20 @@
         {{ plot_line(plot.points, plot.color) }}
         </g>
         {% endfor %}
+
+        {% for pos, message in plot_labels %}
+        <rect 
+            x="{{ (pos * vb_width) - (stroke_width/2) + margin }}" 
+            y="{{ 0 }}" 
+            width="{{ stroke_width }}" 
+            height="{{ vb_height + margin }}"
+            class="plot_point"
+            data-message="{{ message }}"
+            fill-opacity="0%"></rect>
+        {% endfor %}
+
+        {% for pos in relative_positions %}
+        {% endfor %}
     </svg>
     <div class="flex justify-center pt-2">
         {% for plot in plots %}