21 lines
1.2 KiB
HTML
21 lines
1.2 KiB
HTML
<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 %} |