Draft report for Sample
This commit is contained in:
parent
beb9ecb29b
commit
dc497a44bd
64
js/ds.js
64
js/ds.js
@ -13,6 +13,7 @@ DataSpace.FILES_URI = `${DataSpace.BASE_URL}/files/uploadedfiles/`;
|
||||
DataSpace.RESOURCE_REPORT = {
|
||||
'Object' : resmap.OBJECT_REPORT,
|
||||
'Context' : resmap.CONTEXT_REPORT,
|
||||
'Sample' : resmap.SAMPLE_REPORT,
|
||||
};
|
||||
/**
|
||||
* Populate partial objects from
|
||||
@ -64,16 +65,16 @@ DataSpace.createShape = function (resource, resType) {
|
||||
* @todo Refactor!! Make it general...
|
||||
*
|
||||
* @param {object} report The report's JSON object
|
||||
* @param {object} report The report's arches-json object
|
||||
* @param {string[]} images Filenames of images
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
DataSpace.renderReport = function (report, images)
|
||||
DataSpace.renderReport = function (report, archesJson, images)
|
||||
{
|
||||
// TODO
|
||||
let resource = report.resource;
|
||||
let resKeys = Object.keys(resource);
|
||||
// TODO
|
||||
// TODO prepare 404 page
|
||||
if (!resKeys.length) {
|
||||
location.href = '/404.html';
|
||||
return;
|
||||
@ -81,20 +82,33 @@ DataSpace.renderReport = function (report, images)
|
||||
|
||||
let resType = resKeys[0].split(' ')[0];
|
||||
|
||||
const geoJSON = JSON.parse(
|
||||
resource[`${resType} Coordinates`]
|
||||
.replaceAll('\'', '"')
|
||||
);
|
||||
if (resType === 'Sample') {
|
||||
const container = document.querySelector('#analysis');
|
||||
container.classList.remove('d-hide');
|
||||
// TODO handle click on "View Analysis"
|
||||
container.querySelector('button').onclick = () => {
|
||||
console.log(this.getRelatedAnalysisId(archesJson));
|
||||
}
|
||||
}
|
||||
|
||||
// TODO this is terrible...
|
||||
const centerCoords = this.getCenterCoordinates(geoJSON);
|
||||
this.createMap(geoJSON);
|
||||
if (['Object', 'Context'].includes(resType)) {
|
||||
const geoJSON = JSON.parse(
|
||||
resource[`${resType} Coordinates`]
|
||||
.replaceAll('\'', '"')
|
||||
);
|
||||
|
||||
// Write coordinates below map
|
||||
document.querySelector('#coord').innerHTML = `
|
||||
<span><strong>Latitude:</strong> ${centerCoords[0]}</span>
|
||||
<span><strong>Longitude:</strong> ${centerCoords[1]}</span>
|
||||
`;
|
||||
document.querySelector('#geo').classList.remove('d-hide');
|
||||
|
||||
// TODO this is terrible...
|
||||
const centerCoords = this.getCenterCoordinates(geoJSON);
|
||||
this.createMap(geoJSON);
|
||||
|
||||
// Write coordinates below map
|
||||
document.querySelector('#coord').innerHTML = `
|
||||
<span><strong>Latitude:</strong> ${centerCoords[0]}</span>
|
||||
<span><strong>Longitude:</strong> ${centerCoords[1]}</span>
|
||||
`;
|
||||
}
|
||||
|
||||
resKeys = resKeys.filter(e => !e.includes('Coordinates'));
|
||||
|
||||
@ -298,13 +312,26 @@ DataSpace.attachReadMore = function (cssClass, maxWords = 100)
|
||||
contentElement.appendChild(node);
|
||||
}
|
||||
}
|
||||
|
||||
contentElement.textContent = text + ' ';
|
||||
contentElement.appendChild(less);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* For the Sample report
|
||||
*
|
||||
* @todo This is quite awful...
|
||||
* @param {object} resource The resource object (Arches JSON!)
|
||||
*
|
||||
* @returns {string}
|
||||
*/
|
||||
DataSpace.getRelatedAnalysisId = function (resource)
|
||||
{
|
||||
// The related analysis is the 7th element
|
||||
// in the tiles array...
|
||||
return Object.values(resource.tiles[6].data)[0][0]['resourceId'];
|
||||
}
|
||||
/**
|
||||
* @todo The order of elements in the tiles array
|
||||
* in arches-json is the same as that of
|
||||
@ -343,7 +370,7 @@ function _createImgGallery(images, htmlId)
|
||||
img.src = src;
|
||||
|
||||
const col = document.createElement('div');
|
||||
col.className = 'column col-3 c-hand spotlight';
|
||||
col.className = 'column p-1 col-lg-3 col-md-4 col-sm-12 c-hand spotlight';
|
||||
col.setAttribute('data-src', src);
|
||||
col.setAttribute('data-download', true);
|
||||
|
||||
@ -371,7 +398,7 @@ function _createReportTable(resType, shape, resource)
|
||||
`<strong>${innerKey.replace(key,'')}</strong>:
|
||||
${resource[key][innerKey]}`;
|
||||
|
||||
if (resource[key][innerKey] !== null) {
|
||||
if (resource[key][innerKey] !== '') {
|
||||
innerList.appendChild(li);
|
||||
}
|
||||
}
|
||||
@ -394,7 +421,6 @@ function _createReportTable(resType, shape, resource)
|
||||
}
|
||||
}
|
||||
|
||||
// TODO `Read more` for description
|
||||
function _createReportTail(resType, shape, resource)
|
||||
{
|
||||
let after = document.querySelector('#res-after');
|
||||
|
||||
50
js/resmap.js
50
js/resmap.js
@ -63,5 +63,53 @@ CONTEXT_REPORT.set(
|
||||
"Context Bibliography" : null,
|
||||
}
|
||||
);
|
||||
const SAMPLE_REPORT = new Map();
|
||||
SAMPLE_REPORT.set(
|
||||
'before-gallery',
|
||||
{
|
||||
"Sample ID" : null,
|
||||
"Sample Object" : null,
|
||||
"Sample Sampling date" : null,
|
||||
"Sample Withdrawal Point" : null,
|
||||
"Sample Compiler" : null,
|
||||
"Sample Bibliography" : null,
|
||||
}
|
||||
);
|
||||
const ANALYSIS_REPORT = new Map();
|
||||
ANALYSIS_REPORT.set(
|
||||
'before-gallery',
|
||||
{
|
||||
"Analysis Sample" : null,
|
||||
"Analysis Description" : null,
|
||||
"Analysis Conservation status" : null,
|
||||
}
|
||||
);
|
||||
ANALYSIS_REPORT.set(
|
||||
'gallery',
|
||||
{
|
||||
"Analysis Photos" : null,
|
||||
/*
|
||||
"Analysis Photos Microscopy" : null,
|
||||
"Analysis Photos SEM EDS" : null,
|
||||
"Analysis Photos Microscopic" : null,
|
||||
*/
|
||||
}
|
||||
);
|
||||
ANALYSIS_REPORT.set(
|
||||
'after-gallery',
|
||||
{
|
||||
"Analysis Spectrum" : null
|
||||
/*
|
||||
"Spectrum Raw Data" : null,
|
||||
"Spectrum Technique" : null,
|
||||
"Spectrum Interpreted Data" : null,
|
||||
*/
|
||||
}
|
||||
);
|
||||
|
||||
export {OBJECT_REPORT, CONTEXT_REPORT};
|
||||
export {
|
||||
OBJECT_REPORT,
|
||||
CONTEXT_REPORT,
|
||||
SAMPLE_REPORT,
|
||||
ANALYSIS_REPORT,
|
||||
};
|
||||
|
||||
@ -4,8 +4,9 @@ import DataSpace from "../ds.js";
|
||||
|
||||
document.addEventListener('readystatechange', async () => {
|
||||
DataSpace.printReport();
|
||||
// Show modal
|
||||
document.querySelector('.modal').classList.add('active');
|
||||
// Show waiting modal
|
||||
document.querySelector('.modal')
|
||||
.classList.add('active');
|
||||
|
||||
const resId = location.search.replace("?id=", '');
|
||||
const report = await DataSpace.fetchReport(resId);
|
||||
@ -15,11 +16,11 @@ document.addEventListener('readystatechange', async () => {
|
||||
);
|
||||
const images = DataSpace.getImagesSrc(archesJson);
|
||||
|
||||
// Close modal
|
||||
document.querySelector('.modal').classList.remove('active');
|
||||
// Close waiting modal
|
||||
document.querySelector('.modal')
|
||||
.classList.remove('active');
|
||||
|
||||
// Create report HTML
|
||||
DataSpace.renderReport(report, images);
|
||||
|
||||
DataSpace.renderReport(report, archesJson, images);
|
||||
DataSpace.attachReadMore('read-more', 80);
|
||||
});
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="column col-lg-5 col-md-12 col-sm-12 p-2 mt-1">
|
||||
<div id="geo" class="d-hide column col-lg-5 col-md-12 col-sm-12 p-2 mt-1">
|
||||
<div id="map" class="mt-2"></div>
|
||||
<p class="mt-2 p-2">
|
||||
<strong>Coordinates</strong>
|
||||
@ -61,6 +61,13 @@
|
||||
</div>
|
||||
<div class="columns mt-2" id="res-after">
|
||||
</div>
|
||||
<div id="analysis" class="d-hide columns mt-2 mb-2 pb-2">
|
||||
<div class="column col-12 text-center">
|
||||
<button class="btn btn-primary btn-lg">
|
||||
View Analysis
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="text-light">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user