mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-11-14 08:11:03 +00:00
Maurice
03d6457bde
PAD-05B: a click on an obstacle on the map or on the route band opens its card in the look of the via ferrata card: the kind with its glyph, the name, how it stands to the route (on it at a distance along it, near it with the link marked unclear, or only in the area), the paddling rule its tags give with canoe read before boat, a condition as written, height, grade, hours and fees, the source with the date of the data and the OpenStreetMap link. A missing rule reads as unknown, never as allowed, and a portage way recorded as private says so. Objects only in the area show from zoom 13 on, on Leaflet and GL alike; on GL the lines only near the route are dashed as on Leaflet, one click handler picks the marker over the line, and a picked marker no longer flickers. The route band marks the obstacles on and near the route by their share of the measured line. The obstacle notice also names an answer cut at its limit. PAD-05A: the admin area gets a Paddle water data card under the addons, on desktop and phone: a search in Geofabrik's list with each region's path, the regions with their state (waiting, reading with its progress, ready with objects and data date, failed with the reason), reading again and removing after a confirmation. The list follows a read without reloading. Region changes write audit rows. Map colours of paddle objects and portages come from theme tokens read at draw time, as the via ferratas do; the ferrata layer now shares that reader. The rail takes the planner page's parts as one bag, the map hit tests of the tour layers are one helper, and the unused noWaterData string is gone from every locale.
64 lines
2.1 KiB
TypeScript
64 lines
2.1 KiB
TypeScript
import { useRef } from 'react';
|
|
|
|
import { useMapCardDismiss } from '../Map/useMapCardDismiss';
|
|
import FerrataDetailCard from './FerrataDetailCard';
|
|
import type { FerrataGroup } from './ferrataGroups';
|
|
import type { FerrataSelection } from './useFerrataMapLayer';
|
|
|
|
/**
|
|
* The picked ferrata's card over the map, anchored at the bottom of the inline
|
|
* end, above the row of map controls. `insetEnd` is what the panel on that
|
|
* side covers plus the gap the layer pill keeps to the panel on the other, so
|
|
* the card mirrors the pill and never slides under the panel; `bottom` clears
|
|
* the control row (the layer pill on the flat map, the dock and the grade
|
|
* legend in 3D).
|
|
*
|
|
* It closes on a press anywhere outside it and on Escape. A press on another
|
|
* ferrata closes this card first and the click then opens that one's. The
|
|
* press outside is handed to `onOutsidePress` as well, so the map under it can
|
|
* leave the click that follows alone (see `useOutsidePressGuard`).
|
|
*/
|
|
export default function FerrataDetailOverlay({
|
|
selection,
|
|
onClose,
|
|
onOutsidePress,
|
|
insetEnd,
|
|
bottom,
|
|
width,
|
|
onAdopt,
|
|
onTourIds,
|
|
}: {
|
|
selection: FerrataSelection | null;
|
|
onClose: () => void;
|
|
onOutsidePress?: () => void;
|
|
insetEnd: number;
|
|
bottom: number;
|
|
/** A fixed width, to match what the card stands on (the grade legend in 3D). */
|
|
width?: number;
|
|
onAdopt?: (group: FerrataGroup) => void;
|
|
/** The ferratas the tour on the map already climbs. */
|
|
onTourIds?: ReadonlySet<string>;
|
|
}) {
|
|
const ref = useRef<HTMLDivElement>(null);
|
|
useMapCardDismiss(ref, !!selection, onClose, onOutsidePress);
|
|
|
|
if (!selection) return null;
|
|
return (
|
|
<div
|
|
ref={ref}
|
|
className="absolute z-[20] flex justify-end transition-[bottom] duration-200 ease-out"
|
|
style={{ insetInlineEnd: insetEnd, bottom, maxWidth: `calc(100% - ${insetEnd + 32}px)` }}
|
|
data-testid="ferrata-detail-overlay"
|
|
>
|
|
<FerrataDetailCard
|
|
group={selection.group}
|
|
segment={selection.segment}
|
|
onClose={onClose}
|
|
onAdopt={onAdopt}
|
|
onTour={onTourIds?.has(selection.group.id) ?? false}
|
|
width={width}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|