From 8728af4332db7fd7a91a4108781dc9c4f7ac5ffe Mon Sep 17 00:00:00 2001
From: Ibnu Maksum <ibnumaksum@gmail.com>
Date: Thu, 22 Feb 2024 11:41:55 +0700
Subject: [PATCH] Add Loading when click submit

---
 ui/ui/sections/footer.tpl      | 28 +++++++++++++++++++++++++---
 ui/ui/sections/user-footer.tpl | 27 +++++++++++++++++++++++++++
 2 files changed, 52 insertions(+), 3 deletions(-)

diff --git a/ui/ui/sections/footer.tpl b/ui/ui/sections/footer.tpl
index 7e062956..b8de8542 100644
--- a/ui/ui/sections/footer.tpl
+++ b/ui/ui/sections/footer.tpl
@@ -21,10 +21,32 @@
             <script>
                 $(document).ready(function() {
                     $('.select2').select2({theme: "bootstrap"});
-                });
-
-                $(document).ready(function() {
                     $('.select2tag').select2({theme: "bootstrap", tags: true});
+                    var listAtts = document.querySelectorAll(`button[type="submit"]`);
+                    listAtts.forEach(function(el) {
+                        if (el.addEventListener) { // all browsers except IE before version 9
+                            el.addEventListener("click", function() {
+                                $(this).html(
+                                    `<span class="glyphicon glyphicon-refresh" role="status" aria-hidden="true"></span>`
+                                );
+                                setTimeout(() => {
+                                    $(this).prop("disabled", true);
+                                }, 100);
+                            }, false);
+                        } else {
+                            if (el.attachEvent) { // IE before version 9
+                                el.attachEvent("click", function() {
+                                    $(this).html(
+                                        `<span class="glyphicon glyphicon-refresh" role="status" aria-hidden="true"></span>`
+                                    );
+                                    setTimeout(() => {
+                                        $(this).prop("disabled", true);
+                                    }, 100);
+                                });
+                            }
+                        }
+
+                    });
                 });
 
                 var listAtts = document.querySelectorAll(`[api-get-text]`);
diff --git a/ui/ui/sections/user-footer.tpl b/ui/ui/sections/user-footer.tpl
index f4804336..2bf59e61 100644
--- a/ui/ui/sections/user-footer.tpl
+++ b/ui/ui/sections/user-footer.tpl
@@ -79,6 +79,33 @@
                         el.innerHTML = data;
                     });
                 });
+                $(document).ready(function() {
+                    var listAtts = document.querySelectorAll(`button[type="submit"]`);
+                    listAtts.forEach(function(el) {
+                        if (el.addEventListener) { // all browsers except IE before version 9
+                            el.addEventListener("click", function() {
+                                $(this).html(
+                                    `<span class="glyphicon glyphicon-refresh" role="status" aria-hidden="true"></span>`
+                                );
+                                setTimeout(() => {
+                                    $(this).prop("disabled", true);
+                                }, 100);
+                            }, false);
+                        } else {
+                            if (el.attachEvent) { // IE before version 9
+                                el.attachEvent("click", function() {
+                                    $(this).html(
+                                        `<span class="glyphicon glyphicon-refresh" role="status" aria-hidden="true"></span>`
+                                    );
+                                    setTimeout(() => {
+                                        $(this).prop("disabled", true);
+                                    }, 100);
+                                });
+                            }
+                        }
+
+                    });
+                });
             </script>
         {/literal}