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.

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);
+        });
+    });
+}

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 %}
-

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))