6 files changed, 53 insertions, 29 deletions
diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index 840d588f3..8794fc722 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -59,7 +59,7 @@ var shortcut_menu_hide_url = '/hide-shortcut-menu/'
 var shortcut_menu_show_url = '/show-shortcut-menu/'
 
 function init_shortcut_menu(html){
-    $("#progress").hide();
+    $('.modal-progress').modal('hide');
     $("#context-menu").html(html);
     $(".chosen-select").chosen();
     if (advanced_menu) {
@@ -186,7 +186,7 @@ function display_info(msg){
 
 function load_shortcut_menu(){
     if (!shortcut_url) return;
-    $("#progress").show();
+    $('.modal-progress').modal('show');
     $.ajax({
         url: shortcut_url,
         cache: false,
@@ -194,7 +194,7 @@ function load_shortcut_menu(){
             init_shortcut_menu(html);
         },
         error:function(XMLHttpRequest, textStatus, errorThrows){
-            $("#progress").hide();
+            $('.modal-progress').modal('hide');
         }
     });
 }
@@ -248,12 +248,11 @@ $(document).on("click", '.help_display', function(){
 });
 
 $(document).on("click", '#progress-content', function(){
-    $('#progress').hide();
+    $('.modal-progress').hide();
 });
 
 function long_wait(){
-    $('#progress').addClass('long');
-    $('#progress').show();
+    $('.modal-progress').modal('show');
     $('.progress-1').show('slow');
     setTimeout(function(){
         $('.progress-1').hide('slow');
@@ -276,12 +275,12 @@ function long_wait(){
 var last_window;
 
 function load_window(url, speed, on_success, no_jump){
-    $("#progress").show();
+    $('.modal-progress').modal('show');
     $.ajax({
         url: url,
         cache: false,
         success:function(html){
-            $("#progress").hide();
+            $('.modal-progress').modal('hide');
             $(".previous_page").remove();
             $(".next_page").remove();
             var register_id = $(html).find(".card-header").attr("data-sheet-id");
@@ -302,7 +301,7 @@ function load_window(url, speed, on_success, no_jump){
             if (on_success) on_success();
         },
         error:function(XMLHttpRequest, textStatus, errorThrows){
-            $("#progress").hide();
+            $('.modal-progress').modal('hide');
         }
     });
 }
@@ -322,15 +321,15 @@ function load_current_window(url, model_name){
 }
 
 function load_url(url){
-    $("#progress").show();
+    $('.modal-progress').modal('show');
     $.ajax({
         url: url,
         cache: false,
         success:function(html){
-            $("#progress").hide();
+            $('.modal-progress').modal('hide');
         },
         error:function(XMLHttpRequest, textStatus, errorThrows){
-            $("#progress").hide();
+            $('.modal-progress').modal('hide');
         }
     });
 }
diff --git a/ishtar_common/static/media/styles.css b/ishtar_common/static/media/styles.css
index 4872abd1c..3db227c99 100644
--- a/ishtar_common/static/media/styles.css
+++ b/ishtar_common/static/media/styles.css
@@ -161,6 +161,14 @@ table.dataTable thead th, table.dataTable thead td {
     font-size: 1.4em;
 }
 
+.progress-detail{
+    display: none;
+}
+
+.progress-detail.progress-1{
+    display: block;
+}
+
 /* à adapter */
 #message,
 #message div{
diff --git a/ishtar_common/templates/base.html b/ishtar_common/templates/base.html
index 7091fffaf..db39ecc8e 100644
--- a/ishtar_common/templates/base.html
+++ b/ishtar_common/templates/base.html
@@ -86,13 +86,30 @@
         {% include 'ishtar/blocks/footer.html' %}
     </div>
     {% endblock %}
-    <div id="progress">
-        <div id='progress-content'>
-            <p class='progress-detail progress-1'>{% trans "Processing..." %}</p>
-            <p class='progress-detail progress-2'>{% trans "This can be long." %}</p>
-            <p class='progress-detail progress-3'>{% trans "Time to take a coffee?" %} <i class="fa fa-coffee" aria-hidden="true"></i></p>
-            <p class='progress-detail progress-4'>{% trans "Time to take another coffee?" %} <i class="fa fa-coffee" aria-hidden="true"></i></p>
+    <div class="modal modal-progress" tabindex="-1" role="dialog"
+         data-backdrop="static" data-keyboard="false" aria-hidden="true">
+      <div class="modal-dialog modal-sm modal-dialog-centered">
+        <div class="modal-content" id='progress-content'>
+            <div class="modal-header">
+                <span class='progress-detail progress-1'>
+                    {% trans "Processing..." %}</span>
+                <span class='progress-detail progress-2'>
+                    {% trans "This can be long." %}</span>
+                <span class='progress-detail progress-3'>
+                    {% trans "Time to take a coffee?" %} <i class="fa fa-coffee" aria-hidden="true"></i></span>
+                <span class='progress-detail progress-4'>
+                    {% trans "Time to take another coffee?" %} <i class="fa fa-coffee" aria-hidden="true"></i></span>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                  <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <div class="progress">
+                  <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 100%"></div>
+                </div>
+            </div>
         </div>
+      </div>
     </div>
     <div id='message'>
         <div class='information'><i class="fa fa-info-circle" aria-hidden="true"></i> <span class='content'></span></div>
diff --git a/ishtar_common/templates/blocks/DataTables.html b/ishtar_common/templates/blocks/DataTables.html
index d3e7312ac..37dd090d2 100644
--- a/ishtar_common/templates/blocks/DataTables.html
+++ b/ishtar_common/templates/blocks/DataTables.html
@@ -48,7 +48,7 @@
     <div class='col-md-2'>
         <div class="btn-group btn-group-sm" role="group">
             <button type='button' class="btn btn-secondary" data-toggle="modal"
-                    data-target=".table-modal-lg">
+                    data-target="#modal_grid_{{name}}">
                 {% trans "Expand table" %} <i class="fa fa-expand" aria-hidden="true"></i>
             </button>
         </div>
@@ -98,8 +98,8 @@ var query_vars = new Array({{col_idx|safe}});
 var selItems_{{sname}} = new Array();
 jQuery(document).ready(function(){
   jQuery("#search_{{name}}").click(function (){
-    if ($("#progress").length > 0){
-        $("#progress").show();
+    if ($('.modal-progress').length > 0){
+        $('.modal-progress').modal('show');
     }
     var data = "";
     for (idx in query_vars){
@@ -129,8 +129,8 @@ jQuery(document).ready(function(){
     $(".{{slug}}-csv-full").attr("href", '{{extra_source}}csv?submited=1&' + data);
     {% endfor %}
 
-    if ($("#progress").length > 0){
-        $("#progress").hide();
+    if ($('.modal-progress').length > 0){
+        $('.modal-progress').modal('hide');
     }
     return false;
   });
diff --git a/ishtar_common/templates/blocks/JQueryJqGrid.html b/ishtar_common/templates/blocks/JQueryJqGrid.html
index 9160ef9b5..74ccd7780 100644
--- a/ishtar_common/templates/blocks/JQueryJqGrid.html
+++ b/ishtar_common/templates/blocks/JQueryJqGrid.html
@@ -51,8 +51,8 @@ var query_vars = new Array({{col_idx|safe}});
 var selItems_{{sname}} = new Array();
 jQuery(document).ready(function(){
   jQuery("#search_{{name}}").click(function (){
-    if ($("#progress").length > 0){
-        $("#progress").show();
+    if ($('.modal-progress').length > 0){
+        $('.modal-progress').modal('show');
     }
     var data = "";
     for (idx in query_vars)
@@ -84,8 +84,8 @@ jQuery(document).ready(function(){
 
     mygrid.setGridParam({url:url, page:1});
     mygrid.trigger("reloadGrid");
-    if ($("#progress").length > 0){
-        $("#progress").hide();
+    if ($('.modal-progress').length > 0){
+        $('.modal-progress').modal('hide');
     }
     return false;
   });
diff --git a/ishtar_common/templates/ishtar/dashboards/dashboard_main.html b/ishtar_common/templates/ishtar/dashboards/dashboard_main.html
index ed61d1265..827fcf02d 100644
--- a/ishtar_common/templates/ishtar/dashboards/dashboard_main.html
+++ b/ishtar_common/templates/ishtar/dashboards/dashboard_main.html
@@ -17,10 +17,10 @@
 $(function() {
  $( "#dash-tabs" ).tabs({
    beforeActivate: function( event, ui ) {
-    $("#progress").show();
+    $('.modal-progress').modal('show');
    },
    load: function( event, ui ) {
-    $("#progress").hide();
+    $('.modal-progress').modal('hide');
    }
  });
 });