steven/gpx.studio
1
0
Fork 0
mirror of https://github.com/gpxstudio/gpx.studio.git synced 2025-08-31 15:43:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

copy coordinates button for POIs, closes #195

Browse Source
This commit is contained in:
vcoppe
2025-03-22 14:46:16 +01:00
parent e3dcdf2f41
commit c5f20d323c
3 changed files with 45 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
website/src/lib/components/gpx-layer/CopyCoordinates.svelte Normal file
View File

@@ -0,0 +1,23 @@
<script lang="ts">
import { Button } from '$lib/components/ui/button';
import { ClipboardCopy } from 'lucide-svelte';
import { _ } from 'svelte-i18n';
import type { Coordinates } from 'gpx';
export let coordinates: Coordinates;
export let onCopy: () => void = () => {};
</script>
<Button
class="w-full px-2 py-1 h-8 justify-start {$$props.class}"
variant="outline"
on:click={() => {
navigator.clipboard.writeText(
`${coordinates.lat.toFixed(6)}, ${coordinates.lon.toFixed(6)}`
);
onCopy();
}}
>
<ClipboardCopy size="16" class="mr-1" />
{$_('menu.copy_coordinates')}
</Button>

22
website/src/lib/components/gpx-layer/TrackpointPopup.svelte
View File

@@ -1,10 +1,10 @@
<script lang="ts"> <script lang="ts">
import type { TrackPoint } from 'gpx'; import type { TrackPoint } from 'gpx';
import type { PopupItem } from '$lib/components/MapPopup'; import type { PopupItem } from '$lib/components/MapPopup';
import CopyCoordinates from '$lib/components/gpx-layer/CopyCoordinates.svelte';
import * as Card from '$lib/components/ui/card'; import * as Card from '$lib/components/ui/card';
import { Button } from '$lib/components/ui/button';
import WithUnits from '$lib/components/WithUnits.svelte'; import WithUnits from '$lib/components/WithUnits.svelte';
import { Compass, Mountain, Timer, ClipboardCopy } from 'lucide-svelte'; import { Compass, Mountain, Timer } from 'lucide-svelte';
import { df } from '$lib/utils'; import { df } from '$lib/utils';
import { _ } from 'svelte-i18n'; import { _ } from 'svelte-i18n';
@@ -34,18 +34,10 @@
{df.format(trackpoint.item.time)} {df.format(trackpoint.item.time)}
</div> </div>
{/if} {/if}
<Button <CopyCoordinates
class="w-full px-2 py-1 h-6 justify-start mt-0.5" coordinates={trackpoint.item.attributes}
variant="secondary" onCopy={() => trackpoint.hide?.()}
on:click={() => { class="mt-0.5"
navigator.clipboard.writeText( />
`${trackpoint.item.getLatitude().toFixed(6)}, ${trackpoint.item.getLongitude().toFixed(6)}`
);
trackpoint.hide?.();
}}
>
<ClipboardCopy size="16" class="mr-1" />
{$_('menu.copy_coordinates')}
</Button>
</Card.Content> </Card.Content>
</Card.Root> </Card.Root>

26
website/src/lib/components/gpx-layer/WaypointPopup.svelte
View File

@@ -2,6 +2,7 @@
import * as Card from '$lib/components/ui/card'; import * as Card from '$lib/components/ui/card';
import { Button } from '$lib/components/ui/button'; import { Button } from '$lib/components/ui/button';
import Shortcut from '$lib/components/Shortcut.svelte'; import Shortcut from '$lib/components/Shortcut.svelte';
import CopyCoordinates from '$lib/components/gpx-layer/CopyCoordinates.svelte';
import { deleteWaypoint } from './GPXLayerPopup'; import { deleteWaypoint } from './GPXLayerPopup';
import WithUnits from '$lib/components/WithUnits.svelte'; import WithUnits from '$lib/components/WithUnits.svelte';
import { Dot, ExternalLink, Trash2 } from 'lucide-svelte'; import { Dot, ExternalLink, Trash2 } from 'lucide-svelte';
@@ -77,17 +78,20 @@
<span class="whitespace-pre-wrap">{@html sanitize(waypoint.item.cmt)}</span> <span class="whitespace-pre-wrap">{@html sanitize(waypoint.item.cmt)}</span>
{/if} {/if}
</ScrollArea> </ScrollArea>
{#if $currentTool === Tool.WAYPOINT} <div class="mt-2 flex flex-col gap-1">
<Button <CopyCoordinates coordinates={waypoint.item.attributes} />
class="mt-2 w-full px-2 py-1 h-8 justify-start" {#if $currentTool === Tool.WAYPOINT}
variant="outline" <Button
on:click={() => deleteWaypoint(waypoint.fileId, waypoint.item._data.index)} class="w-full px-2 py-1 h-8 justify-start"
> variant="outline"
<Trash2 size="16" class="mr-1" /> on:click={() => deleteWaypoint(waypoint.fileId, waypoint.item._data.index)}
{$_('menu.delete')} >
<Shortcut shift={true} click={true} /> <Trash2 size="16" class="mr-1" />
</Button> {$_('menu.delete')}
{/if} <Shortcut shift={true} click={true} />
</Button>
{/if}
</div>
</Card.Content> </Card.Content>
</Card.Root> </Card.Root>