kevinsivic/dawarich
1
0
Fork 0
mirror of https://github.com/Freika/dawarich.git synced 2026-01-14 11:11:38 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Make popups a bit nicer

Browse source
This commit is contained in:
Eugene Burmakin 2025-02-08 12:08:01 +01:00
parent 51724db874
commit 3a555065d3
2 changed files with 5 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/javascript/controllers/maps_controller.js
View file

@ -112,7 +112,7 @@ export default class extends Controller {
this.map.getPane('areasPane').style.pointerEvents = 'all';
// Initialize areasLayer as a feature group and add it to the map immediately
this.areasLayer = new L.FeatureGroup().addTo(this.map);
this.areasLayer = new L.FeatureGroup();
this.photoMarkers = L.layerGroup();
this.setupScratchLayer(this.countryCodesMap);
@ -585,7 +585,6 @@ export default class extends Controller {
const layer = event.layer;
if (event.layerType === 'circle') {
console.log("Circle created, opening popup..."); // Add debug log
try {
// Add the layer to the map first
layer.addTo(this.map);

11
app/javascript/maps/areas.js
View file

@ -6,14 +6,11 @@ export function handleAreaCreated(areasLayer, layer, apiKey) {
const center = layer.getLatLng();
const formHtml = `
<div class="card w-96 bg-base-100 shadow-xl">
<div class="card w-96">
<div class="card-body">
<h2 class="card-title">New Area</h2>
<form id="circle-form" class="space-y-4">
<div class="form-control">
<label for="circle-name" class="label">
<span class="label-text">Area Name</span>
</label>
<input type="text"
id="circle-name"
name="area[name]"
@ -27,7 +24,7 @@ export function handleAreaCreated(areasLayer, layer, apiKey) {
<input type="hidden" name="area[radius]" value="${radius}">
<div class="flex justify-between mt-4">
<button type="button"
class="btn btn-ghost"
class="btn btn-outline"
onclick="this.closest('.leaflet-popup').querySelector('.leaflet-popup-close-button').click()">
Cancel
</button>
@ -211,13 +208,13 @@ export function fetchAndDrawAreas(areasLayer, apiKey) {
// Bind popup content
const popupContent = `
<div class="card w-96 bg-base-100">
<div class="card w-full">
<div class="card-body">
<h2 class="card-title">${area.name}</h2>
<p>Radius: ${Math.round(radius)} meters</p>
<p>Center: [${lat.toFixed(4)}, ${lng.toFixed(4)}]</p>
<div class="flex justify-end mt-4">
<button class="btn btn-error delete-area" data-id="${area.id}">Delete</button>
<button class="btn btn-sm btn-error delete-area" data-id="${area.id}">Delete</button>
</div>
</div>
</div>