Add container for all progress items

inst/www/shared/shiny.css

@@ -96,7 +96,7 @@ span.jslider {
   transition: none;
 }
 
-.shiny-progress {
+.shiny-progress-container {
   position: fixed;
   top: 0px;
   width: 100%;

inst/www/shared/shiny.js

@@ -936,11 +936,18 @@
       },
       // Open a page-level progress bar
       open: function(message) {
+        // Add progress container (for all progress items) if not already present
+        var $container = $('.shiny-progress-container');
+        if ($container.length == 0) {
+          $container = $('<div class="shiny-progress-container"></div>');
+          $('body').append($container);
+        }
+
+        // Add div for just this progress ID
         var depth = $('.shiny-progress.open').length;
         var $progress = $(progressHandlers.progressHTML);
         $progress.attr('id', message.id);
-
-        $('body').append($progress);
+        $container.append($progress);
 
         // Stack bars
         var $progressBar = $progress.find('.progress');
@@ -948,10 +955,12 @@
 
         // Stack text objects
         var $progressText = $progress.find('.progress-text');
-        $progressText.css('top', progressHandlers.yOffsetText +
+        $progressText.css('top', 3 * $progressBar.height() +
           depth * $progressText.outerHeight() + 'px');
+
         $progress.hide();
       },
+
       // Update page-level progress bar
       update: function(message) {
         var $progress = $('#' + message.id + '.shiny-progress');
@@ -970,25 +979,33 @@
             $progress.find('.progress').hide();
           }
         }
+
         $progress.fadeIn();
       },
+
       // Close page-level progress bar
       close: function(message) {
         var $progress = $('#' + message.id + '.shiny-progress');
         $progress.removeClass('open');
+
         $progress.fadeOut({
-          complete: function() {$progress.remove();}
+          complete: function() {
+            $progress.remove();
+
+            // If this was the last shiny-progress, remove container
+            if ($('.shiny-progress').length == 0)
+              $('.shiny-progress-container').remove();
+          }
         });
       },
+
       progressHTML: '<div class="shiny-progress open">' +
         '<div class="progress progress-striped active"><div class="bar"></div></div>' +
         '<div class="progress-text">' +
           '<span class="progress-message">foo</span>' +
           '<span class="progress-detail"></span>' +
         '</div>' +
-      '</div>',
-      // Distance from top (in pixels) to start the text objects
-      yOffsetText: 5
+      '</div>'
     };
 
     exports.progressHandlers = progressHandlers;