mirror of
https://github.com/immich-app/immich
synced 2025-10-17 18:19:27 +00:00
fix(web): copy to clipboard on safari (#22217)
This commit is contained in:
parent
1e0b4fac04
commit
de57fecb69
3 changed files with 26 additions and 8 deletions
|
|
@ -920,6 +920,7 @@
|
||||||
"cant_get_number_of_comments": "Can't get number of comments",
|
"cant_get_number_of_comments": "Can't get number of comments",
|
||||||
"cant_search_people": "Can't search people",
|
"cant_search_people": "Can't search people",
|
||||||
"cant_search_places": "Can't search places",
|
"cant_search_places": "Can't search places",
|
||||||
|
"clipboard_unsupported_mime_type": "The system clipboard does not support copying this type of content: {mimeType}",
|
||||||
"error_adding_assets_to_album": "Error adding assets to album",
|
"error_adding_assets_to_album": "Error adding assets to album",
|
||||||
"error_adding_users_to_album": "Error adding users to album",
|
"error_adding_users_to_album": "Error adding users to album",
|
||||||
"error_deleting_shared_user": "Error deleting shared user",
|
"error_deleting_shared_user": "Error deleting shared user",
|
||||||
|
|
|
||||||
|
|
@ -97,12 +97,15 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await copyImageToClipboard($photoViewerImgElement ?? assetFileUrl);
|
const result = await copyImageToClipboard($photoViewerImgElement ?? assetFileUrl);
|
||||||
notificationController.show({
|
if (result.success) {
|
||||||
type: NotificationType.Info,
|
notificationController.show({ type: NotificationType.Info, message: $t('copied_image_to_clipboard') });
|
||||||
message: $t('copied_image_to_clipboard'),
|
} else {
|
||||||
timeout: 3000,
|
notificationController.show({
|
||||||
});
|
type: NotificationType.Error,
|
||||||
|
message: $t('errors.clipboard_unsupported_mime_type', { values: { mimeType: result.mimeType } }),
|
||||||
|
});
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
handleError(error, $t('copy_error'));
|
handleError(error, $t('copy_error'));
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -625,7 +625,21 @@ const urlToBlob = async (imageSource: string) => {
|
||||||
return await response.blob();
|
return await response.blob();
|
||||||
};
|
};
|
||||||
|
|
||||||
export const copyImageToClipboard = async (source: HTMLImageElement | string) => {
|
export const copyImageToClipboard = async (
|
||||||
const blob = source instanceof HTMLImageElement ? await imgToBlob(source) : await urlToBlob(source);
|
source: HTMLImageElement | string,
|
||||||
|
): Promise<{ success: true } | { success: false; mimeType: string }> => {
|
||||||
|
if (source instanceof HTMLImageElement) {
|
||||||
|
// do not await, so the Safari clipboard write happens in the context of the user gesture
|
||||||
|
await navigator.clipboard.write([new ClipboardItem({ ['image/png']: imgToBlob(source) })]);
|
||||||
|
return { success: true };
|
||||||
|
}
|
||||||
|
|
||||||
|
// if we had a way to get the mime type synchronously, we could do the same thing here
|
||||||
|
const blob = await urlToBlob(source);
|
||||||
|
if (!ClipboardItem.supports(blob.type)) {
|
||||||
|
return { success: false, mimeType: blob.type };
|
||||||
|
}
|
||||||
|
|
||||||
await navigator.clipboard.write([new ClipboardItem({ [blob.type]: blob })]);
|
await navigator.clipboard.write([new ClipboardItem({ [blob.type]: blob })]);
|
||||||
|
return { success: true };
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue