diff --git a/src/public/app/components/app_context.ts b/src/public/app/components/app_context.ts index fa20630ec..b15e075b6 100644 --- a/src/public/app/components/app_context.ts +++ b/src/public/app/components/app_context.ts @@ -193,6 +193,11 @@ export type CommandMappings = { setZoomFactorAndSave: { zoomFactor: string; } + + // Geomap + deleteFromMap: { + noteId: string; + } }; type EventMappings = { diff --git a/src/public/app/menus/context_menu.ts b/src/public/app/menus/context_menu.ts index 058178afc..de0fcf38a 100644 --- a/src/public/app/menus/context_menu.ts +++ b/src/public/app/menus/context_menu.ts @@ -31,6 +31,7 @@ export interface MenuCommandItem { export type MenuItem = MenuCommandItem | MenuSeparatorItem; export type MenuHandler = (item: MenuCommandItem, e: JQuery.MouseDownEvent) => void; +export type ContextMenuEvent = PointerEvent | MouseEvent | JQuery.ContextMenuEvent; class ContextMenu { private $widget: JQuery; diff --git a/src/public/app/menus/link_context_menu.ts b/src/public/app/menus/link_context_menu.ts index 3343ec85e..efa4da67e 100644 --- a/src/public/app/menus/link_context_menu.ts +++ b/src/public/app/menus/link_context_menu.ts @@ -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, diff --git a/src/public/app/widgets/type_widgets/geo_map.ts b/src/public/app/widgets/type_widgets/geo_map.ts index 027faf559..5dd9af475 100644 --- a/src/public/app/widgets/type_widgets/geo_map.ts +++ b/src/public/app/widgets/type_widgets/geo_map.ts @@ -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 = `\
@@ -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: `\ - - - - - ${childNote.title} - `, + + + + ${childNote.title}`, 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); + } + } diff --git a/src/public/app/widgets/type_widgets/geo_map_context_menu.ts b/src/public/app/widgets/type_widgets/geo_map_context_menu.ts new file mode 100644 index 000000000..ef35f06e5 --- /dev/null +++ b/src/public/app/widgets/type_widgets/geo_map_context_menu.ts @@ -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 }); + } + } + }); +}