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

Switch from using workout modal and change to workout page, still need to cleanup modal logic and templates. Need to fix workout tag functionality

Browse Source
This commit is contained in:
Peter Stockings
2024-11-04 22:02:06 +11:00
parent 1a970d1d7b
commit 10326ccd7a
8 changed files with 106 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app.py
View File

@@ -158,22 +158,21 @@ def get_workout_modal(person_id, workout_id):
@ app.route("/person/<int:person_id>/workout", methods=['POST'])
@ validate_person
def create_workout(person_id):
new_workout_id = db.create_workout(person_id)
workout = db.get_workout(person_id, new_workout_id)
(person_tags, workout_tags, selected_workout_tag_ids) = db.get_workout_tags(
person_id, new_workout_id)
exercises = db.get_all_exercises()
return render_template('partials/workout_modal.html',
**workout, person_tags=person_tags, workout_tags=workout_tags, selected_workout_tag_ids=selected_workout_tag_ids, exercises=exercises), 200, {"HX-Trigger": "updatedPeople"}
view_model = db.workout.get(person_id, new_workout_id)
return render_block(app.jinja_env, 'workout.html', 'content', **view_model)
@ app.route("/person/<int:person_id>/workout/<int:workout_id>/delete", methods=['DELETE'])
@ app.route("/person/<int:person_id>/workout/<int:workout_id>/delete", methods=['GET'])
@ validate_workout
def delete_workout(person_id, workout_id):
db.delete_workout(workout_id)
return "", 200, {"HX-Trigger": "updatedPeople"}
return redirect(url_for('get_calendar', person_id=person_id))
#return "", 200, {"HX-Trigger": "updatedPeople", "HX-Push-Url": url_for('get_calendar', person_id=person_id)}
@ app.route("/person/<int:person_id>/workout/<int:workout_id>/start_date_edit_form", methods=['GET'])
@@ -436,13 +435,16 @@ def get_stats_for_person(person_id):
@ app.route("/person/<int:person_id>/workout/<int:workout_id>", methods=['GET'])
def show_workout(person_id, workout_id):
view_model = db.workout.get(person_id, workout_id)
if htmx:
return render_block(app.jinja_env, 'workout.html', 'content', **view_model)
return render_template('workout.html', **view_model)
@app.route("/exercises/get")
def get_exercises():
query = request.args.get('query')
person_id = request.args.get('person_id', type=int)
exercises = db.exercises.get(query)
return render_template('partials/exercise/exercise_dropdown.html', exercises=exercises)
return render_template('partials/exercise/exercise_dropdown.html', exercises=exercises, person_id=person_id)
@app.route("/exercise/<int:exercise_id>/edit_name", methods=['GET', 'POST'])
def edit_exercise_name(exercise_id):

10
templates/calendar.html
View File

@@ -99,8 +99,8 @@
</div>
{% for workout in day.workouts %}
<div class="bottom flex-grow py-1 w-full"
hx-get="{{ url_for('get_workout_modal', person_id=person_id, workout_id=workout.workout_id) }}"
hx-target='body' hx-swap='beforeend'>
hx-get="{{ url_for('show_workout', person_id=person_id, workout_id=workout.workout_id) }}"
hx-push-url="true" hx-target="#container">
{% for set in workout.sets %}
<button
class="flex flex-col xl:flex-row items-start lg:items-center flex-shrink-0 px-0 sm:px-0.5 md:px-0.5 lg:px-0.5 text-xs">
@@ -145,8 +145,8 @@
{% for day in month.days %}
<div class="{% if day.is_today and day.is_in_current_month %}rounded-md border-4 border-green-50 border{% endif %} py-3 px-4 hover:bg-blue hover:text-white text-center cursor-pointer rounded-md {% if day.has_workouts and day.is_in_current_month %}bg-green-100{% endif %}"
{% if day.has_workouts %}
hx-get="{{ url_for('get_workout_modal', person_id=person_id, workout_id=day.first_workout_id) }}"
hx-target='body' hx-swap='beforeend' {% endif %}>
hx-get="{{ url_for('show_workout', person_id=person_id, workout_id=day.first_workout_id) }}"
hx-push-url="true" hx-target="#container" {% endif %}>
{% if day.is_in_current_month %}
{{ day.day }}
{% endif %}
@@ -175,7 +175,7 @@
{% block add_workout_button %}
<button
class="fixed z-90 bottom-10 right-8 bg-blue-600 w-20 h-20 rounded-full drop-shadow-lg flex justify-center items-center text-white text-4xl hover:bg-blue-700 hover:drop-shadow-2xl hover:animate-bounce duration-300"
hx-post="{{ url_for('create_workout', person_id=person_id) }}" hx-target='body' hx-swap='beforeend'>
hx-post="{{ url_for('create_workout', person_id=person_id) }}" hx-push-url="true" hx-target="#container">
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
<path fill="#FFFFFF" d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399

