self-hosted/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2024-12-27 10:58:13 +02:00
Code Issues Releases Activity

feat(web): pasting coordinates (#11866)

Browse Source
This commit is contained in:
Michel Heusschen 2024-08-17 17:03:34 +02:00 committed by GitHub
parent 0261f79c72
commit 5ef9a8ff8d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
web/src/lib/components/shared-components/coordinates-input.svelte
View File

@ -14,14 +14,32 @@
onUpdate(lat, lng);
}
};
const onPaste = (event: ClipboardEvent) => {
const coords = event.clipboardData?.getData('text/plain')?.split(',');
if (!coords || coords.length !== 2) {
return;
}
const [latitude, longitude] = coords.map((coord) => Number.parseFloat(coord));
if (Number.isNaN(latitude) || latitude < -90 || latitude > 90) {
return;
}
if (Number.isNaN(longitude) || longitude < -180 || longitude > 180) {
return;
}
event.preventDefault();
[lat, lng] = [latitude, longitude];
};
</script>
<div>
<label class="immich-form-label" for="latitude-input-{id}">{$t('latitude')}</label>
<NumberRangeInput id="latitude-input-{id}" min={-90} max={90} {onInput} bind:value={lat} />
<NumberRangeInput id="latitude-input-{id}" min={-90} max={90} {onInput} {onPaste} bind:value={lat} />
</div>
<div>
<label class="immich-form-label" for="longitude-input-{id}">{$t('longitude')}</label>
<NumberRangeInput id="longitude-input-{id}" min={-180} max={180} {onInput} bind:value={lng} />
<NumberRangeInput id="longitude-input-{id}" min={-180} max={180} {onInput} {onPaste} bind:value={lng} />
</div>

3
web/src/lib/components/shared-components/number-range-input.svelte
View File

@ -1,5 +1,6 @@
<script lang="ts">
import { clamp } from 'lodash-es';
import type { ClipboardEventHandler } from 'svelte/elements';
export let id: string;
export let min: number;
@ -8,6 +9,7 @@
export let required = true;
export let value: number | null = null;
export let onInput: (value: number | null) => void;
export let onPaste: ClipboardEventHandler<HTMLInputElement> | undefined = undefined;
</script>
<input
@ -25,4 +27,5 @@
}
onInput(value);
}}
on:paste={onPaste}
/>