new: Show images in tooltip in hostnode popup

lookyloo/lookyloo.py

@@ -880,13 +880,13 @@ class Lookyloo():
 
         return known, legitimate
 
-    def get_ressource(self, tree_uuid: str, urlnode_uuid: str, h: Optional[str]) -> Optional[Tuple[str, BytesIO]]:
+    def get_ressource(self, tree_uuid: str, urlnode_uuid: str, h: Optional[str]) -> Optional[Tuple[str, BytesIO, str]]:
         url = self.get_urlnode_from_tree(tree_uuid, urlnode_uuid)
         if url.empty_response:
             return None
         if not h or h == url.body_hash:
             # we want the body
-            return url.filename if url.filename else 'file.bin', url.body
+            return url.filename if url.filename else 'file.bin', url.body, url.mimetype
 
         # We want an embedded ressource
         if h not in url.resources_hashes:
@@ -894,7 +894,7 @@ class Lookyloo():
         for mimetype, blobs in url.embedded_ressources.items():
             for ressource_h, blob in blobs:
                 if ressource_h == h:
-                    return 'embedded_ressource.bin', blob
+                    return 'embedded_ressource.bin', blob, mimetype
         return None
 
     def misp_export(self, capture_uuid: str) -> Union[MISPEvent, Dict[str, str]]:

website/web/__init__.py

@@ -603,7 +603,7 @@ def get_ressource(tree_uuid: str, node_uuid: str):
     to_return = BytesIO()
     with ZipFile(to_return, 'w', ZIP_DEFLATED) as zfile:
         if ressource:
-            filename, r = ressource
+            filename, r, mimetype = ressource
             zfile.writestr(filename, r.getvalue())
         else:
             zfile.writestr('file.txt', b'Unknown Hash')
@@ -612,6 +612,22 @@ def get_ressource(tree_uuid: str, node_uuid: str):
                      as_attachment=True, attachment_filename='file.zip')
 
 
+@app.route('/tree/<string:tree_uuid>/url/<string:node_uuid>/ressource_preview', methods=['POST', 'GET'])
+def get_ressource_preview(tree_uuid: str, node_uuid: str):
+    if request.method == 'POST':
+        h_request = request.form.get('ressource_hash')
+    else:
+        h_request = None
+    ressource = lookyloo.get_ressource(tree_uuid, node_uuid, h_request)
+    if not ressource:
+        return None
+    filename, r, mimetype = ressource
+    if mimetype.startswith('image'):
+        return send_file(r, mimetype=mimetype,
+                         as_attachment=True, attachment_filename=filename)
+    return None
+
+
 @app.route('/tree/<string:tree_uuid>/url/<string:node_uuid>/hashes', methods=['GET'])
 def hashes_urlnode(tree_uuid: str, node_uuid: str):
     hashes = lookyloo.get_hashes(tree_uuid, urlnode_uuid=node_uuid)

website/web/static/tree.css

@@ -130,6 +130,14 @@
   z-index: 2;
 }
 
+.tooltip img {
+  background: white;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  padding: 5px;
+  width: 150px;
+}
+
 hr {
   display: block;
   margin-top: 0.1em;

website/web/templates/hostname_popup.html

@@ -61,7 +61,13 @@
     });
   });
   </script>
-
+  <script>
+  $(document).ready(() => {
+    $(function () {
+      $('[data-toggle="tooltip"]').tooltip()
+    })
+  });
+  </script>
 {% endblock %}
 
 {% block content %}

website/web/templates/macros.html

@@ -255,8 +255,12 @@
       <img src="{{ path }}" alt="{{ key }}" width="21" height="21"/>
     </a>
     {% elif key in ["js", "exe", "css", "font", "html", "json", "image", "video", "unknown_mimetype", "text", "unset_mimetype", "octet-stream", "livestream"] and not urlnode.empty_response %}
-      <a href="{{ url_for('get_ressource', tree_uuid=tree_uuid, node_uuid=urlnode.uuid) }}" title="Download the content of the response">
-        <img src="{{ path }}" alt="{{ key }}" width="21" height="21"/>
+      <a href="{{ url_for('get_ressource', tree_uuid=tree_uuid, node_uuid=urlnode.uuid) }}">
+        <img src="{{ path }}" alt="{{ key }}" width="21" height="21"
+        {% if key == "image" %}
+        data-toggle="tooltip" data-placement="bottom" data-html="true" title='<img src="{{ url_for('get_ressource_preview', tree_uuid=tree_uuid, node_uuid=urlnode.uuid) }}"/> </br>Click to download the content of the response in a zip file'
+        {% endif %}
+        />
       </a>
     {% elif key != "redirect" %}
     <img src="{{ path }}" alt="{{ key }}" width="21" height="21"/>