Compare commits
2 Commits
4ea00e9555
...
07f8dd9a86
| Author | SHA1 | Date | |
|---|---|---|---|
| 07f8dd9a86 | |||
| 1a0c5c1766 |
@ -120,9 +120,13 @@ a:visited {
|
|||||||
.modal {
|
.modal {
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
.modal-content {
|
.modal-content,
|
||||||
|
.modal-card {
|
||||||
width: 60vw;
|
width: 60vw;
|
||||||
}
|
}
|
||||||
|
.modal-card {
|
||||||
|
min-height: 95vh;
|
||||||
|
}
|
||||||
.has-bottom-border {
|
.has-bottom-border {
|
||||||
border-bottom: 1px #aaa solid;
|
border-bottom: 1px #aaa solid;
|
||||||
}
|
}
|
||||||
|
|||||||
BIN
img/cartografia.jpg
Normal file
BIN
img/cartografia.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
img/credits.jpg
Normal file
BIN
img/credits.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
BIN
img/logo direzione generale ricerca.png
Normal file
BIN
img/logo direzione generale ricerca.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
img/logo porto turistico.png
Normal file
BIN
img/logo porto turistico.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
@ -0,0 +1,4 @@
|
|||||||
|
[ZoneTransfer]
|
||||||
|
ZoneId=3
|
||||||
|
ReferrerUrl=https://sabapmetropolitanana.cultura.gov.it/
|
||||||
|
HostUrl=https://sabapmetropolitanana.cultura.gov.it/wp-content/uploads/2024/06/logo-soprintendenza-abap-area-metropolitana-napoli-bianco-e1680166536285.webp
|
||||||
BIN
img/progetto.jpg
Normal file
BIN
img/progetto.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
img/pubblicazioni.jpg
Normal file
BIN
img/pubblicazioni.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
BIN
img/riconoscimenti.jpg
Normal file
BIN
img/riconoscimenti.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
BIN
img/webgis.jpg
Normal file
BIN
img/webgis.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
BIN
img/webgis.webp
BIN
img/webgis.webp
Binary file not shown.
|
Before Width: | Height: | Size: 136 KiB |
248
index.html
248
index.html
@ -4,8 +4,15 @@
|
|||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="stylesheet" href="css/app.css" />
|
<link rel="stylesheet" href="css/app.css" />
|
||||||
<title>Carta Archeologica Isola di Capri</title>
|
<title>Carta Archeologica Isola di Capri</title>
|
||||||
|
<script type="importmap">
|
||||||
|
{
|
||||||
|
"imports": {
|
||||||
|
"@hotwired/stimulus": "./webgis/js/vendor/@hotwired/stimulus/dist/stimulus.js"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body data-controller="modal">
|
||||||
<nav class="navbar mb-2 p-3 has-bottom-border" role="navigation">
|
<nav class="navbar mb-2 p-3 has-bottom-border" role="navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="https://ispc.cnr.it" title="CNR-ISPC">
|
<a class="navbar-item" href="https://ispc.cnr.it" title="CNR-ISPC">
|
||||||
@ -23,10 +30,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<hr class="navbar-divider">
|
<hr class="navbar-divider">
|
||||||
<div class="navbar-end">
|
<div class="navbar-end">
|
||||||
<a href="#progetto" class="navbar-item">Il progetto</a>
|
<a href="/webgis/" class="navbar-item">WebGIS</a>
|
||||||
<a href="#webgis" class="navbar-item">Il WebGIS</a>
|
|
||||||
<a href="#riconoscimenti" class="navbar-item">Riconoscimenti</a>
|
|
||||||
<a href="#credits" class="navbar-item">Credits</a>
|
|
||||||
<a class="navbar-item" href="https://www.comune.anacapri.na.it/" title="Comune di Anacapri">
|
<a class="navbar-item" href="https://www.comune.anacapri.na.it/" title="Comune di Anacapri">
|
||||||
<img class="image" src="img/logo_anacapri.svg" style="min-height: 88px;" />
|
<img class="image" src="img/logo_anacapri.svg" style="min-height: 88px;" />
|
||||||
</a>
|
</a>
|
||||||
@ -48,58 +52,82 @@
|
|||||||
archeologici svolti, le ricerche archivistiche e bibliografiche sui beni archeologici oggi visibili e su quelli
|
archeologici svolti, le ricerche archivistiche e bibliografiche sui beni archeologici oggi visibili e su quelli
|
||||||
non più esistenti, la raccolta della cartografia storica, contenuti multimediali e immagini storiche.
|
non più esistenti, la raccolta della cartografia storica, contenuti multimediali e immagini storiche.
|
||||||
</section>
|
</section>
|
||||||
|
</div>
|
||||||
<div class="columns mt-5 has-background-light is-fullwidth">
|
<div class="column"></div>
|
||||||
<div class="column has-text-centered is-one-third has-background-light">
|
</div>
|
||||||
<img class="image" src="img/progetto.jpg" />
|
<div class="level is-fullwidth mb-0 has-background-light">
|
||||||
<a href="" class="button is-link mt-3 is-large has-text-white">
|
<div class="columns mt-5 is-8" style="width: 80vw; margin-left: auto; margin-right: auto">
|
||||||
|
<div class="column card has-text-centered is-one-third"
|
||||||
|
data-id="progetto" data-action="click->modal#homeOpen">
|
||||||
|
<div class="card-image">
|
||||||
|
<img src="img/progetto.jpg" />
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<button class="button is-link mt-3 is-large has-text-white">
|
||||||
Il progetto
|
Il progetto
|
||||||
</a>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="column has-text-centered">
|
|
||||||
<a href="webgis/">
|
|
||||||
<img class="image" src="img/webgis.webp" />
|
|
||||||
</a>
|
|
||||||
<a href="webgis/" class="button is-link mt-3 is-large has-text-white">Accedi al WebGIS</a>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="column card">
|
<div class="column card has-text-centered is-clickable"
|
||||||
|
data-id="webgis" data-action="click->modal#homeOpen">
|
||||||
<div class="card-image">
|
<div class="card-image">
|
||||||
<img class="image" src="" />
|
<img src="img/webgis.jpg" />
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content has-text-centered">
|
<div class="card-content">
|
||||||
<a href="" class="button is-link is-large has-text-white">Cartografia storica</a>
|
<button class="button is-link mt-3 is-large has-text-white">
|
||||||
|
Il WebGIS
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="column card has-text-centered mb-5">
|
||||||
<div class="columns">
|
|
||||||
<div class="column is-one-third card">
|
|
||||||
<div class="card-image">
|
<div class="card-image">
|
||||||
<img class="image" src="" />
|
<img src="img/cartografia.jpg" />
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content has-text-centered">
|
<div class="card-content">
|
||||||
<a href="" class="button is-link is-large has-text-white">Pubblicazioni</a>
|
<a href="" class="button is-link is-large mt-3 has-text-white">Cartografia storica</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="column card">
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="level is-fullwidth mt-0 has-background-light">
|
||||||
|
<div class="columns is-8 pt-6 pb-6" style="width: 80vw; margin-left: auto; margin-right: auto">
|
||||||
|
<div class="column is-one-third card has-text-centered">
|
||||||
<div class="card-image">
|
<div class="card-image">
|
||||||
<img class="image" src="img/credits.webp" />
|
<img src="img/pubblicazioni.jpg" />
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content has-text-centered">
|
<div class="card-content">
|
||||||
<a href="" class="button is-link is-large has-text-white">Credits</a>
|
<a href="" class="button is-link is-large mt-3 has-text-white">Pubblicazioni</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="column card">
|
<div class="column card has-text-centered is-clickable"
|
||||||
|
data-id="credits" data-action="click->modal#homeOpen">
|
||||||
<div class="card-image">
|
<div class="card-image">
|
||||||
<img class="image" src="img/riconoscimenti.webp" />
|
<img src="img/credits.jpg" />
|
||||||
</div>
|
</div>
|
||||||
<div class="card-content has-text-centered">
|
<div class="card-content">
|
||||||
<a href="" class="button is-link is-large has-text-white">Riconoscimenti</a>
|
<button class="button is-link is-large mt-3 has-text-white">Credits</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="column card mb-5 has-text-centered is-clickable"
|
||||||
|
data-id="riconoscimenti" data-action="click->modal#homeOpen">
|
||||||
|
<div class="card-image">
|
||||||
|
<img src="img/riconoscimenti.jpg" />
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<button class="button is-link is-large mt-3 has-text-white">Riconoscimenti</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<section class="section pb-1">
|
</div>
|
||||||
<a id="progetto"></a>
|
</div>
|
||||||
<h3 class="has-text-centered">Il progetto</h3>
|
<div class="modal" data-modal-target="modal" data-id="progetto">
|
||||||
|
<div class="modal-background" data-action="click->modal#homeClose" data-id="progetto"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<h3 class="modal-card-title has-text-centered">Il progetto</h3>
|
||||||
|
<button class="delete" aria-label="close" data-action="modal#homeClose" data-id="progetto"></button>
|
||||||
|
</header>
|
||||||
|
<section class="modal-card-body">
|
||||||
<p class="p-2 mt-2 mb-2">
|
<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.
|
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>
|
||||||
@ -116,9 +144,18 @@
|
|||||||
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.
|
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>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
<section class="section">
|
<footer class="modal-card-foot">
|
||||||
<a id="webgis"></a>
|
</footer>
|
||||||
<h3 class="has-text-centered">Il WebGIS</h3>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal" data-modal-target="modal" data-id="webgis">
|
||||||
|
<div class="modal-background" data-action="click->modal#homeClose" data-id="webgis"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<h3 class="modal-card-title has-text-centered">Il WebGIS</h3>
|
||||||
|
<button class="delete" aria-label="close" data-action="modal#homeClose" data-id="webgis"></button>
|
||||||
|
</header>
|
||||||
|
<section class="modal-card-body">
|
||||||
<p>
|
<p>
|
||||||
Il WebGIS è una tipologia di mappa georeferenziata interattiva presentata
|
Il WebGIS è una tipologia di mappa georeferenziata interattiva presentata
|
||||||
tramite il Web, quindi fruibile attraverso un qualsiasi browser moderno.
|
tramite il Web, quindi fruibile attraverso un qualsiasi browser moderno.
|
||||||
@ -132,39 +169,113 @@
|
|||||||
sviluppo della API (lato server) che interagisce con il database per recuperare le informazioni
|
sviluppo della API (lato server) che interagisce con il database per recuperare le informazioni
|
||||||
e i dati relativi ai punti da visualizzare sulla mappa.
|
e i dati relativi ai punti da visualizzare sulla mappa.
|
||||||
</p>
|
</p>
|
||||||
<p>Il database stesso è stato costruito con il sistema <a href="https://www.postgresql.org/">PostgreSQL</a>, il quale - attraverso l'estensione
|
<p>
|
||||||
|
Il database stesso è stato costruito con il sistema <a href="https://www.postgresql.org/">PostgreSQL</a>, il quale - attraverso l'estensione
|
||||||
<a href="https://postgis.net/">PostGIS</a> - permette di rappresentare dati geografici e geometrici e fornisce un insieme di
|
<a href="https://postgis.net/">PostGIS</a> - permette di rappresentare dati geografici e geometrici e fornisce un insieme di
|
||||||
funzionalità integrate per l'interazione e le operazioni con i dati geometrici, rendendolo quindi
|
funzionalità integrate per l'interazione e le operazioni con i dati geometrici, rendendolo quindi
|
||||||
particolarmente utile per applicazioni <abbr title="Geography Information Systems">GIS</abbr>.
|
particolarmente utile per applicazioni <abbr title="Geography Information Systems">GIS</abbr>.
|
||||||
</p>
|
</p>
|
||||||
<div class="card mt-6">
|
<p class="has-text-centered">
|
||||||
<a href="webgis/">
|
<a href="webgis/" class="button mt-6 is-link is-large has-text-white">Accedi al WebGIS</a>
|
||||||
<img class="image" src="img/webgis.webp" />
|
</p>
|
||||||
|
</section>
|
||||||
|
<footer class="modal-card-foot">
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal" data-modal-target="modal" data-id="credits">
|
||||||
|
<div class="modal-background" data-action="click->modal#homeClose" data-id="credits"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<h3 class="modal-card-title has-text-centered">Credits</h3>
|
||||||
|
<button class="delete" aria-label="close" data-action="modal#homeClose" data-id="credits"></button>
|
||||||
|
</header>
|
||||||
|
<section class="modal-card-body">
|
||||||
|
<article class="media">
|
||||||
|
<figure class="media-left">
|
||||||
|
<p class="image is-128x128">
|
||||||
|
<img src="img/logo-soprintendenza-abap-area-metropolitana-napoli-bianco-e1680166536285.webp" />
|
||||||
|
</p>
|
||||||
|
</figure>
|
||||||
|
<div class="media-content">
|
||||||
|
<div class="content">
|
||||||
|
<p>
|
||||||
|
<strong>
|
||||||
|
<a href="https://sabapmetropolitanana.cultura.gov.it/">
|
||||||
|
Soprintendenza Archeologia Belle Arti e Paesaggio per l'Area Metropolitana di Napoli
|
||||||
</a>
|
</a>
|
||||||
<div class="card-content has-text-centered">
|
</strong>
|
||||||
<a href="webgis/" class="button is-link is-large has-text-white">Accedi al WebGIS</a>
|
<br />
|
||||||
|
Direzione scientifica
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</article>
|
||||||
<section class="section">
|
<article class="media">
|
||||||
<a id="riconoscimenti"></a>
|
<figure class="media-left">
|
||||||
<h2 class="m-4 has-text-centered">Riconoscimenti</h2>
|
<p class="image is-128x128">
|
||||||
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et sed quidem atque? Delectus, blanditiis sint. Numquam tempora nemo perferendis ea modi. Pariatur voluptatibus ut consequatur? Sit reprehenderit in accusantium delectus.</p>
|
<img src="img/logo_ispc_compatto.png" />
|
||||||
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et sed quidem atque? Delectus, blanditiis sint. Numquam tempora nemo perferendis ea modi. Pariatur voluptatibus ut consequatur? Sit reprehenderit in accusantium delectus.</p>
|
</p>
|
||||||
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et sed quidem atque? Delectus, blanditiis sint. Numquam tempora nemo perferendis ea modi. Pariatur voluptatibus ut consequatur? Sit reprehenderit in accusantium delectus.</p>
|
</figure>
|
||||||
</section>
|
<div class="media-content">
|
||||||
<section class="section has-text-centered">
|
<div class="content">
|
||||||
<a id="credits"></a>
|
<p>
|
||||||
<h2 class="m-2">Credits</h2>
|
<strong><a href="https://ispc.cnr.it">CNR-ISPC</a></strong>
|
||||||
<h3 class="is-size-3">CNR ISPC</h3>
|
<br />
|
||||||
<p>Cecilia Giorgi</p>
|
Rilievo archeologico con analisi delle murature, schedatura e studio delle emergenze indagate,
|
||||||
<p>Giovanni Caratelli</p>
|
documentazione grafica archeologica di cartografie, planimetrie, prospetti e sezioni,
|
||||||
<p>Nicolò Paraciani</p>
|
modellazione 3D e video, creazione del <a href="webgis/">WebGIS</a> (elaborazione, struttura
|
||||||
<h3 class="is-size-3">Soprintendenza ecc...</h3>
|
logica dei contenuti, architettura e sviluppo software, grafica), ricerche bibliografiche,
|
||||||
<p>Giancarlo Di Martino</p>
|
raccolta e georeferenziazione dei vincoli archeologici e paesaggistici.
|
||||||
</section>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="column"></div>
|
</div>
|
||||||
|
</article>
|
||||||
|
<article class="media">
|
||||||
|
<figure class="media-left">
|
||||||
|
<p class="image is-128x128">
|
||||||
|
<img src="img/logo_apragopolis.jpg" />
|
||||||
|
</p>
|
||||||
|
</figure>
|
||||||
|
<div class="media-content">
|
||||||
|
<div class="content">
|
||||||
|
<p>
|
||||||
|
<strong>Associazione Culturale Apragopolis</strong>
|
||||||
|
<br />
|
||||||
|
Ricerche archivistiche e bibliografiche, schedatura dei siti e rinvenimenti archeologici, incarichi
|
||||||
|
a professionisti per rilievi subacquei e ricostruzioni virtuali, organizzazione di convegni e curatela
|
||||||
|
di pubblicazioni inerenti lo studio archeologico dell’isola.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</section>
|
||||||
|
<footer class="modal-card-foot">
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal" data-modal-target="modal" data-id="riconoscimenti">
|
||||||
|
<div class="modal-background" data-action="click->modal#homeClose" data-id="riconoscimenti"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<h3 class="modal-card-title has-text-centered">Riconoscimenti</h3>
|
||||||
|
<button class="delete" aria-label="close" data-action="modal#homeClose" data-id="riconoscimenti"></button>
|
||||||
|
</header>
|
||||||
|
<section class="modal-card-body">
|
||||||
|
<p>
|
||||||
|
Il progetto della carta archeologica dell’isola di Capri è stato realizzato con il contributo dei
|
||||||
|
Comuni di Capri e Anacapri, i convegni internazionali e i relativi volumi sono stati svolti e pubblicati
|
||||||
|
con il sostegno della Direzione Generale Educazione, Ricerca e Istituti Culturali e del Porto Turistico di Capri.
|
||||||
|
</p>
|
||||||
|
<p class="has-text-centered mt-5">
|
||||||
|
<img src="img/logo direzione generale ricerca.png">
|
||||||
|
</p>
|
||||||
|
<p class="has-text-centered mt-5">
|
||||||
|
<img src="img/logo porto turistico.png">
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
<footer class="modal-card-foot">
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -175,5 +286,12 @@
|
|||||||
const year = new Date().getFullYear();
|
const year = new Date().getFullYear();
|
||||||
document.getElementById('c-year').innerText = year;
|
document.getElementById('c-year').innerText = year;
|
||||||
</script>
|
</script>
|
||||||
|
<script type="module">
|
||||||
|
import { Application } from '@hotwired/stimulus';
|
||||||
|
import ModalController from './webgis/js/controllers/modal_controller.js';
|
||||||
|
|
||||||
|
window.Stimulus = Application.start();
|
||||||
|
Stimulus.register("modal", ModalController);
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 6.5 KiB After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 20 KiB |
@ -2,7 +2,7 @@ import { Controller } from "@hotwired/stimulus"
|
|||||||
|
|
||||||
export default class extends Controller {
|
export default class extends Controller {
|
||||||
static targets = ['coords'];
|
static targets = ['coords'];
|
||||||
END_ZOOM = 20;
|
END_ZOOM = 19;
|
||||||
mapAnimate = {
|
mapAnimate = {
|
||||||
animate: true,
|
animate: true,
|
||||||
duration: 1,
|
duration: 1,
|
||||||
|
|||||||
@ -3,6 +3,24 @@ import { Controller } from "@hotwired/stimulus"
|
|||||||
export default class extends Controller {
|
export default class extends Controller {
|
||||||
static targets = ['close', 'modal'];
|
static targets = ['close', 'modal'];
|
||||||
|
|
||||||
|
current(id) {
|
||||||
|
return this.modalTargets.find(m => m.getAttribute('data-id') === id);
|
||||||
|
}
|
||||||
|
|
||||||
|
homeOpen(event) {
|
||||||
|
const id = event.currentTarget.getAttribute('data-id');
|
||||||
|
const current = this.current(id);
|
||||||
|
|
||||||
|
current.classList.add('is-active');
|
||||||
|
}
|
||||||
|
|
||||||
|
homeClose(event) {
|
||||||
|
const id = event.currentTarget.getAttribute('data-id');
|
||||||
|
const current = this.current(id);
|
||||||
|
|
||||||
|
current.classList.remove('is-active');
|
||||||
|
}
|
||||||
|
|
||||||
open() {
|
open() {
|
||||||
this.modalTarget.classList.add('is-active');
|
this.modalTarget.classList.add('is-active');
|
||||||
}
|
}
|
||||||
|
|||||||
@ -100,7 +100,7 @@ function capitalize(text) {
|
|||||||
/**
|
/**
|
||||||
* @param {string} mapId
|
* @param {string} mapId
|
||||||
* @param {number} zoomLevel
|
* @param {number} zoomLevel
|
||||||
* @returns {{map: Map, sites: Layer}}
|
* @returns {Map}
|
||||||
*/
|
*/
|
||||||
GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
||||||
L.LayerGroup.include({
|
L.LayerGroup.include({
|
||||||
@ -115,7 +115,7 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
|||||||
|
|
||||||
let map = L.map(mapId, {
|
let map = L.map(mapId, {
|
||||||
//attributionControl: false,
|
//attributionControl: false,
|
||||||
minZoom: 2,
|
minZoom: 11,
|
||||||
}).setView(this.CENTER_COORDS, zoomLevel);
|
}).setView(this.CENTER_COORDS, zoomLevel);
|
||||||
|
|
||||||
map.crs = L.CRS.EPSG4326;
|
map.crs = L.CRS.EPSG4326;
|
||||||
@ -146,16 +146,12 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
|||||||
notConservedGroup.addTo(map);
|
notConservedGroup.addTo(map);
|
||||||
findingsGroup.addTo(map);
|
findingsGroup.addTo(map);
|
||||||
|
|
||||||
L.control.layers(
|
L.control.layers(baseMap, archeo).addTo(map);
|
||||||
baseMap,
|
|
||||||
archeo,
|
|
||||||
).addTo(map);
|
|
||||||
|
|
||||||
// TEMP!! Remove point for Lo Pozzo...
|
// TEMP!! Remove point for Lo Pozzo...
|
||||||
map.removeLayer(sitesGroup.customGetLayer('lopozzo'));
|
map.removeLayer(sitesGroup.customGetLayer('lopozzo'));
|
||||||
|
|
||||||
// TODO Horrible?
|
return map;
|
||||||
return {map: map, sites: sitesGroup};
|
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* Create markers for sites
|
* Create markers for sites
|
||||||
@ -164,7 +160,8 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
|
|||||||
*/
|
*/
|
||||||
GIS.sitesMarkers = async function (sitesGroup) {
|
GIS.sitesMarkers = async function (sitesGroup) {
|
||||||
let sitesMarkers = L.markerClusterGroup({
|
let sitesMarkers = L.markerClusterGroup({
|
||||||
showCoverageOnHover: false
|
showCoverageOnHover: false,
|
||||||
|
disableClusteringAtZoom: 19,
|
||||||
});
|
});
|
||||||
|
|
||||||
for (let id in MARKER_NAMES.sites) {
|
for (let id in MARKER_NAMES.sites) {
|
||||||
@ -207,7 +204,8 @@ GIS.notConserved = async function () {
|
|||||||
.then(data => data.json());
|
.then(data => data.json());
|
||||||
|
|
||||||
let notConserved = L.markerClusterGroup({
|
let notConserved = L.markerClusterGroup({
|
||||||
showCoverageOnHover: false
|
showCoverageOnHover: false,
|
||||||
|
disableClusteringAtZoom: 19,
|
||||||
});
|
});
|
||||||
|
|
||||||
for (let record of notConserData.records) {
|
for (let record of notConserData.records) {
|
||||||
@ -233,7 +231,8 @@ GIS.findings = async function () {
|
|||||||
.then(data => data.json());
|
.then(data => data.json());
|
||||||
|
|
||||||
let findings = L.markerClusterGroup({
|
let findings = L.markerClusterGroup({
|
||||||
showCoverageOnHover: false
|
showCoverageOnHover: false,
|
||||||
|
disableClusteringAtZoom: 19,
|
||||||
});
|
});
|
||||||
|
|
||||||
for (let record of findingsData) {
|
for (let record of findingsData) {
|
||||||
|
|||||||
@ -12,9 +12,8 @@ document.addEventListener('DOMContentLoaded', async () => {
|
|||||||
initStimulus();
|
initStimulus();
|
||||||
|
|
||||||
let progress = document.querySelector('progress');
|
let progress = document.querySelector('progress');
|
||||||
const init = await GIS.initMap('map');
|
const map = await GIS.initMap('map');
|
||||||
progress.classList.add('is-hidden');
|
progress.classList.add('is-hidden');
|
||||||
let {map, sites} = init;
|
|
||||||
|
|
||||||
map._container.setAttribute('aria-busy', false);
|
map._container.setAttribute('aria-busy', false);
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user