From ae460815d7b19761ad23bfafb25906b455537173 Mon Sep 17 00:00:00 2001 From: Peter Stockings Date: Mon, 14 Aug 2023 22:57:47 +1000 Subject: [PATCH] Add left to right slide in transition on main content rerender (#container) --- templates/base.html | 44 ++++++++++++++++++++++- templates/calendar.html | 14 ++++---- templates/dashboard.html | 17 +++++---- templates/partials/people_link.html | 1 + templates/partials/tags.html | 6 ++-- templates/partials/topset.html | 2 +- templates/partials/workout_tags_list.html | 3 +- templates/person.html | 10 +++--- 8 files changed, 74 insertions(+), 23 deletions(-) diff --git a/templates/base.html b/templates/base.html index 13bc9b8..5fe4473 100644 --- a/templates/base.html +++ b/templates/base.html @@ -51,6 +51,46 @@ let config = { responsive: true, displayModeBar: false }; let hovertemplate = 'Estimated 1RM: %{y}kg
Topset:%{text}
Date: %{x}'; + + @@ -103,6 +143,7 @@
-
+
{% block content %} {% endblock %}
diff --git a/templates/calendar.html b/templates/calendar.html index bfc18ed..cdfcd7e 100644 --- a/templates/calendar.html +++ b/templates/calendar.html @@ -4,14 +4,15 @@ + hx-swap="innerHTML transition:true" id="refreshViewElement">
@@ -107,7 +110,7 @@
View workouts
diff --git a/templates/partials/people_link.html b/templates/partials/people_link.html index 8524c8c..dbe0b80 100644 --- a/templates/partials/people_link.html +++ b/templates/partials/people_link.html @@ -1,6 +1,7 @@ {% for p in people %}
  • {{ + hx-vals='{"filter": "{{ t["TagFilter"] }}"}' {% endif%} hx-target="#container" + hx-swap="innerHTML transition:true" hx-push-url="true">{{ t['TagName'] }} @@ -14,7 +15,8 @@ class="float-right w-4 cursor-pointer pl-[8px] text-[16px] text-[#afafaf] opacity-[.53] transition-all duration-200 ease-in-out hover:text-[#8b8b8b] dark:text-neutral-400 dark:hover:text-neutral-100" hx-get="{{ url_for('delete_tag', tag_id=t['TagId']) }}" {% if person_id %} hx-vals='{"filter": "{{ t["TagFilter"] }}", "person_id": "{{ person_id }}"}' {% else %} - hx-vals='{"filter": "{{ t["TagFilter"] }}"}' {% endif%} hx-target="#container" hx-push-url="true" _="on htmx:confirm(issueRequest) + hx-vals='{"filter": "{{ t["TagFilter"] }}"}' {% endif%} hx-target="#container" + hx-swap="innerHTML transition:true" hx-push-url="true" _="on htmx:confirm(issueRequest) halt the event call Swal.fire({title: 'Confirm', text:'Are you sure you want to delete {{ t['TagName'] }} tag?'}) if result.isConfirmed issueRequest()"> diff --git a/templates/partials/topset.html b/templates/partials/topset.html index d7109c8..1b45648 100644 --- a/templates/partials/topset.html +++ b/templates/partials/topset.html @@ -3,7 +3,7 @@ {% if is_edit|default(false, true) == false %} {{ exercise_name }} {% else %} diff --git a/templates/partials/workout_tags_list.html b/templates/partials/workout_tags_list.html index d760fea..4e99f82 100644 --- a/templates/partials/workout_tags_list.html +++ b/templates/partials/workout_tags_list.html @@ -2,7 +2,8 @@ {{ + hx-target="#container" hx-swap="innerHTML transition:true" hx-push-url="true" + _='on click trigger closeModalWithoutRefresh'>{{ tag.tag_name }} {% endfor%} \ No newline at end of file diff --git a/templates/person.html b/templates/person.html index d2bfe2f..64bc1df 100644 --- a/templates/person.html +++ b/templates/person.html @@ -2,7 +2,7 @@ {% block content %} - @@ -47,7 +47,7 @@ data-te-select-size="lg" name="exercise_id" class="bg-gray-50 border border-gray-300 " multiple hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}" hx-include="[name='exercise_id'],[name='min_date'],[name='max_date'],[name='graph_axis']" - hx-target="#container" hx-push-url="true"> + hx-target="#container" hx-push-url="true" hx-swap="innerHTML transition:true"> {% for e in person['Exercises'] %}
    • @@ -98,7 +98,7 @@ name="max_date" value="{{ max_date }}" hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}" hx-include="[name='exercise_id'],[name='min_date'],[name='max_date'],[name='graph_axis']" - hx-target="#container" hx-push-url="true" hx-trigger="change"> + hx-target="#container" hx-swap="innerHTML transition:true" hx-push-url="true" hx-trigger="change">
    @@ -110,7 +110,7 @@ data-te-select-size="lg" name="graph_axis" class="bg-gray-50 border border-gray-300 " multiple hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}" hx-include="[name='exercise_id'],[name='min_date'],[name='max_date'],[name='graph_axis']" - hx-target="#container" hx-push-url="true"> + hx-target="#container" hx-swap="innerHTML transition:true" hx-push-url="true">