feat(RegionMap): add context menu for background clicks to show nearest system
This commit is contained in:
@@ -482,6 +482,45 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
|
|||||||
});
|
});
|
||||||
}, [viewBox]);
|
}, [viewBox]);
|
||||||
|
|
||||||
|
const handleBackgroundContextMenu = (e: React.MouseEvent) => {
|
||||||
|
if (!svgRef.current || systems.size === 0) return;
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
|
||||||
|
// Convert click to SVG coordinates
|
||||||
|
const pt = svgRef.current.createSVGPoint();
|
||||||
|
pt.x = e.clientX;
|
||||||
|
pt.y = e.clientY;
|
||||||
|
const svgPoint = pt.matrixTransform(svgRef.current.getScreenCTM()!.inverse());
|
||||||
|
const clickX = svgPoint.x;
|
||||||
|
const clickY = svgPoint.y;
|
||||||
|
|
||||||
|
// Find nearest system by Euclidean distance in SVG space
|
||||||
|
let nearestName: string | null = null;
|
||||||
|
let nearestDist2 = Number.POSITIVE_INFINITY;
|
||||||
|
systems.forEach((sys, name) => {
|
||||||
|
const pos = positions[name];
|
||||||
|
if (!pos) return;
|
||||||
|
const dx = pos.x - clickX;
|
||||||
|
const dy = pos.y - clickY;
|
||||||
|
const d2 = dx * dx + dy * dy;
|
||||||
|
if (d2 < nearestDist2) {
|
||||||
|
nearestDist2 = d2;
|
||||||
|
nearestName = name;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (nearestName) {
|
||||||
|
const sys = systems.get(nearestName)!;
|
||||||
|
// Place the menu at the system's on-screen position
|
||||||
|
const pt2 = svgRef.current.createSVGPoint();
|
||||||
|
pt2.x = positions[nearestName]!.x;
|
||||||
|
pt2.y = positions[nearestName]!.y;
|
||||||
|
const screenPoint = pt2.matrixTransform(svgRef.current.getScreenCTM()!);
|
||||||
|
setContextMenu({ x: screenPoint.x, y: screenPoint.y, system: sys });
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const handleContextMenu = (e: React.MouseEvent, system: System) => {
|
const handleContextMenu = (e: React.MouseEvent, system: System) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
@@ -623,6 +662,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
|
|||||||
onMouseLeave={handleMouseUp}
|
onMouseLeave={handleMouseUp}
|
||||||
onWheel={handleWheel}
|
onWheel={handleWheel}
|
||||||
onDoubleClick={handleMapDoubleClick}
|
onDoubleClick={handleMapDoubleClick}
|
||||||
|
onContextMenu={handleBackgroundContextMenu}
|
||||||
>
|
>
|
||||||
<defs>
|
<defs>
|
||||||
<filter id="glow">
|
<filter id="glow">
|
||||||
|
Reference in New Issue
Block a user