6
templates/partials/exercise/exercise_dropdown.html
View File

@@ -1,11 +1,11 @@
{% if exercises %}
<ul class="list-none m-0 p-0 max-h-[300px] overflow-y-auto">
<ul class="list-none m-0 p-0 max-h-[300px] overflow-y-auto border border-gray-200">
{% for exercise in exercises %}
{{ render_partial('partials/exercise/exercise_list_item.html', exercise=exercise) }}
{{ render_partial('partials/exercise/exercise_list_item.html', exercise=exercise, person_id=person_id) }}
{% endfor %}
</ul>
{% else %}
<div class="py-2 px-4 text-gray-500 flex items-center justify-between">
<div class="py-2 px-4 text-gray-500 flex items-center justify-between border border-gray-200">
<span>No results found</span>
<!-- Add Exercise Button -->
<button hx-post="{{ url_for('add_exercise') }}" hx-target="closest div" hx-swap="outerHTML"

6
templates/partials/exercise/exercise_list_item.html
View File

@@ -1,4 +1,8 @@
<li class="py-2 px-4 hover:bg-gray-100 cursor-pointer flex items-center justify-between">
<li class="py-2 px-4 hover:bg-gray-100 cursor-pointer flex items-center justify-between"
_="on click set the innerHTML of #exercise-results to ''
then set the value of #exercise-search to '{{ exercise.name }}'
then set the value of #selected-exercise to '{{ exercise.exercise_id }}'
on click call htmx.ajax('GET', '{{ url_for('get_exercise_progress_for_user', person_id=person_id, exercise_id=exercise.exercise_id) }}', {target:'#exercise-progress', swap:'innerHTML'})">
<!-- Exercise Name -->
<span>{{ exercise.name }}</span>
<!-- Edit Icon -->

15
templates/partials/exercise/exercise_select.html Normal file
View File

@@ -0,0 +1,15 @@
<div class="relative" _="on click from elsewhere set the innerHTML of #exercise-results to ''">
<input
class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
id="exercise-search" type="text" name="query" placeholder="Search exercises..."
hx-get="{{ url_for('get_exercises', person_id=person_id) }}" hx-target="#exercise-results"
hx-trigger="keyup changed delay:200ms" autocomplete="off">
<!-- Dropdown Menu -->
<div id="exercise-results" class="absolute w-full bg-white mt-1 rounded shadow-md z-10">
<!-- Results will be injected here -->
</div>
<input type="hidden" name="exercise_id" id="selected-exercise">
</div>

53
templates/partials/new_set_form.html
View File

