feat(geo_map): add option to remove from map

This commit is contained in:
Elian Doran 2025-01-22 19:33:53 +02:00
parent dbd38ecedf
commit 2e1ad24584
No known key found for this signature in database
5 changed files with 43 additions and 10 deletions

View File

@ -193,6 +193,11 @@ export type CommandMappings = {
setZoomFactorAndSave: {
zoomFactor: string;
}
// Geomap
deleteFromMap: {
noteId: string;
}
};
type EventMappings = {

View File

@ -31,6 +31,7 @@ export interface MenuCommandItem<T extends CommandNames> {
export type MenuItem<T extends CommandNames> = MenuCommandItem<T> | MenuSeparatorItem;
export type MenuHandler<T extends CommandNames> = (item: MenuCommandItem<T>, e: JQuery.MouseDownEvent<HTMLElement, undefined, HTMLElement, HTMLElement>) => void;
export type ContextMenuEvent = PointerEvent | MouseEvent | JQuery.ContextMenuEvent;
class ContextMenu {
private $widget: JQuery<HTMLElement>;

View File

@ -1,9 +1,9 @@
import { t } from "../services/i18n.js";
import contextMenu from "./context_menu.js";
import contextMenu, { type ContextMenuEvent } from "./context_menu.js";
import appContext from "../components/app_context.js";
import type { ViewScope } from "../services/link.js";
function openContextMenu(notePath: string, e: PointerEvent | MouseEvent | JQuery.ContextMenuEvent, viewScope: ViewScope = {}, hoistedNoteId: string | null = null) {
function openContextMenu(notePath: string, e: ContextMenuEvent, viewScope: ViewScope = {}, hoistedNoteId: string | null = null) {
contextMenu.show({
x: e.pageX,
y: e.pageY,

View File

@ -9,6 +9,7 @@ import type { EventData } from "../../components/app_context.js";
import { t } from "../../services/i18n.js";
import attributes from "../../services/attributes.js";
import asset_path from "../../../../services/asset_path.js";
import openContextMenu from "./geo_map_context_menu.js";
const TPL = `\
<div class="note-detail-geo-map note-detail-printable">
@ -178,12 +179,10 @@ export default class GeoMapTypeWidget extends TypeWidget {
const [ lat, lng ] = latLng.split(",", 2).map((el) => parseFloat(el));
const icon = L.divIcon({
html: `\
<a data-href="#${childNote.noteId}">
<img class="icon" src="${asset_path}/node_modules/leaflet/dist/images/marker-icon.png" />
<img class="icon-shadow" src="${asset_path}/node_modules/leaflet/dist/images/marker-shadow.png" />
<span class="bx ${childNote.getIcon()}"></span>
<span class="title-label">${childNote.title}</span>
</a>`,
<img class="icon" src="${asset_path}/node_modules/leaflet/dist/images/marker-icon.png" />
<img class="icon-shadow" src="${asset_path}/node_modules/leaflet/dist/images/marker-shadow.png" />
<span class="bx ${childNote.getIcon()}"></span>
<span class="title-label">${childNote.title}</span>`,
iconSize: [ 25, 41 ],
iconAnchor: [ 12, 41 ]
})
@ -198,6 +197,11 @@ export default class GeoMapTypeWidget extends TypeWidget {
.on("moveend", e => {
this.moveMarker(childNote.noteId, (e.target as Marker).getLatLng());
});
marker.on("contextmenu", (e) => {
openContextMenu(childNote.noteId, e.originalEvent);
});
this.currentMarkerData[childNote.noteId] = marker;
}
}
@ -228,8 +232,9 @@ export default class GeoMapTypeWidget extends TypeWidget {
this.#changeState(State.Normal);
}
async moveMarker(noteId: string, latLng: LatLng) {
await attributes.setLabel(noteId, LOCATION_ATTRIBUTE, [latLng.lat, latLng.lng].join(","));
async moveMarker(noteId: string, latLng: LatLng | null) {
const value = (latLng ? [latLng.lat, latLng.lng].join(",") : "");
await attributes.setLabel(noteId, LOCATION_ATTRIBUTE, value);
}
getData(): any {
@ -289,4 +294,8 @@ export default class GeoMapTypeWidget extends TypeWidget {
}
}
deleteFromMapEvent({ noteId }: EventData<"deleteFromMap">) {
this.moveMarker(noteId, null);
}
}

View File

@ -0,0 +1,18 @@
import appContext from "../../components/app_context.js";
import type { ContextMenuEvent } from "../../menus/context_menu.js";
import contextMenu from "../../menus/context_menu.js";
export default function openContextMenu(noteId: string, e: ContextMenuEvent) {
contextMenu.show({
x: e.pageX,
y: e.pageY,
items: [
{ title: "Remove from map", command: "deleteFromMap", uiIcon: "bx bx-trash" }
],
selectMenuItemHandler: ({ command }) => {
if (command) {
appContext.triggerCommand(command, { noteId });
}
}
});
}