Enhance map functionality with bookmark features and UI improvements

- Introduced a new MapBookmarkNameModal for adding and editing bookmarks.
- Updated MapView to manage selected markers for bookmarking and handle bookmark name submissions.
- Enhanced MapContextMenu with an option to add markers to bookmarks.
- Improved MapBookmarks component to support editing bookmark names and adding selected markers.
- Refactored MapControls and MapControlsContent to integrate selected marker functionality for bookmarks.
- Updated useMapBookmarks composable to include bookmark updating logic.
- Removed unused grid coordinates toggle from the UI for a cleaner interface.
This commit is contained in:
2026-03-03 20:05:42 +03:00
parent d27eb2651e
commit 52c34ef8f2
15 changed files with 425 additions and 244 deletions

View File

@@ -1,6 +1,5 @@
import type L from 'leaflet'
import { GridCoordLayer, HnHCRS, HnHMaxZoom, HnHMinZoom, TileSize } from '~/lib/LeafletCustomTypes'
import type { GridCoordLayerOptions } from '~/lib/LeafletCustomTypes'
import { HnHCRS, HnHMaxZoom, HnHMinZoom, TileSize } from '~/lib/LeafletCustomTypes'
import { SmartTileLayer } from '~/lib/SmartTileLayer'
import type { MapInfo } from '~/types/api'
@@ -35,7 +34,6 @@ export interface MapInitResult {
map: L.Map
layer: SmartTileLayerInstance
overlayLayer: SmartTileLayerInstance
coordLayer: L.GridLayer
markerLayer: L.LayerGroup
backendBase: string
}
@@ -95,19 +93,6 @@ export async function initLeafletMap(
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII='
overlayLayer.addTo(map)
// Not added to map here — added in MapView when user enables "Show grid coordinates"
// so createTile() always runs with visible: true and labels render (no empty tiles from init).
const coordLayer = new GridCoordLayer({
tileSize: TileSize,
minZoom: HnHMinZoom,
maxZoom: HnHMaxZoom,
opacity: 0,
visible: false,
pane: 'tilePane',
updateWhenIdle: true,
keepBuffer: 4,
} as GridCoordLayerOptions)
const markerLayer = L.layerGroup()
markerLayer.addTo(map)
markerLayer.setZIndex(600)
@@ -122,5 +107,5 @@ export async function initLeafletMap(
}
preloadMarkerIcons(resolvePath)
return { map, layer, overlayLayer, coordLayer, markerLayer, backendBase }
return { map, layer, overlayLayer, markerLayer, backendBase }
}