@@ -1,40 +1,21 @@
<form class="w-full" id="new-set-workout-{{ workout_id }}"
hx-post="{{ url_for('create_topset', person_id=person_id, workout_id=workout_id) }}" hx-swap="beforeend"
hx-target="#new-workout" _="on htmx:afterOnLoad if #no-workouts add .hidden to #no-workouts end
on htmx:afterRequest
on topsetAdded
render #notification-template with (message: 'Topset added') then append it to #notifications-container
then call _hyperscript.processNode(#notifications-container)
then reset() me
then trigger clearNewSetInputs">
<div class="flex flex-wrap -mx-3 mb-2" id="new-set-workout-{{ workout_id }}">
<div class="w-full md:w-1/3 px-2 md:px-3 mb-6 md:mb-0">
<div class="w-full md:w-[30%] px-2 md:px-3 mb-6 md:mb-0">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-state">
Exercise
</label>
<div class="relative">
<div class="w-full">
<select name="exercise_id"
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"
hx-get="{{ url_for('get_most_recent_topset_for_exercise', person_id=person_id, workout_id=workout_id) }}"
hx-target="#new-set-workout-{{ workout_id }}" hx-swap="outerHTML" _="init js(me)
tail.select(me, {
search: true,
placeholder: 'Filter exercises',
})
end">
{% for e in exercises %}
<option value="{{ e.exercise_id }}" {% if e.exercise_id==exercise_id %}selected{% endif %}>{{
e.name
}}</option>
{% endfor %}
</select>
</div>
</div>
{{ render_partial('partials/exercise/exercise_select.html', person_id=person_id) }}
</div>
<div class="w-full md:w-1/3 px-2 md:px-3 mb-6 md:mb-0">
<div class="w-full md:w-[30%] px-2 md:px-3 mb-6 md:mb-0">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
Reps
</label>
@@ -44,7 +25,7 @@
_="on clearNewSetInputs set my.placeholder to ''" {% endif %}>
</div>
<div class="w-full md:w-1/3 px-2 md:px-3 mb-6 md:mb-0">
<div class="w-full md:w-[30%] px-2 md:px-3 mb-6 md:mb-0">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-zip">
Weight
</label>
@@ -53,20 +34,20 @@
id="grid-zip" type="number" name="weight" step="any" {% if has_value==True %} placeholder="{{ weight }}"
_="on clearNewSetInputs set my.placeholder to ''" {% endif %}>
</div>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 pt-2 px-0 sm:px-2">
<button
class="py-2 px-2 md:px-3 mb-3 text-sm font-medium text-center text-gray-900 bg-cyan-600 hover:bg-cyan-700 rounded-lg border border-gray-300 hover:scale-[1.02] transition-transform"
type="submit">
Add top set
</button>
<button hx-confirm="Are you sure you wish to delete this workout?"
hx-delete="{{ url_for('delete_workout', person_id=person_id, workout_id=workout_id) }}"
_='on click trigger closeModal'
class="py-2 px-2 md:px-3 mb-3 text-sm font-medium text-center text-gray-900 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:scale-[1.02] transition-transform">Delete
workout</button>
<div class="w-full md:w-[10%] px-2 md:px-3 mb-6 md:mb-0">
<button
class="flex items-center justify-center py-2 px-2 md:px-3 mb-3 text-sm font-medium text-center text-gray-900 bg-cyan-600 hover:bg-cyan-700 rounded-lg border border-gray-300 hover:scale-[1.02] transition-transform mb-6 md:mb-0 mt-0 md:mt-6 w-full"
type="submit">
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" class="w-7 h-7">
<path d="M12 4a1 1 0 011 1v6h6a1 1 0 110 2h-6v6a1 1 0 11-2 0v-6H5a1 1 0 110-2h6V5a1 1 0 011-1z" />
</svg>
</button>
</div>
</div>
</form>
{% if has_value==True %}

4
templates/person.html
View File

@@ -131,8 +131,8 @@
<tbody class="bg-white">
{% for w in person['Workouts'] %}
<tr hx-get="{{ url_for('get_workout_modal', person_id=person['PersonId'], workout_id=w['WorkoutId']) }}"
hx-target='body' hx-swap='beforeend' class="cursor-pointer">
<tr hx-get="{{ url_for('show_workout', person_id=person['PersonId'], workout_id=w['WorkoutId']) }}"
hx-push-url="true" hx-target="#container" class="cursor-pointer">
<td class="p-4 whitespace-nowrap text-sm font-normal text-gray-500">
{{ w['StartDate'] | strftime("%b %d %Y") }}
</td>

44
templates/workout.html
View File

@@ -2,7 +2,7 @@
{% block content %}
<div class=' p-2 md:p-4 m-2'>
<div class='p-0 md:p-4 m-0 md:m-2'>
<div class="relative w-full h-full">
<!-- Modal content -->
<div class="relative bg-white rounded-lg shadow">
@@ -36,8 +36,9 @@
</div>
<button type="button"
class="absolute right-0 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white"
data-modal-toggle="defaultModal" _="on click trigger closeModal">
class="absolute right-0 text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white mr-2"
hx-get="{{ url_for('delete_workout', person_id=person_id, workout_id=workout_id) }}"
hx-push-url="true" hx-target="#container">
<svg aria-hidden="true" class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" data-darkreader-inline-fill=""
style="--darkreader-inline-fill:currentColor;">
@@ -50,6 +51,17 @@
</div>
</div>
<div class="relative bg-white rounded-lg shadow mt-4">
<div class="p-2 md:p-4 border-0 md:border-b rounded-t">
<!-- Modal footer -->
<div class="flex items-center p-1 md:p-2 rounded-b dark:border-gray-600">
{{ render_partial('partials/new_set_form.html', person_id=person_id,
workout_id=workout_id,
exercises=exercises,
has_value=False) }}
</div>
<!-- Modal body -->
<div class="p-3 md:p-6 space-y-6">
<table class="items-center w-full bg-transparent border-collapse table-fixed">
@@ -82,37 +94,13 @@
</div>
{% endif %}
</div>
<!-- Modal footer -->
<div class="flex items-center p-3 md:p-6 space-x-2 border-t border-gray-200 rounded-b dark:border-gray-600">
{{ render_partial('partials/new_set_form.html', person_id=person_id,
workout_id=workout_id,
exercises=exercises,
has_value=False) }}
</div>
<div id="exercise-progress-{{ person_id }}" class="mx-0 md:mx-5">
<div class="w-full md:w-1/3 px-2 md:px-3 mb-6 md:mb-0">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
Exercise
</label>
<div class="relative" _="on click from elsewhere set the innerHTML of #exercise-results to ''">
<input
class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
type="text" name="query" placeholder="Search exercises..."
hx-get="{{ url_for('get_exercises') }}" hx-target="#exercise-results"
hx-trigger="keyup changed delay:500ms" autocomplete="off">
<!-- Dropdown Menu -->
<div id="exercise-results"
class="absolute w-full bg-white border border-gray-200 mt-1 rounded shadow-md z-10">
<!-- Results will be injected here -->
<div id="exercise-progress" class="mx-0 md:mx-5">
</div>
</div>
</div>
</div>
</div>
{% endblock %}