ds-front-test/js/views/report.js

100 lines
2.9 KiB
JavaScript

'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');
// DEBUG
const files = getImageSrc(archesJson);
printReport();
let resKeys = Object.keys(resource);
// Default value...
let resType = 'Object';
// TODO
if (!resKeys.length) {
location.href = '/404.html';
return;
}
resType = resKeys[0].split(' ')[0];
// TODO use coordinates for map
const coordinates = resource['Coordinates'];
resKeys = resKeys.filter(e => !e.includes('Coordinates'));
document.querySelector('#rep-tit')
.innerText = `${resType} ${report.displayname}`;
const repTable = document.querySelector('#resource tbody');
// TODO manage files and nested objects
for (const key of resKeys) {
const row = document.createElement('tr');
let innerList = null;
// TODO refactor
if (typeof report.resource[key] == 'object') {
const boolValue = '@value' in report.resource[key];
innerList = document.createElement('ul');
if (! boolValue) {
for (const k in report.resource[key]) {
const li = document.createElement('li');
li.innerHTML =
`<strong>${k.replace(key,'')}</strong>:
${report.resource[key][k]}`;
if (report.resource[key][k] !== null) {
innerList.appendChild(li);
}
}
} else {
innerList.innerHTML =
`<li>${report.resource[key]['@value']}</li>`;
}
}
let value = innerList !== null ?
innerList.outerHTML : report.resource[key];
row.innerHTML = `
<td class="text-bold key">${key.replace(resType, '')}</td>
<td>${value}</td>
`;
if (!key.includes('Images') && !key.includes('Photos')) {
repTable.appendChild(row);
}
}
if (files.length) {
// Create image gallery
// TODO refactor...
let gallery = document.querySelector('#gallery');
gallery.classList.remove('d-hide');
for (const src of files) {
const img = document.createElement('img');
img.className = 'img-responsive img-fit-contain';
img.src = src;
const col = document.createElement('div');
col.className = 'column col-4 c-hand spotlight';
col.setAttribute('data-src', src);
col.setAttribute('data-download', true);
col.appendChild(img);
gallery.appendChild(col);
}
}
})