Add ability to choose graphs to render, speed by default

templates/workout_view.html

@@ -0,0 +1,21 @@
+<div class="flex justify-center pt-4 px-4">
+    <div class="mb-3 w-full md:w-1/3">
+        <select id="multiSelection" data-te-select-init name="graph_types" class="mx-auto w-full" multiple
+            hx-trigger="change" hx-get="{{ url_for('view_workout', user_id=workout.user_id, workout_id=workout.id) }}"
+            hx-target="#workout_view">
+            <option value="cadence" {% if 'cadence' in graph_types %} selected {% endif%}>Cadence</option>
+            <option value="speed" {% if 'speed' in graph_types %} selected {% endif%}>Speed</option>
+            <option value="power" {% if 'power' in graph_types %} selected {% endif%}>Power</option>
+            <option value="distance" {% if 'distance' in graph_types %} selected {% endif%}>Distance</option>
+            <option value="calories" {% if 'calories' in graph_types %} selected {% endif%}>Calories</option>
+        </select>
+    </div>
+</div>
+<script>
+    te.Select.getOrCreateInstance(document.querySelector("#multiSelection")).setValue({{ graph_types| safe }});
+</script>
+
+{% for graph_type in graph_types %}
+<img src="{{ url_for('workout', user_id=workout.user_id, workout_id=workout.id, graph_type=graph_type) }}"
+    loading="lazy" alt="No image" class="mx-auto">
+{% endfor %}