peterstockings/cardio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rename some templates and convert remaining js to hyperscript

Browse Source
This commit is contained in:
Peter Stockings
2023-10-20 20:04:07 +11:00
parent 996e47d2b4
commit dc13b05420
6 changed files with 17 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app.py
View File

@@ -330,7 +330,7 @@ def render_users_and_workouts():
users_data = [generate_user_data(user, get_workouts_for_user_view_data(
user)) for user in users]
template_name = 'users_and_workouts_wrapper.html' if htmx else 'users_and_workouts.html'
template_name = 'users_and_workouts_list.html' if htmx else 'overview.html'
return render_template(template_name, users=users_data, bikes=Bike.query.all())

9
templates/users_and_workouts.html → templates/overview.html
View File

@@ -37,7 +37,7 @@
<div class="flex py-3">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 640 512"
class="w-9 h-9 mr-2"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. -->
class="w-9 h-9 mr-2">
<path
d="M312 32c-13.3 0-24 10.7-24 24s10.7 24 24 24h25.7l34.6 64H222.9l-27.4-38C191 99.7 183.7 96 176 96H120c-13.3 0-24 10.7-24 24s10.7 24 24 24h43.7l22.1 30.7-26.6 53.1c-10-2.5-20.5-3.8-31.2-3.8C57.3 224 0 281.3 0 352s57.3 128 128 128c65.3 0 119.1-48.9 127-112h49c8.5 0 16.3-4.5 20.7-11.8l84.8-143.5 21.7 40.1C402.4 276.3 384 312 384 352c0 70.7 57.3 128 128 128s128-57.3 128-128s-57.3-128-128-128c-13.5 0-26.5 2.1-38.7 6L375.4 48.8C369.8 38.4 359 32 347.2 32H312zM458.6 303.7l32.3 59.7c6.3 11.7 20.9 16 32.5 9.7s16-20.9 9.7-32.5l-32.3-59.7c3.6-.6 7.4-.9 11.2-.9c39.8 0 72 32.2 72 72s-32.2 72-72 72s-72-32.2-72-72c0-18.6 7-35.5 18.6-48.3zM133.2 368h65c-7.3 32.1-36 56-70.2 56c-39.8 0-72-32.2-72-72s32.2-72 72-72c1.7 0 3.4 .1 5.1 .2l-24.2 48.5c-9 18.1 4.1 39.4 24.3 39.4zm33.7-48l50.7-101.3 72.9 101.2-.1 .1H166.8zm90.6-128H365.9L317 274.8 257.4 192z">
</path>
@@ -57,13 +57,8 @@
<div class="max-w-4xl mx-auto mt-8">
<div class="flex flex-col justify-between">
<div class="w-full px-4 mb-8">
<div class="shadow-md rounded-lg overflow-hidden" id="users-container">
{% with users=users, bikes=bikes %}
{% include 'users_and_workouts_wrapper.html' %}
{% endwith %}
{{ render_partial('users_and_workouts_list.html', users=users, bikes=bikes) }}
</div>
</div>
<div class="w-full px-4 mb-8" id="container">

8
templates/users.html
View File

@@ -17,14 +17,14 @@
<div class="relative ml-0">
<select
class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
id="new-bike-select" data-te-select-init data-te-select-size="lg" name="bike_id" required>
data-te-select-init data-te-select-size="lg" name="bike_id" required _="init js(me)
te.Select.getOrCreateInstance(me)
end">
{% for b in bikes %}
<option value="{{ b.id }}">{{ b.display_name }}</option>
{% endfor %}
</select>
<script>
te.Select.getOrCreateInstance(document.querySelector("#new-bike-select"));
</script>
</div>
</div>

0
templates/users_and_workouts_wrapper.html → templates/users_and_workouts_list.html
View File

11
templates/workout_view.html
View File

@@ -1,8 +1,10 @@
<div class="flex justify-center pt-4 px-4">
<div class="mb-3 w-full md:w-1/3">
<select id="multiSelection-{{ workout.id }}" 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-{{ workout.id }}">
<select 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-{{ workout.id }}" _="init js(me)
te.Select.getOrCreateInstance(me).setValue({{ graph_types | safe }})
end">
<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>
@@ -12,9 +14,6 @@
</select>
</div>
</div>
<script>
te.Select.getOrCreateInstance(document.querySelector("#multiSelection-{{ workout.id }}")).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) }}"

10
templates/workouts_list.html
View File

@@ -23,16 +23,16 @@
<div class="relative">
<select
class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
id="user-{{ user.id }}-bike-select" data-te-select-init data-te-select-size="lg" name="bike_id"
required hx-get="{{ url_for('update_users_bike', user_id=user.id) }}" hx-target="#users-container">
data-te-select-init data-te-select-size="lg" name="bike_id" required
hx-get="{{ url_for('update_users_bike', user_id=user.id) }}" hx-target="#users-container" _="init js(me)
te.Select.getOrCreateInstance(me).setValue('{{ user.bike_id | safe }}')
end">
{% for b in bikes %}
<option value="{{ b.id }}" {% if user.bike_id==b.id %} selected {% endif %}>{{ b.display_name }}
</option>
{% endfor %}
</select>
<script>
te.Select.getOrCreateInstance(document.querySelector("#user-{{ user.id }}-bike-select")).setValue("{{ user.bike_id | safe }}");
</script>
</div>
</div>
<a class="shadow mt-6 bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded w-full ml-0 md:ml-4 text-center "