Generate a unique status div ID for <l:progressiveRendering/> so we d…

…o not clash with anything else on the page.
jenkinsci · Dec 6, 2013 · c81136e · c81136e
1 parent a5fd745
commit c81136e
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 11 deletions.
diff --git a/core/src/main/resources/lib/layout/progressiveRendering.jelly b/core/src/main/resources/lib/layout/progressiveRendering.jelly
@@ -35,9 +35,9 @@ THE SOFTWARE.
         </st:attribute>
     </st:documentation>
     <st:adjunct includes="lib.layout.progressiveRendering.progressiveRendering"/>
-    <!-- TODO generate an ID so we can use this more than once per page -->
-    <t:progressBar id="status" pos="0" tooltip="${tooltip ?: '%progressMessage'}"/>
+    <j:set var="id" value="${h.generateId()}"/>
+    <t:progressBar id="${id}" pos="0" tooltip="${tooltip ?: '%progressMessage'}"/>
     <j:invoke method="start" on="${handler}"/>
     <st:bind var="proxy" value="${handler}" />
-    <script>progressivelyRender(proxy, ${callback});</script>
+    <script>progressivelyRender(proxy, ${callback}, '${id}');</script>
 </j:jelly>
diff --git a/core/src/main/resources/lib/layout/progressiveRendering/progressiveRendering.js b/core/src/main/resources/lib/layout/progressiveRendering/progressiveRendering.js
@@ -22,23 +22,23 @@
  * THE SOFTWARE.
  */
 
-function progressivelyRender(handler, callback) {
+function progressivelyRender(handler, callback, statusId) {
     function checkNews(response) {
         var r = response.responseObject();
         if (r.status == 'done') {
             callback(r.data);
-            $('status').style.display = 'none';
+            $(statusId).style.display = 'none';
         } else if (r.status == 'canceled') {
             // TODO ugly; replace with single tr of class=unknown?
-            $$('#status .progress-bar-done')[0].innerHTML = 'Aborted.';
+            $$('#' + statusId + ' .progress-bar-done')[0].innerHTML = 'Aborted.';
         } else if (r.status == 'error') {
-            $$('#status .progress-bar-done')[0].style.width = '100%';
-            $$('#status .progress-bar-left')[0].style.width = '0%';
-            $('status').className = 'progress-bar red';
+            $$('#' + statusId + ' .progress-bar-done')[0].style.width = '100%';
+            $$('#' + statusId + ' .progress-bar-left')[0].style.width = '0%';
+            $(statusId).className = 'progress-bar red';
         } else {
             callback(r.data);
-            $$('#status .progress-bar-done')[0].style.width = (100 * r.status) + '%';
-            $$('#status .progress-bar-left')[0].style.width = (100 - 100 * r.status) + '%';
+            $$('#' + statusId + ' .progress-bar-done')[0].style.width = (100 * r.status) + '%';
+            $$('#' + statusId + ' .progress-bar-left')[0].style.width = (100 - 100 * r.status) + '%';
             checkNewsLater(500);
         }
     }