Add ogServer parameter to imagesForm

When users select an image, its ogServer is sent too. Then, the back-end
(flask) processes the form to obtain this ogServer and send it the
pertinent requests.

It also makes "Image details" view use this new parameter, and adds
javascript code to ensure that users can only work with several images
at the same time if they belong to the same ogServer.

3 files changed, 37 insertions, 5 deletions

diff --git a/ogcp/static/js/ogcp.js b/ogcp/static/js/ogcp.js
index bdd7581..d5615b8 100644
--- a/ogcp/static/js/ogcp.js
+++ b/ogcp/static/js/ogcp.js
@@ -248,3 +248,20 @@ function RemovePartition(evt) {
     });
 }
 
+function checkImageServer() {
+    const images = $('input:checkbox[form|="imagesForm"]:not(:hidden)')
+
+    images.on('change', function() {
+        const selectedServer = $('#' + $.escapeSelector(this.dataset.server));
+        const serversSelector = 'input:checkbox[name|="image-server"]';
+        const nonSelectedServers = $(serversSelector).not(selectedServer);
+
+        selectedServer.prop('checked', true);
+
+        nonSelectedServers.each(function() {
+            $(this).prop('checked', false);
+            const checkboxes = $('input:checkbox[data-server|="' + this.id + '"]');
+            checkboxes.prop('checked', false);
+        });
+    });
+}
diff --git a/ogcp/templates/images.html b/ogcp/templates/images.html
index 4231df2..d053913 100644
--- a/ogcp/templates/images.html
+++ b/ogcp/templates/images.html
@@ -8,17 +8,31 @@
     </form>
     {{ super() }}
 </form>
+
+<script>
+    // Launch the javascript on document ready, so all the global functions exists
+    // in the scope
+    document.addEventListener('readystatechange', () => {
+        if (document.readyState === 'complete') {
+            checkImageServer();
+        }
+    });
+</script>
 {% endblock %}
 
 {% block sidebar %}
     <ul id="servers" class="nav flex-column nav-pills">
         {% for response in responses %}
+        {% set server_str = response["server"]["ip"] ~ ":" ~ response["server"]["port"] %}
+        <input class="form-check-input" type="checkbox" form="imagesForm"
+               id="{{ server_str }}" value="{{ server_str }}"
+               onclick="return false;" name="image-server" hidden/>
         <li class="nav-item"><b>{{ response["server"]["name"] }}</b>
                 <ul id="images" class="nav flex-column nav-pills">
                     {% for image in response["json"]["images"] %}
                         <li id="{{ image["name"] }}_{{ image["id"] }}" class="nav-item">
                             <input class="form-check-input" type="checkbox" form="imagesForm"
-                                   value="{{ image["id"] }}"
+                                   data-server="{{ server_str }}" value="{{ image["id"] }}"
                                    {% if image.get("selected", False) %}checked{% endif %}
                                    name="{{ image["name"] }}_{{ image["id"] }}" />
                                     {{ image["name"] }}
@@ -41,4 +55,3 @@
     </button>
   {% endif %}
 {% endblock %}
-
diff --git a/ogcp/views.py b/ogcp/views.py
index 3b0d134..c2a40b8 100644
--- a/ogcp/views.py
+++ b/ogcp/views.py
@@ -97,7 +97,7 @@ def validate_elements(elements, min_len=1, max_len=float('inf')):
 
 def parse_elements(checkboxes_dict):
     unwanted_elements = ['csrf_token', 'scope-server', 'scope-center',
-                         'scope-room']
+                         'scope-room', 'image-server']
     elements = set()
     for key, elements_list in checkboxes_dict.items():
         if key not in unwanted_elements:
@@ -1626,12 +1626,14 @@ def user_delete_post():
 @login_required
 def action_image_info():
     form = ImageDetailsForm()
-    ids = parse_elements(request.args.to_dict())
+    params = request.args.to_dict()
+    ids = parse_elements(params)
     if not validate_elements(ids, max_len=1):
         return redirect(url_for('images'))
 
     id = ids.pop()
-    r = g.server.get('/images')
+    server = get_server_from_ip_port(params['image-server'])
+    r = server.get('/images')
     images = r.json()['images']
     image = next(img for img in images if img['id'] == int(id))