[ARVADOS] created: 289a84cacdb0d3c9ab1d9876610af5ca6c224a88

git at public.curoverse.com git at public.curoverse.com
Fri Jun 27 10:20:27 EDT 2014


        at  289a84cacdb0d3c9ab1d9876610af5ca6c224a88 (commit)


commit 289a84cacdb0d3c9ab1d9876610af5ca6c224a88
Author: Tom Clegg <tom at curoverse.com>
Date:   Fri Jun 27 10:17:09 2014 -0400

    3099: Fix up loading spinners.
    
    * Work around Rails asset pipeline bug by avoiding "-" in image filenames.
    * Always use asset helpers: src="/assets/foo.gif" only works in dev mode.
    * Center loading spinners.
    * Use a "spinner" class to identify spinners in "remove spinner" code.

diff --git a/apps/workbench/app/assets/images/ajax-loader.gif b/apps/workbench/app/assets/images/spinner_32px.gif
similarity index 100%
rename from apps/workbench/app/assets/images/ajax-loader.gif
rename to apps/workbench/app/assets/images/spinner_32px.gif
diff --git a/apps/workbench/app/assets/javascripts/infinite_scroll.js b/apps/workbench/app/assets/javascripts/infinite_scroll.js
index 00db2ba..44584d9 100644
--- a/apps/workbench/app/assets/javascripts/infinite_scroll.js
+++ b/apps/workbench/app/assets/javascripts/infinite_scroll.js
@@ -14,7 +14,7 @@ function maybe_load_more_content() {
             return;
         // Don't start another request until this one finishes
         $(container).attr('data-infinite-content-href', null);
-        $(container).append('<img src="/assets/ajax-loader.gif" class="infinite-scroller-spinner"></img>');
+        $(container).append('<div class="spinner spinner-32px spinner-h-center infinite-scroller-spinner"></div>');
         $.ajax(src,
                {dataType: 'json',
                 type: 'GET',
@@ -33,7 +33,7 @@ function maybe_load_more_content() {
                 $(this.container).attr('data-infinite-content-href', this.src);
             }).
             done(function(data, status, jqxhr) {
-                $(this.container).find(".infinite-scroller-spinner").detach();
+                $(this.container).find(".spinner").detach();
                 $(this.container).append(data.content);
                 $(this.container).attr('data-infinite-content-href', data.next_page_href);
             });
diff --git a/apps/workbench/app/assets/javascripts/select_modal.js b/apps/workbench/app/assets/javascripts/select_modal.js
index 9107a01..0a58213 100644
--- a/apps/workbench/app/assets/javascripts/select_modal.js
+++ b/apps/workbench/app/assets/javascripts/select_modal.js
@@ -16,7 +16,7 @@ $(document).on('click', '.selectable', function() {
         prop('disabled', !any);
 
     if ($this.hasClass('active')) {
-        $(".modal-dialog-preview-pane").html('<img src="/assets/ajax-loader.gif"></img>');
+        $(".modal-dialog-preview-pane").html('<div class="spinner spinner-32px spinner-h-center spinner-v-center"></div>');
         $.ajax($this.attr('data-preview-href'),
                {dataType: "html"}).
            done(function(data, status, jqxhr) {
diff --git a/apps/workbench/app/assets/stylesheets/loading.css b/apps/workbench/app/assets/stylesheets/loading.css.scss.erb
similarity index 78%
rename from apps/workbench/app/assets/stylesheets/loading.css
rename to apps/workbench/app/assets/stylesheets/loading.css.scss.erb
index 640f702..9f74866 100644
--- a/apps/workbench/app/assets/stylesheets/loading.css
+++ b/apps/workbench/app/assets/stylesheets/loading.css.scss.erb
@@ -2,6 +2,27 @@
     opacity: 0;
 }
 
+.spinner {
+    /* placeholder for stuff like $.find('.spinner').detach() */
+}
+
+.spinner-32px {
+    background-image: url('<%= asset_path('spinner_32px.gif') %>');
+    background-repeat: no-repeat;
+    width: 32px;
+    height: 32px;
+}
+
+.spinner-h-center {
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.spinner-v-center {
+    position: relative;
+    top: 45%;
+}
+
 .rotating {
     color: #f00;
     /* Chrome and Firefox, at least in Linux, render a horrible shaky
diff --git a/apps/workbench/app/views/application/_choose.js.erb b/apps/workbench/app/views/application/_choose.js.erb
index 6521b0c..b033c9b 100644
--- a/apps/workbench/app/views/application/_choose.js.erb
+++ b/apps/workbench/app/views/application/_choose.js.erb
@@ -6,7 +6,7 @@ $('body > .modal-container .modal .modal-footer .btn-primary').
     attr('data-method', '<%= j params[:action_method] %>').
     data('action-data', <%= raw params[:action_data] %>);
 $(".chooser-show-project").on("click", function() {
-  $("#choose-scroll").html("<%=j image_tag 'ajax-loader.gif' %>");
+  $("#choose-scroll").html("<div class=\"spinner spinner-32px spinner-h-center\"></div>");
   $(".modal-dialog-preview-pane").html('');
   var t = $(this);
   var d = {
diff --git a/apps/workbench/app/views/application/_content.html.erb b/apps/workbench/app/views/application/_content.html.erb
index 02f2e6f..c9522de 100644
--- a/apps/workbench/app/views/application/_content.html.erb
+++ b/apps/workbench/app/views/application/_content.html.erb
@@ -85,7 +85,7 @@
           <%= render(partial: 'show_' + pane.downcase,
                      locals: { comparable: comparable, objects: @objects }) %>
           <% else %>
-            <%= image_tag 'ajax-loader.gif' %>
+            <div class="spinner spinner-32px spinner-h-center"></div>
         <% end %>
       </div>
     </div>
diff --git a/apps/workbench/app/views/jobs/_show_log.html.erb b/apps/workbench/app/views/jobs/_show_log.html.erb
index 743045c..f1466aa 100644
--- a/apps/workbench/app/views/jobs/_show_log.html.erb
+++ b/apps/workbench/app/views/jobs/_show_log.html.erb
@@ -43,16 +43,16 @@ var makeFilter = function() {
   <% logcollection = Collection.find @object.log %>
   <% if logcollection %>
     $.ajax('<%=j url_for logcollection %>/<%=j logcollection.files[0][1] %>').
-    done(function(data, status, jqxhr) {
-    logViewer.filter();
-    addToLogViewer(logViewer, data.split("\n"), taskState);
-    logViewer.filter(makeFilter());
-    generateJobOverview("#log-viewer-overview", logViewer, taskState);
-    $("#logloadspinner").detach();
-    }).
-    fail(function(jqxhr, status, error) {
-    $("#logloadspinner").detach();
-    });
+	done(function(data, status, jqxhr) {
+	    logViewer.filter();
+	    addToLogViewer(logViewer, data.split("\n"), taskState);
+	    logViewer.filter(makeFilter());
+	    generateJobOverview("#log-viewer-overview", logViewer, taskState);
+	    $("#log-viewer .spinner").detach();
+	}).
+	fail(function(jqxhr, status, error) {
+	    $("#log-viewer .spinner").detach();
+	});
   <% end %>
 <% else %>
   <%# Live log loading not implemented yet. %>
@@ -204,7 +204,7 @@ $("#set-show-failed-only").on("click", function() {
     </table>
 
     <% if @object.log and logcollection %>
-      <%= image_tag 'ajax-loader.gif', id: "logloadspinner" %>
+      <div class="spinner spinner-32px"></div>
     <% end %>
 
   </div>

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list