Adjust active layers + refine menu

This commit is contained in:
Nicolò P 2024-06-12 10:56:14 +02:00
parent b610ecef54
commit 72f90fff47
4 changed files with 25 additions and 9 deletions

View File

@ -33,13 +33,20 @@
<div class="main columns">
<div class="column is-hidden" id="menu">
<aside class="menu ml-4">
<p class="menu-label">Siti indagati</p>
<p class="menu-label">
Siti indagati
<button title="Chiudi menu" class="button is-small is-pulled-right" id="close-menu">
<span class="icon is-small">
<i class="fa fa-chevron-left"></i>
</span>
</button>
</p>
<ul class="menu-list">
<li>
<a class="button" id="gradola">
<a class="button" title="Vai al sito Villa di Gradola" id="gradola">
Villa di Gradola
</a>
<a class="button" id="matermania">
<a class="button" title="Vai al sito Grotta di Matermania" id="matermania">
Grotta di Matermania
</a>
<a class="button" id="arsenale">

View File

@ -9,7 +9,7 @@ import UI from "./ui.js";
const GIS = {};
GIS.CENTER_COORDS = [40.5492, 14.2317];
GIS.INIT_ZOOM = 14.5;
GIS.INIT_ZOOM = 14;
const optionsVincoli = {
color: '#222',
opacity: 0.8,
@ -89,14 +89,21 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
// TODO Horrible?
return {map: map, sites: sitesGroup};
}
/**
* Adds layers to map and returns an object
* with {baseMap, archeoLayers, sitesLayerGroup}
*
* @param {L.Map} map
* @returns {{baseMap: {"OpenStreetMap": L.TileLayer}, archeo: object, sitesGroup: L.LayerGroup}}
*/
GIS.initLayers = async function(map) {
let layerMater = await this.loadLayer('matermania.geojson', optionsSiti, false);
let layerArsenale = await this.loadLayer('arsenale_planim.geojson', optionsSiti, false);
let layerArsenale = await this.loadLayer('arsenale.geojson', optionsSiti, false);
let layerGradola = await this.loadLayer('gradola.geojson', optionsSiti, false);
layerMater.id = 'matermania';
layerGradola.id = 'gradola';
layerArsenale.id = 'arsenale_planim';
layerArsenale.id = 'arsenale';
let layerVincoli = await this.loadLayer('vincoli.geojson', optionsVincoli);
// TODO named parameters??
let layerPaesistici = await this.loadLayer('paesistici.geojson', optionsPaesistici);
@ -107,11 +114,11 @@ GIS.initLayers = async function(map) {
});
const sitesGroup = new L.LayerGroup([layerMater, layerGradola, layerArsenale]);
const baseGroup = new L.LayerGroup([osmap, layerVincoli, layerPaesistici]);
const baseGroup = new L.LayerGroup([osmap]);
baseGroup.addTo(map);
sitesGroup.addTo(map);
const baseMap = {
"Mappa di base (OpenStreetMap)" : osmap
"OpenStreetMap" : osmap
};
const archeo = {
"Villa di Gradola" : layerGradola,

View File

@ -97,8 +97,10 @@ UI.openModal = async function (data) {
* @param {L.LayerGroup} sites
*/
UI.sitesMenu = function (menuListSel, map, sites) {
const menu = document.querySelector(menuListSel);
// Close menu if arrow button is clicked...
this.toggleMenu('close-menu');
const menu = document.querySelector(menuListSel);
menu.addEventListener('click', event => {
if (event.target.nodeName === 'A') {
// zoom to layer...