Merge "zuul status: Collapse changes by default"

modules/openstack_project/files/zuul/status.html

@@ -39,6 +39,9 @@
 .container {
     width: 1024px;
 }
+label {
+    font-weight: normal;
+}
 #pipeline-container {
     margin: 0 auto;
 }
@@ -246,7 +249,7 @@ progress[aria-valuenow]:before  {
       Queue lengths: <span id="trigger_event_queue_length"></span> events,
       <span id="result_event_queue_length"></span> results.
       &nbsp;&nbsp;&nbsp;&nbsp;
-      Filter projects:
+      <label for="projects_filter">Filter projects:</label>
       <span class="projects_filter_container">
         <input type="text" id="projects_filter" />
         <!--
@@ -259,6 +262,11 @@ progress[aria-valuenow]:before  {
           <a href="#" class="save-filter hidden">Save Filter</a>
         </sub>
       </span>
+      &nbsp;&nbsp;&nbsp;&nbsp;
+      <label for="expandByDefault">Expand by default:</label>
+      <span class="expand_by_default_container">
+        <input type="checkbox" id="expandByDefault" onchange="toggle_expand_by_default(this)"/>
+      </span>
       </p>
     </div>
 

modules/openstack_project/files/zuul/status.js

@@ -14,7 +14,7 @@
 
 window.zuul_enable_status_updates = true;
 window.zuul_filter = [];
-window.zuul_collapsed_changes = [];
+window.zuul_collapsed_exceptions = [];
 
 function format_time(ms, words) {
     if (ms == null) {
@@ -248,13 +248,18 @@ function format_change(change, change_queue) {
         }
     }
 
-    collapsed_index = window.zuul_collapsed_changes.indexOf(
+    display = $('#expandByDefault').is(':checked');
-        safe_id(change['id']));
+    safe_change_id = safe_id(change['id']);
+    collapsed_index = window.zuul_collapsed_exceptions.indexOf(safe_change_id);
+    if (collapsed_index > -1) {
+        /* listed as an exception to the current default */
+        display = !display;
+    }
 
     html += '</span><span class="time">';
     html += format_time(change['remaining_time'], true);
     html += '</span></div><div class="jobs"';
-    if (collapsed_index > -1) {
+    if (display == false) {
         html += ' style="display: none;"'
     }
     html += '>';
@@ -307,11 +312,30 @@ function toggle_display_jobs(_header) {
     content = header.next("div");
     content.slideToggle(100, function () {
         changeid = header.parent().attr('id');
-        index = window.zuul_collapsed_changes.indexOf(changeid);
+        collapsed_index = window.zuul_collapsed_exceptions.indexOf(changeid);
-        if (content.is(":visible")) {
+        expand_by_default = $('#expandByDefault').is(':checked');
-            window.zuul_collapsed_changes.splice(index, 1);
+        visible = content.is(":visible");
+        if (expand_by_default != visible && collapsed_index == -1) {
+            /* now an exception to the default */
+            window.zuul_collapsed_exceptions.push(changeid);
+        } else if (collapsed_index > -1) {
+            window.zuul_collapsed_exceptions.splice(collapsed_index, 1);
+        }
+    });
+}
+
+function toggle_expand_by_default(_checkbox) {
+    var checkbox = $(_checkbox);
+    expand_by_default = checkbox.is(':checked');
+    set_cookie('zuul-expand-by-default', expand_by_default ? 'true' : 'false');
+    window.zuul_collapsed_exceptions = [];
+    $.each($('div.change'), function(i, _change) {
+        change = $(_change);
+        content = change.children('div').next('div');
+        if (expand_by_default) {
+            content.show(0);
         } else {
-            window.zuul_collapsed_changes.push(changeid);
+            content.hide(0);
         }
     });
 }
@@ -334,17 +358,18 @@ function update_timeout() {
     setTimeout(update_timeout, 5000);
 }
 
-function clean_collapsed_changes_list() {
+function clean_changes_lists() {
-    new_list = [];
+    new_collapsed_exceptions = [];
 
     $.each($('div.change'), function(i, change) {
-        collapsed_index = window.zuul_collapsed_changes.indexOf(change.id);
+        collapsed_index = window.zuul_collapsed_exceptions.indexOf(change.id);
         if (collapsed_index > -1) {
-            new_list.push(change.id);
+            new_collapsed_exceptions.push(change.id);
+            return;
         }
     });
 
-    window.zuul_collapsed_changes = new_list;
+    window.zuul_collapsed_exceptions = new_collapsed_exceptions;
 }
 
 function update() {
@@ -375,7 +400,7 @@ function update() {
 
     });
 
-    clean_collapsed_changes_list();
+    clean_changes_lists();
 }
 
 function update_graphs() {
@@ -401,13 +426,17 @@ function update_graphs() {
 function save_filter() {
     var name = 'zuul-project-filter';
     var value = $('#projects_filter').val().trim();
-    document.cookie = name+"="+value+"; path=/";
+    set_cookie(name, value);
     $('img.filter-saved').removeClass('hidden');
     window.setTimeout(function(){
         $('img.filter-saved').addClass('hidden');
     }, 1500);
 }
 
+function set_cookie(name, value) {
+    document.cookie = name + "=" + value + "; path=/";
+}
+
 function read_cookie(name) {
     var nameEQ = name + "=";
     var ca = document.cookie.split(';');
@@ -461,4 +490,7 @@ $(function() {
     var cookie = read_cookie('zuul-project-filter');
     if(cookie)
         $('#projects_filter').val(cookie).change();
+    cookie = read_cookie('zuul-expand-by-default');
+    if(cookie)
+        $('#expandByDefault').prop('checked', cookie == 'true' ? true : false);
 });