feat(web) add handler for ctrl-c copying images from viewer (#881)

This commit is contained in:
bo0tzz 2022-10-29 00:18:28 +02:00 committed by GitHub
parent b1212fc98b
commit b0f10b1851
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 41 additions and 1 deletions

View file

@ -4,15 +4,23 @@
import { onMount } from 'svelte';
import LoadingSpinner from '../shared-components/loading-spinner.svelte';
import { api, AssetResponseDto } from '@api';
import Keydown from 'svelte-keydown';
export let assetId: string;
export let deviceId: string;
let assetInfo: AssetResponseDto;
let assetData: string;
let copyImageToClipboard : (src: string) => Promise<Blob>;
onMount(async () => {
const { data } = await api.assetApi.getAssetById(assetId);
assetInfo = data;
//Import hack :( see https://github.com/vadimkorr/svelte-carousel/issues/27#issuecomment-851022295
const module = await import('copy-image-clipboard')
copyImageToClipboard = module.copyImageToClipboard;
});
const loadAssetData = async () => {
@ -31,14 +39,22 @@
return;
}
const assetData = URL.createObjectURL(data);
assetData = URL.createObjectURL(data);
return assetData;
} catch {
// Do nothing
}
};
const handleCopy = async (keyEvent: CustomEvent<string>) => {
if (keyEvent.detail == 'Control-c' || keyEvent.detail == 'Meta-c') {
await copyImageToClipboard(assetData);
}
};
</script>
<Keydown on:combo={handleCopy} />
<div
transition:fade={{ duration: 150 }}
class="flex place-items-center place-content-center h-full select-none"