From a64b44932763e15a74748b2e7752cab2f7712f4f Mon Sep 17 00:00:00 2001
From: Damien De Paoli <ddp@depaoli.id.au>
Date: Wed, 4 Jan 2023 23:36:20 +1100
Subject: [PATCH] created toast.js with a StatusMsg() func that dynamically
 adds toasts that can stack as we need more, and changed over code to use it

---
 internal/js/files_support.js |  2 +-
 templates/base.html          | 11 +++++------
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/internal/js/files_support.js b/internal/js/files_support.js
index 3d663d3..b4c1a31 100644
--- a/internal/js/files_support.js
+++ b/internal/js/files_support.js
@@ -64,7 +64,7 @@ function MoveSubmit()
     // reorder the images via ecnt again, so highlighting can work
     document.mf_id=0; $('.figure').each( function() { $(this).attr('ecnt', document.mf_id ); document.mf_id++ } )
     $('#dbox').modal('hide')
-    $.ajax({ type: 'POST', data: $('#mv_fm').serialize(), url: '/move_files', success: function(data){ $('.toast-body').html( "Created&nbsp;<a class='link-light' href=/job/" + data.job_id + ">Job #" + data.job_id + "</a>&nbsp;to move selected file(s)" ); $('.toast').toast("show"); return false; } })
+    $.ajax({ type: 'POST', data: $('#mv_fm').serialize(), url: '/move_files', success: function(data){ st=Object; st.message="Created&nbsp;<a class='link-light' href=/job/" + data.job_id + ">Job #" + data.job_id + "</a>&nbsp;to move selected file(s)"; st.alert="success"; StatusMsg(st); return false; } })
 }
 
 // show the DBox for a move file, includes all thumbnails of selected files to move
diff --git a/templates/base.html b/templates/base.html
index 4558006..b3c4e0f 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -17,6 +17,7 @@
         <script src="{{ url_for( 'internal', filename='upstream/bootstrap-5.0.2-dist/js/bootstrap.bundle.min.js')}}"></script>
         <script src="{{ url_for( 'internal', filename='upstream/jquery.contextMenu.min.js')}}"></script>
         <script src="{{ url_for( 'internal', filename='upstream/jquery.ui.position.min.js')}}"></script>
+        <script src="{{ url_for( 'internal', filename='js/toast.js')}}"></script>
 
 		<link rel="shortcut icon" href="{{ url_for('internal', filename='favicon.ico') }}">
 
@@ -162,14 +163,13 @@
 
 {% if not InDBox %}
 	{%block script_content %}{% endblock script_content %}
-    <div class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
-        <div id="status_toast" class="toast align-items-center text-white bg-success border-0" role="alert" aria-live="assertive" aria-atomic="true">
+    <div id="status_container" class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
+        <div id="st1" class="toast hide align-items-center text-white bg-success border-0" role="alert" aria-live="assertive" aria-atomic="true">
             <div class="d-flex">
                 <div class="toast-body">
-                  Hello, world! This is a toast message.
                 </div>
                 <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
-                </div>
+            </div>
         </div>
     </div>
 	{% if GetMessage()|length %}
@@ -177,8 +177,7 @@
             $(document).ready(function() {
                 msg = "{{ GetMessage()|safe }}"
                 msg=msg.replace('href=', 'class=link-light href=')
-                $('.toast-body').html( msg )
-                $('.toast').toast("show");
+                st=Object; st.message=msg; st.alert="success"; StatusMsg(st)
             } )
         </script>
 		{{ ClearStatus() }}