From 4b87b0a19696e95fdf115be09dfbd7f4c1bedc43 Mon Sep 17 00:00:00 2001
From: Tom Price <tom@codedinternet.com>
Date: Wed, 17 May 2017 18:59:06 +0100
Subject: [PATCH] Add some visual indicators that authorisations have been
 submitted.

This will show teccies and clients that RIGS is processing emails which can take a short while.
Should prevent duplicate sending.
---
 RIGS/static/js/interaction.js                    |  2 +-
 RIGS/templates/RIGS/eventauthorisation_form.html |  9 ++++++++-
 .../RIGS/eventauthorisation_request.html         | 15 +++++++++++++--
 templates/base_ajax.html                         |  2 +-
 templates/base_client.html                       | 16 ++++++++++++++++
 5 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/RIGS/static/js/interaction.js b/RIGS/static/js/interaction.js
index e7d023e1..56f04dec 100644
--- a/RIGS/static/js/interaction.js
+++ b/RIGS/static/js/interaction.js
@@ -136,4 +136,4 @@ $("#item-table tbody").sortable({
         });
 
     }
-});
\ No newline at end of file
+});
diff --git a/RIGS/templates/RIGS/eventauthorisation_form.html b/RIGS/templates/RIGS/eventauthorisation_form.html
index 0809b29a..9182df41 100644
--- a/RIGS/templates/RIGS/eventauthorisation_form.html
+++ b/RIGS/templates/RIGS/eventauthorisation_form.html
@@ -7,7 +7,14 @@
     <script>
         $(function () {
             $('[data-toggle="tooltip"]').tooltip();
-        })
+        });
+
+        $('form').on('submit', function() {
+           $('#loading-modal').modal({
+               backdrop: 'static',
+               show: true
+           });
+        });
     </script>
 {% endblock %}
 
diff --git a/RIGS/templates/RIGS/eventauthorisation_request.html b/RIGS/templates/RIGS/eventauthorisation_request.html
index 9c31f1fe..6067b3fe 100644
--- a/RIGS/templates/RIGS/eventauthorisation_request.html
+++ b/RIGS/templates/RIGS/eventauthorisation_request.html
@@ -22,7 +22,9 @@
             </div>
         </div>
         <div class="col-sm-12 col-md-10 col-md-offset-1">
-            <form action="{{ form.action|default:request.path }}" method="post" class="form-horizontal">{% csrf_token %}
+            <form action="{{ form.action|default:request.path }}" method="post" class="form-horizontal"
+                  id="auth-request-form">
+                {% csrf_token %}
 
                 <div class="row">
                     {% include 'form_errors.html' %}
@@ -38,11 +40,20 @@
 
                     <div class="text-right col-sm-3 col-sm-offset-9">
                         <div class="form-group">
-                            <input type="submit" class="form-control btn btn-primary"/>
+                            <button type="submit" class="form-control btn btn-primary">
+                                <span class="glyphicon glyphicon-send"></span>
+                                Send
+                            </button>
                         </div>
                     </div>
                 </div>
             </form>
         </div>
     </div>
+
+    <script>
+        $('#auth-request-form').on('submit', function () {
+            $('#auth-request-form button').attr('disabled', true);
+        });
+    </script>
 {% endblock %}
diff --git a/templates/base_ajax.html b/templates/base_ajax.html
index 298ca314..79b934d3 100644
--- a/templates/base_ajax.html
+++ b/templates/base_ajax.html
@@ -22,4 +22,4 @@
             });
         </script>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/templates/base_client.html b/templates/base_client.html
index b8cd614b..824e9f88 100644
--- a/templates/base_client.html
+++ b/templates/base_client.html
@@ -71,6 +71,22 @@
 
 <div class="modal fade" id="modal" role="dialog" tabindex=-1></div>
 
+<div class="modal fade" id="loading-modal" role="dialog">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h2>Please wait</h2>
+            </div>
+            <div class="modal-body">
+                <div class="loading-animation">
+                    <div class="circle"></div>
+                    <div class="circle1"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
 <script>
     Date.prototype.getISOString = function () {
         var yyyy = this.getFullYear().toString();