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

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 %}