127 lines
4.1 KiB
JavaScript
127 lines
4.1 KiB
JavaScript
let map = null;
|
|
let points = [];
|
|
//BOLOGNA
|
|
const x = 11.343095841047235;
|
|
const y = 44.49373478876318;
|
|
const piazzaMaggiore = [x, y];
|
|
|
|
var lat = 0;
|
|
var lng = 0;
|
|
|
|
// COORDS ESISTENTI
|
|
async function downloadRusco() {
|
|
const resp = await window.fetch("/rusco.geojson");
|
|
const rusco = await resp.json();
|
|
return rusco.features;
|
|
}
|
|
// SET VIEW
|
|
async function initMap() {
|
|
map = L.map("map").setView([44.49593478876318, 11.343095841047235], 13.5);
|
|
|
|
// IMPOSTA MAPPA
|
|
L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
|
attribution: "© OpenStreetMap contributors | RuscoMap",
|
|
}).addTo(map);
|
|
|
|
loadMarkers();
|
|
map.on("click", function (e) {
|
|
lat = e.latlng.lat;
|
|
lng = e.latlng.lng;
|
|
document.getElementById("latitudeValue").textContent = lat;
|
|
document.getElementById("longitudeValue").textContent = lng;
|
|
// Bind a popup to the marker
|
|
showModal("modalAddMarker");
|
|
});
|
|
setInterval(loadMarkers, 60000);
|
|
}
|
|
|
|
async function loadMarkers() {
|
|
fetch("http://localhost:3000/getRuschi")
|
|
.then((response) => response.json())
|
|
.then((data) => {
|
|
console.log(data);
|
|
data.forEach((rusco) => {
|
|
map.addMarker(rusco);
|
|
});
|
|
|
|
// L.geoJSON(data, {
|
|
// onEachFeature: function (feature, layer) {
|
|
// layer.bindPopup('<h2>' +
|
|
// feature.properties.Nome + '</h2><p>' + feature.properties.Descrizione + '</p><img src="' + feature.properties.Foto + '" alt="Photo" style="width:200px;height:auto;">');
|
|
// }
|
|
// }).addTo(map);
|
|
// });
|
|
});
|
|
}
|
|
|
|
// SEGUENZA EXEC
|
|
async function load() {
|
|
points = await downloadRusco();
|
|
await initMap();
|
|
}
|
|
|
|
function showModal(modalName) {
|
|
const selectedModal = document.getElementById(modalName);
|
|
const modalOverlay = document.getElementById("modalOverlay");
|
|
selectedModal.style.display = "block"; // Show the modal
|
|
modalOverlay.style.display = "block"; // Show the overlay
|
|
}
|
|
|
|
function detectCurrentShownModal() {
|
|
const modalAddMarker = document.getElementById("modalAddMarker");
|
|
const modalSign = document.getElementById("modalSign");
|
|
return modalAddMarker.style.display !== "none" ? modalAddMarker : modalSign;
|
|
}
|
|
|
|
function closeModal() {
|
|
const currentShownModal = detectCurrentShownModal();
|
|
const modalOverlay = document.getElementById("modalOverlay");
|
|
currentShownModal.style.display = "none";
|
|
modalOverlay.style.display = "none";
|
|
}
|
|
|
|
function addMarker() {
|
|
const name = document.getElementById("name").value;
|
|
const description = document.getElementById("description").value;
|
|
const imageUrl = document.getElementById("photo").value;
|
|
const latitude = document.getElementById("latitude").value;
|
|
const longitude = document.getElementById("longitude").value;
|
|
fetch("http://localhost:3000/addRuschi", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({
|
|
name: name,
|
|
description: description,
|
|
imageUrl: imageUrl,
|
|
latitude: latitude,
|
|
longitude: longitude,
|
|
}),
|
|
})
|
|
.then((response) => {
|
|
if (response.ok) {
|
|
// Authentication successful
|
|
console.log("Added marker");
|
|
// Redirect the user to the authenticated area or perform other actions
|
|
} else {
|
|
// Authentication failed
|
|
console.error("Error adding marker");
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.error("Error adding marker", error);
|
|
});
|
|
closeModalAddMarker();
|
|
}
|
|
|
|
window.addEventListener("load", load);
|
|
|
|
const showAddMarkerModal = document.getElementById("showAddMarkerModal");
|
|
showAddMarkerModal.addEventListener("click", () => showModal("modalAddMarker"));
|
|
|
|
const showModalSign = document.getElementById("showModalSign");
|
|
showModalSign.addEventListener("click", () => showModal("modalSign"));
|
|
|
|
const modalOverlay = document.getElementById("modalOverlay");
|
|
modalOverlay.addEventListener("click", closeModal);
|