self-hosted/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-07-03 05:46:58 +02:00
Code Issues Releases Activity

feat(web): add current view asset to album (#923)

Browse Source
This commit is contained in:
Jason Rasmussen
2022-11-04 10:32:09 -04:00
committed by GitHub
parent d696ce4e41
commit 5aa06ed3be
7 changed files with 225 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
View File

@ -4,9 +4,30 @@
import ArrowLeft from 'svelte-material-icons/ArrowLeft.svelte';
import CloudDownloadOutline from 'svelte-material-icons/CloudDownloadOutline.svelte';
import InformationOutline from 'svelte-material-icons/InformationOutline.svelte';
import DotsVertical from 'svelte-material-icons/DotsVertical.svelte';
import DeleteOutline from 'svelte-material-icons/DeleteOutline.svelte';
import CircleIconButton from '../shared-components/circle-icon-button.svelte';
import ContextMenu from '../shared-components/context-menu/context-menu.svelte';
import MenuOption from '../shared-components/context-menu/menu-option.svelte';
const dispatch = createEventDispatcher();
let contextMenuPosition = { x: 0, y: 0 };
let isShowAssetOptions = false;
const showOptionsMenu = (event: CustomEvent) => {
contextMenuPosition = {
x: event.detail.mouseEvent.x,
y: event.detail.mouseEvent.y
};
isShowAssetOptions = !isShowAssetOptions;
};
const onMenuClick = (eventName: string) => {
isShowAssetOptions = false;
dispatch(eventName);
};
</script>
<div
@ -19,5 +40,15 @@
<CircleIconButton logo={CloudDownloadOutline} on:click={() => dispatch('download')} />
<CircleIconButton logo={DeleteOutline} on:click={() => dispatch('delete')} />
<CircleIconButton logo={InformationOutline} on:click={() => dispatch('showDetail')} />
<CircleIconButton logo={DotsVertical} on:click={(event) => showOptionsMenu(event)} />
</div>
</div>
{#if isShowAssetOptions}
<ContextMenu {...contextMenuPosition} on:clickoutside={() => (isShowAssetOptions = false)}>
<div class="flex flex-col rounded-lg ">
<MenuOption on:click={() => onMenuClick('addToAlbum')} text="Add to Album" />
<MenuOption on:click={() => onMenuClick('addToSharedAlbum')} text="Add to Shared Album" />
</div>
</ContextMenu>
{/if}