Add summary site sheet (draft)
This commit is contained in:
parent
981239db44
commit
2b2c9ee706
27
index.html
27
index.html
@ -91,12 +91,20 @@
|
||||
<div class="modal-content has-background-white" style="min-height: 95vh;">
|
||||
<div class="tabs is-centered">
|
||||
<ul>
|
||||
<li class="is-active" id="for-site-sheet">
|
||||
<li class="is-active" id="for-short-sheet">
|
||||
<a>
|
||||
<span class="icon is-small"
|
||||
><i class="fas fa-info-circle" aria-hidden="true"></i
|
||||
></span>
|
||||
<span>Scheda descrittiva</span>
|
||||
<span>Scheda sintetica</span>
|
||||
</a>
|
||||
</li>
|
||||
<li id="for-site-sheet">
|
||||
<a>
|
||||
<span class="icon is-small"
|
||||
><i class="fas fa-info-circle" aria-hidden="true"></i
|
||||
></span>
|
||||
<span>Scheda dettagliata</span>
|
||||
</a>
|
||||
</li>
|
||||
<li id="for-photos">
|
||||
@ -117,7 +125,8 @@
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="data-tabs" id="site-sheet"></div>
|
||||
<div class="data-tabs" id="short-sheet"></div>
|
||||
<div class="data-tabs is-hidden" id="site-sheet"></div>
|
||||
<div class="data-tabs is-hidden" id="photos"></div>
|
||||
<div class="data-tabs is-hidden" id="documents"></div>
|
||||
</div>
|
||||
@ -131,20 +140,20 @@
|
||||
<h1 class="modal-card-title has-text-centered mb-0"><i class="fa fa-info-circle mr-2"></i> Il progetto</h1>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="p-2 mt-2 mb-2 panel-block">
|
||||
<section class="modal-card-body is-size-5">
|
||||
<p class="p-2 mt-2 mb-2">
|
||||
Il progetto per la realizzazione della carta archeologica dell’isola di Capri vede coinvolti, tramite appositi accordi di collaborazione e sotto la direzione scientifica della Soprintendenza Archeologia Belle Arti e Paesaggio per l’Area Metropolitana di Napoli, i Comuni di Capri e di Anacapri, l’Istituto di Scienze del Patrimonio Culturale (ISPC) del CNR e l’Associazione Culturale Apragopolis.
|
||||
</p>
|
||||
<p class="p-2 mt-2 mb-2 panel-block">
|
||||
<p class="p-2 mt-2 mb-2">
|
||||
L’obiettivo principale consiste nell’acquisire conoscenze sull’effettiva estensione dei beni archeologici presenti sull’isola, localizzarne i resti e approfondirne le funzioni e dimensioni originarie. La creazione di una mappa archeologica dell’isola rappresenta lo strumento più idoneo per affrontare diverse esigenze, tra cui facilitare le azioni mirate alla protezione e valorizzazione del patrimonio culturale, oltre a fornire una corretta comprensione dell’evoluzione territoriale. Questa comprensione è un presupposto fondamentale per ricostruire gli eventi storici dell’area e guidare la pianificazione territoriale.
|
||||
</p>
|
||||
<p class="p-2 mt-2 mb-2 panel-block">
|
||||
<p class="p-2 mt-2 mb-2">
|
||||
Il progetto sperimenta l’utilizzo di metodi innovativi di rappresentazione dei monumenti per produrre nuovi contenuti scientifici e una documentazione grafica dettagliata utile all’analisi archeologica. Attraverso la creazione del webgis si consente a tutti i soggetti interessati di fruire liberamente ed in maniera condivisa delle informazioni storico-archeologiche appositamente raccolte e archiviate.
|
||||
</p>
|
||||
<p class="p-2 mt-2 mb-2 panel-block">
|
||||
<p class="p-2 mt-2 mb-2">
|
||||
Il contributo del CNR ha riguardato il censimento del noto, la raccolta e lo studio della cartografia storica, le attività di rilevamento archeologico dei siti di estensione maggiore scarsamente studiati e rappresentati, la schedatura e analisi delle murature e delle tecniche costruttive, ipotesi di ricostruzione e delle funzioni degli spazi, nonché la costruzione del sistema Web GIS.
|
||||
</p>
|
||||
<p class="p-2 mt-2 mb-2 panel-block">
|
||||
<p class="p-2 mt-2 mb-2">
|
||||
L’Associazione Culturale Apragopolis ha condotto attività di digitalizzazione e analisi della documentazione d’archivio storico e corrente (documenti amministrativi, documentazione di scavo, disegni storici, planimetrie e fotografie), unitamente a ricognizioni sul campo con il coinvolgimento di esperti per l’avvio dei rilievi subacquei e per la realizzazione di ricostruzioni virtuali.
|
||||
</p>
|
||||
</section>
|
||||
|
@ -13,25 +13,56 @@ export class SiteSheet {
|
||||
render() {
|
||||
return `<div class="container has-bottom-border">
|
||||
<table class="table is-fullwidth is-striped">
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Identificazione</th></tr>
|
||||
<tr><th>Denominazione</th><td>${this._siteData.denominazione}</td></tr>
|
||||
<tr><th>Località</th><td>${this._siteData.localita}</td></tr>
|
||||
<tr><th>Indirizzo</th><td>${this._siteData.indirizzo}</td></tr>
|
||||
<tr><th>Comune</th><td>${this._siteData.comune}</td></tr>
|
||||
<tr><th>Localizzazione</th><td>${this._siteData.localizzazione}</td></tr>
|
||||
<tr><th>Definizione</th><td>${this._siteData.definizione}</td></tr>
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Localizzazione geografico-amministrativa</th></tr>
|
||||
<tr><th>Comune</th><td>${this._siteData.comune}</td></tr>
|
||||
<tr><th>Indirizzo</th><td>${this._siteData.indirizzo}</td></tr>
|
||||
<tr><th>Località</th><td>${this._siteData.localita}</td></tr>
|
||||
<tr><th>Localizzazione</th><td>${this._siteData.localizzazione}</td></tr>
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Cronologia</th></tr>
|
||||
<tr><th>Periodo</th><td>${this._siteData.periodo}</td></tr>
|
||||
<tr><th>Fase</th><td>${this._siteData.fase}</td></tr>
|
||||
<tr><th>Cronologia</th><td>${this._siteData.cronologia}</td></tr>
|
||||
<tr><th>Motivazione cronologia</th><td>${this._siteData.motivazione_cron}</td></tr>
|
||||
<tr><th>Ritrovamento</th><td>${this._siteData.ritrovamento}</td></tr>
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Conservazione e condizione giuridica</th></tr>
|
||||
<tr><th>Stato di conservazione</th><td>${this._siteData.stato_conserv}</td></tr>
|
||||
<tr><th>Tutela vigente</th><td>${this._siteData.tutela_vigente}</td></tr>
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Ritrovamento e materiali</th></tr>
|
||||
<tr><th>Anno di ritrovamento</th><td>${this._siteData.ritrovamento}</td></tr>
|
||||
<tr><th>Materiali rinvenuti</th><td>${this._siteData.materiali_rinv}</td></tr>
|
||||
<tr><th>Luogo custodia materiali</th><td>${this._siteData.luogo_custodia_mat}</td></tr>
|
||||
<tr><th>Tutela vigente</th><td>${this._siteData.tutela_vigente}</td></tr>
|
||||
<tr><th>Stato di conservazione</th><td>${this._siteData.stato_conserv}</td></tr>
|
||||
<tr><th>Descrizione</th>
|
||||
<td><details><summary class="is-clickable">Leggi tutto</summary>${this._siteData.descrizione}</details></td>
|
||||
</tr>
|
||||
<tr class="is-link"><th class="is-size-5 has-text-centered" colspan=2>Descrizione</th></tr>
|
||||
<tr><td class="pr-6 pl-6 pt-3" colspan="2">${this._siteData.descrizione}</td></tr>
|
||||
</table>
|
||||
</div>`;
|
||||
}
|
||||
|
||||
renderShort() {
|
||||
return `
|
||||
<div class="container ml-3">
|
||||
<p class="p-2">
|
||||
<span class="icon has-text-link">
|
||||
<i class="fa fa-tag"></i>
|
||||
</span>
|
||||
<strong>Denominazione:</strong> ${this._siteData.denominazione}
|
||||
</p>
|
||||
<p class="p-2">
|
||||
<span class="icon has-text-link">
|
||||
<i class="fa fa-hourglass"></i>
|
||||
</span>
|
||||
<strong>Periodo:</strong> ${this._siteData.periodo}
|
||||
</p>
|
||||
<p class="p-2">
|
||||
<span class="icon has-text-link">
|
||||
<i class="fa fa-map"></i>
|
||||
</span>
|
||||
<strong>Località generica:</strong> DA INSERIRE
|
||||
</p>
|
||||
<p class="mt-4 p-2">
|
||||
Descrizione breve... bla bla bla...
|
||||
</p>
|
||||
</div>`;
|
||||
}
|
||||
}
|
1
js/ui.js
1
js/ui.js
@ -84,6 +84,7 @@ UI.openModal = async function (data, selector) {
|
||||
|
||||
let siteSheet = new SiteSheet();
|
||||
siteSheet.siteData = data;
|
||||
modal.querySelector('#short-sheet').innerHTML = siteSheet.renderShort();
|
||||
modal.querySelector('#site-sheet').innerHTML = siteSheet.render();
|
||||
|
||||
let photos = modal.querySelector('#photos');
|
||||
|
Loading…
Reference in New Issue
Block a user