127 lines
3.9 KiB
JavaScript
127 lines
3.9 KiB
JavaScript
'use strict';
|
|
|
|
import DataSpace from "../ds.js";
|
|
|
|
document.addEventListener('readystatechange', async () => {
|
|
DataSpace.printReport();
|
|
// Show modal
|
|
document.querySelector('.modal').classList.add('active');
|
|
|
|
const report = await DataSpace.fetchReport(location.search.replace("?id=", ''));
|
|
const archesJson = await DataSpace.fetchReport(
|
|
location.search.replace("?id=", ''),
|
|
'arches-json'
|
|
);
|
|
const files = DataSpace.getImagesSrc(archesJson);
|
|
|
|
// Close modal
|
|
document.querySelector('.modal').classList.remove('active');
|
|
|
|
const resource = Object.assign(DataSpace.OBJECT_ORDER, report.resource);
|
|
|
|
const shape = DataSpace.createObjectShape(resource);
|
|
|
|
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 match...
|
|
// TODO check if coordinates exists...
|
|
const coordinates = resource['Object Coordinates']
|
|
?.replace(/^.*coordinates\':\s?\[(\d+\.\d+,\s?\d+\.\d+)\].*$/, "$1")
|
|
?.split(', ');
|
|
|
|
let lat, long;
|
|
[long, lat] = coordinates;
|
|
|
|
DataSpace.createMap([lat, long]);
|
|
|
|
resKeys = resKeys.filter(e => !e.includes('Coordinates'));
|
|
|
|
document.querySelector('#rep-tit')
|
|
.innerText = `${resType} ${report.displayname}`;
|
|
|
|
const repTable = document.querySelector('#res-before tbody');
|
|
|
|
// TODO manage files and nested objects
|
|
for (const key in shape.get('before-gallery')) {
|
|
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.parentElement
|
|
.classList.remove('d-hide');
|
|
|
|
for (const src of files) {
|
|
const img = document.createElement('img');
|
|
img.className = 'img-responsive img-fit-cover';
|
|
img.src = src;
|
|
|
|
const col = document.createElement('div');
|
|
col.className = 'column col-3 c-hand spotlight';
|
|
col.setAttribute('data-src', src);
|
|
col.setAttribute('data-download', true);
|
|
|
|
col.appendChild(img);
|
|
gallery.appendChild(col);
|
|
}
|
|
}
|
|
|
|
// Create after-gallery...
|
|
let after = document.querySelector('#res-after');
|
|
|
|
for (const key in shape.get('after-gallery')) {
|
|
const col = document.createElement('div');
|
|
col.className = 'column col-12';
|
|
col.innerHTML = `
|
|
<p class="text-bold">${key.replace(resType, '')}</p>
|
|
<p>${report.resource[key]}</p>
|
|
`
|
|
after.appendChild(col);
|
|
}
|
|
})
|