Add the JS code to handle the "Include all projects" #1524

Signed-off-by: tdruez <[email protected]>

Author: tdruez

scancodeio/static/main.js

@@ -232,7 +232,8 @@ function setupSelectCheckbox() {
       updateButtonAndDropdownState();
 
       // Check if all row checkboxes are checked and update the "Select All" checkbox accordingly
-      selectAllCheckbox.checked = Array.from(rowCheckboxes).every((cb) => cb.checked);
+      const allRowCheckboxesChecked = Array.from(rowCheckboxes).every((cb) => cb.checked);
+      selectAllCheckbox.checked = allRowCheckboxesChecked;
     });
   });
 

scanpipe/templates/scanpipe/modals/projects_archive_modal.html

@@ -34,13 +34,15 @@
           </label>
         </div>
         {% if page_obj.paginator.num_pages > 1 %}
-          <hr>
-          <div class="field">
-            <label class="checkbox" for="{{ archive_form.select_across.id_for_label }}">
-              <input type="checkbox" name="{{ archive_form.select_across.name }}" id="{{ archive_form.select_across.id_for_label }}">
-              Include all {{ paginator.count|intcomma }} projects
-            </label>
-            <p class="help">{{ outputs_download_form.select_across.help_text }}</p>
+          <div class="show-on-all-checked">
+            <hr>
+            <div class="field include-all-field">
+              <label class="checkbox" for="{{ archive_form.select_across.id_for_label }}">
+                <input type="checkbox" name="{{ archive_form.select_across.name }}" id="{{ archive_form.select_across.id_for_label }}">
+                Include all {{ paginator.count|intcomma }} projects
+              </label>
+              <p class="help">{{ outputs_download_form.select_across.help_text }}</p>
+            </div>
           </div>
         {% endif %}
       </section>

scanpipe/templates/scanpipe/modals/projects_download_modal.html

@@ -15,13 +15,15 @@
           </div>
         </div>
         {% if page_obj.paginator.num_pages > 1 %}
-          <hr>
-          <div class="field">
-            <label class="checkbox" for="{{ outputs_download_form.select_across.id_for_label }}">
-              <input type="checkbox" name="{{ outputs_download_form.select_across.name }}" id="{{ outputs_download_form.select_across.id_for_label }}">
-              Include all {{ paginator.count|intcomma }} projects
-            </label>
-            <p class="help">{{ outputs_download_form.select_across.help_text }}</p>
+          <div class="show-on-all-checked">
+            <hr>
+            <div class="field">
+              <label class="checkbox" for="{{ outputs_download_form.select_across.id_for_label }}">
+                <input type="checkbox" name="{{ outputs_download_form.select_across.name }}" id="{{ outputs_download_form.select_across.id_for_label }}">
+                Include all {{ paginator.count|intcomma }} projects
+              </label>
+              <p class="help">{{ outputs_download_form.select_across.help_text }}</p>
+            </div>
           </div>
         {% endif %}
       </section>

scanpipe/templates/scanpipe/modals/projects_report_modal.html

@@ -15,13 +15,15 @@
           </div>
         </div>
         {% if page_obj.paginator.num_pages > 1 %}
-          <hr>
-          <div class="field">
-            <label class="checkbox" for="{{ report_form.select_across.id_for_label }}">
-              <input type="checkbox" name="{{ report_form.select_across.name }}" id="{{ report_form.select_across.id_for_label }}">
-              Include all {{ paginator.count|intcomma }} projects
-            </label>
-            <p class="help">{{ report_form.select_across.help_text }}</p>
+          <div class="show-on-all-checked">
+            <hr>
+            <div class="field include-all-field">
+              <label class="checkbox" for="{{ report_form.select_across.id_for_label }}">
+                <input type="checkbox" name="{{ report_form.select_across.name }}" id="{{ report_form.select_across.id_for_label }}">
+                Include all {{ paginator.count|intcomma }} projects
+              </label>
+              <p class="help">{{ report_form.select_across.help_text }}</p>
+            </div>
           </div>
         {% endif %}
       </section>

scanpipe/templates/scanpipe/project_list.html

@@ -98,6 +98,24 @@
           }
         });
       });
+
+      document.addEventListener("openModal", function(event) {
+        // Get all elements that should be shown or hidden based on the state of the checkboxes
+        const elementsForAllRowsChecked = getAll(".show-on-all-checked");
+        const selectAllCheckbox = document.getElementById("select-all");
+        const displayValue = selectAllCheckbox.checked ? "block" : "none";
+
+        // Iterate through all elements that need to be shown or hidden and apply the display style
+        elementsForAllRowsChecked.forEach((field) => {
+          field.style.display = displayValue;
+        });
+      });
+
     });
   </script>
+
+
+<script>
+
+</script>
 {% endblock %}