adds toggle hotkeys to map

This commit is contained in:
Christian Beutel
2025-03-29 15:31:34 +01:00
parent 693302600c
commit 88f6d6e67c
3 changed files with 36 additions and 13 deletions

View File

@@ -911,8 +911,6 @@
addTrailLayer(t, layerId, i, data[i]); addTrailLayer(t, layerId, i, data[i]);
}); });
if (activeTrail !== null) { if (activeTrail !== null) {
console.log(activeTrail);
addCaretLayer(trails[activeTrail].id!); addCaretLayer(trails[activeTrail].id!);
} }
@@ -957,8 +955,31 @@
onDestroy(() => { onDestroy(() => {
map?.remove(); map?.remove();
}); });
function handleKeydown(e: KeyboardEvent) {
if (e.key == "m") {
if (trails.length === 1) {
removeCaretLayer();
removeTrailLayer(trails[0].id!);
}
}
}
function handleKeyup(e: KeyboardEvent) {
if (e.key == "m") {
if (trails.length === 1) {
addTrailLayer(trails[0], trails[0].id!, 0, data[0]);
addCaretLayer(trails[0].id);
}
} else if (e.key == "p") {
if (showElevation) {
epc?.toggleProfile();
}
}
}
</script> </script>
<svelte:window on:keydown={handleKeydown} on:keyup={handleKeyup} />
<div id="map" bind:this={mapContainer}></div> <div id="map" bind:this={mapContainer}></div>
<style> <style>

View File

@@ -179,13 +179,15 @@
> >
<div class="trail-info-panel-header"> <div class="trail-info-panel-header">
<section class="relative"> <section class="relative">
<button {#if mode !== "list"}
aria-label="Back" <button
class="bg-black/40 text-white text-lg rounded-full w-10 h-10 hover:bg-black/50 transition-colors focus:ring-4 focus:ring-primary/70 top-6 left-6 absolute" aria-label="Back"
onclick={() => history.back()} class="bg-black/40 text-white text-lg rounded-full w-10 h-10 hover:bg-black/50 transition-colors focus:ring-4 focus:ring-primary/70 top-6 left-6 absolute"
> onclick={() => history.back()}
<i class="fa fa-arrow-left"></i> >
</button> <i class="fa fa-arrow-left"></i>
</button>
{/if}
<div <div
class="grid gap-[1px] {headerPhotos.length > 1 class="grid gap-[1px] {headerPhotos.length > 1
? 'grid-cols-[8fr_5fr]' ? 'grid-cols-[8fr_5fr]'

View File

@@ -169,7 +169,7 @@ export class ElevationProfileControl implements IControl {
return this.buttonContainer; return this.buttonContainer;
} }
private toggleProfile() { toggleProfile() {
if (!this.profileContainer) return; if (!this.profileContainer) return;
if (this.isProfileShown) { if (this.isProfileShown) {