Brutal image handling...

js/views/report.js

@@ -1,17 +1,21 @@
 'use strict';
 
 import {
+    BASE_URL,
     fetchReport,
     printReport,
+    getImageSrc
 } from "../ds.js";
 
 document.addEventListener('readystatechange', async () => {
     const report = await fetchReport(location.search.replace("?id=", ''));
     const resource = report.resource;
+    const archesJson = await fetchReport(location.search.replace("?id=", ''), 'arches-json');
 
-    document.querySelector('#print').addEventListener('click', () => {
-        window.print();
-    });
+    // DEBUG
+    const files = getImageSrc(archesJson);
+
+    printReport();
 
     let resKeys = Object.keys(resource);
     // Default value...
@@ -52,7 +56,8 @@ document.addEventListener('readystatechange', async () => {
                     }
                 }
             } else {
-                innerList.innerHTML = `<li>${report.resource[key]['@value']}</li>`;
+                innerList.innerHTML = 
+                    `<li>${report.resource[key]['@value']}</li>`;
             }
         }
 
@@ -60,6 +65,18 @@ document.addEventListener('readystatechange', async () => {
         let value = innerList !== null ? 
             innerList.outerHTML : report.resource[key];
 
+        if (key.includes('Images')) {
+            let images = '';
+
+            for (const src of files) {
+                images += `<span style="max-width: 100px; padding: 5px">
+                    <img class="img-fit-contain img-responsive" src="${src}" />
+                    </span>`;
+            }
+
+            value = images;
+        }
+
         row.innerHTML = `
             <td class="text-bold key">${key.replace(resType, '')}</td>
             <td>${value}</td>