added indicator while you wait

Gig-o-Matic · Jul 24, 2024 · c8b727e · c8b727e
1 parent 6b6353c
commit c8b727e
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/templates/agenda/agenda.html b/templates/agenda/agenda.html
@@ -35,19 +35,22 @@
                     <label class="btn btn-sm btn-outline-secondary filter shadow-none active">
                         <input type="radio" name="options" id="option1" {% if button.3 %}checked{% endif %}
                         hx-get="{% url 'agenda-gigs' the_type=button.0 the_band=button.2 %}"
-                        hx-target="#the-list">{{button.1}}
+                        hx-target="#the-list" hx-indicator="#indicator">{{button.1}}
                         {% if button.4 %}
                         <span class="badge badge-secondary" id="needplan-badge">&nbsp;&nbsp;</span>
                         {% endif %}
                     </label>
                     {% if button.3 %}<span hx-get="{% url 'agenda-gigs' the_type=button.0 the_band=button.2 %}"
-                    hx-target="#the-list" hx-trigger="load"></span>{% endif %}
+                    hx-target="#the-list" hx-trigger="load"  hx-indicator="#indicator"></span>{% endif %}
                 {% endfor %}
             </div>
         </div>
     </div>
     <div class="row mt-2"></div>
     <div class="row" id="the-list">
+        <div class="col-md-10 col-12 mx-auto justify-content-start">
+            <i class="fas fa-spinner fa-pulse fa-lg htmx-indicator" id="indicator"></i>
+        </div>
     </div>
 {% endif %}
 

diff --git a/templates/agenda/agenda_gigs.html b/templates/agenda/agenda_gigs.html
@@ -8,6 +8,7 @@
             <div class="row titlerow">
                 <div class="col-12">
                     {{ title }}
+                    <i class="fas fa-spinner fa-pulse fa-lg htmx-indicator" id="indicator"></i>
                 </div>
             </div>
         </div>