From 24aab951a8373642b36e1063789a20bb05965586 Mon Sep 17 00:00:00 2001
From: Javier Hernandez <jhernandez@soleta.eu>
Date: Thu, 14 Dec 2023 12:30:16 +0100
Subject: Group images by repos

Make the sidebar from the images menu display the list of repos grouped
by repos
---
 ogcp/templates/images.html | 30 ++++++++++++++++++++----------
 1 file changed, 20 insertions(+), 10 deletions(-)

(limited to 'ogcp/templates')

diff --git a/ogcp/templates/images.html b/ogcp/templates/images.html
index 3b1a296..2a50d39 100644
--- a/ogcp/templates/images.html
+++ b/ogcp/templates/images.html
@@ -14,6 +14,7 @@
     // in the scope
     document.addEventListener('readystatechange', () => {
         if (document.readyState === 'complete') {
+            keepImagesTreeState();
             checkImageServer();
         }
     });
@@ -24,22 +25,31 @@
     <ul id="servers" class="nav ogcp-nav flex-column nav-pills">
         {% for response in responses %}
         {% set server_str = response["server"]["ip"] ~ ":" ~ response["server"]["port"] %}
+        {% set parent_id = "repos-" ~ loop.index0 %}
                 <li class="nav-item">
                 <input class="form-check-input" type="checkbox" form="imagesForm"
                        id="{{ server_str }}" value="{{ server_str }}"
                        onclick="return false;" name="image-server" hidden/>
-                <a class="nav-link" data-toggle="collapse" data-target="#images-{{ loop.index0 }}">
+                <a class="nav-link" data-toggle="collapse" data-target="#repos-{{ loop.index0 }}">
                     <b>{{ response["server"]["name"] }}</b>
                 </a>
-                <ul id="images-{{ loop.index0 }}" class="nav flex-column nav-pills collapse">
-                    {% for image in response["json"]["images"] %}
-                        <li id="{{ image["name"] }}_{{ image["id"] }}" class="nav-item">
-                            <input class="form-check-input" type="checkbox" form="imagesForm"
-                                   data-server="{{ server_str }}" value="{{ image["id"] }}"
-                                   {% if image.get("selected", False) %}checked{% endif %}
-                                   name="{{ image["name"] }}_{{ image["id"] }}" />
-                                    {{ image["name"] }}
-                        </li>
+                <ul id="{{ parent_id }}" class="nav flex-column nav-pills collapse">
+                    {% for repo, repo_data in response["repos"].items() %}
+                        <li class="nav-item">
+                        <a class="nav-link" data-toggle="collapse" data-target="#{{parent_id}}-{{ loop.index0 }}">
+                            <b>{{ repo_data["name"] }}</b>
+                        </a>
+                        <ul id="{{parent_id}}-{{ loop.index0 }}" class="nav ogcp-nav flex-column nav-pills collapse">
+                            {% for image in repo_data["images"] %}
+                                <li id="{{ image["name"] }}_{{ image["id"] }}" class="nav-item">
+                                    <input class="form-check-input" type="checkbox" form="imagesForm"
+                                        data-server="{{ server_str }}" value="{{ image["id"] }}"
+                                        {% if image.get("selected", False) %}checked{% endif %}
+                                        name="{{ image["name"] }}_{{ image["id"] }}" />
+                                     {{ image["name"] }}
+                                </li>
+                            {% endfor %}
+                        </ul>
                     {% endfor %}
                 </ul>
             </li>
-- 
cgit v1.2.3-18-g5258