tbelway/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-07-09 03:06:56 -04:00
Code Issues Packages Projects Releases Wiki Activity

inital proof of concept icons

Browse Source
This commit is contained in:
Christopher Makarem 2024-08-28 17:13:53 -07:00
parent be476d7982
commit 4ea652aeb8
1 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/lib/components/assets/thumbnail/thumbnail.svelte
View File

@ -2,9 +2,10 @@
import { intersectionObserver } from '$lib/actions/intersection-observer'; import { intersectionObserver } from '$lib/actions/intersection-observer';
import Icon from '$lib/components/elements/icon.svelte'; import Icon from '$lib/components/elements/icon.svelte';
import { ProjectionType } from '$lib/constants'; import { ProjectionType } from '$lib/constants';
import { getAssetThumbnailUrl, isSharedLink } from '$lib/utils'; import { getAssetThumbnailUrl, getUserInfo, isSharedLink } from '$lib/utils';
import { getAltText } from '$lib/utils/thumbnail-util'; import { getAltText } from '$lib/utils/thumbnail-util';
import { timeToSeconds } from '$lib/utils/date-time'; import { timeToSeconds } from '$lib/utils/date-time';
import { user } from '$lib/stores/user.store';
import { AssetMediaSize, AssetTypeEnum, type AssetResponseDto } from '@immich/sdk'; import { AssetMediaSize, AssetTypeEnum, type AssetResponseDto } from '@immich/sdk';
import { locale, playVideoThumbnailOnHover } from '$lib/stores/preferences.store'; import { locale, playVideoThumbnailOnHover } from '$lib/stores/preferences.store';
import { getAssetPlaybackUrl } from '$lib/utils'; import { getAssetPlaybackUrl } from '$lib/utils';
@ -30,6 +31,7 @@
import { onDestroy } from 'svelte'; import { onDestroy } from 'svelte';
import { TUNABLES } from '$lib/utils/tunables'; import { TUNABLES } from '$lib/utils/tunables';
import { thumbhash } from '$lib/actions/thumbhash'; import { thumbhash } from '$lib/actions/thumbhash';
import UserAvatar from '$lib/components/shared-components/user-avatar.svelte';
export let asset: AssetResponseDto; export let asset: AssetResponseDto;
export let dateGroup: DateGroup | undefined = undefined; export let dateGroup: DateGroup | undefined = undefined;
@ -63,7 +65,6 @@
let className = ''; let className = '';
export { className as class }; export { className as class };
let { let {
IMAGE_THUMBNAIL: { THUMBHASH_FADE_DURATION }, IMAGE_THUMBNAIL: { THUMBHASH_FADE_DURATION },
} = TUNABLES; } = TUNABLES;
@ -267,6 +268,12 @@
</div> </div>
{/if} {/if}
{#if isSharedLink() || asset.ownerId != user.userId}
<div class="absolute bottom-2 left-2 z-10">
<UserAvatar user={$user} size="sm" />
</div>
{/if}
{#if !isSharedLink() && showArchiveIcon && asset.isArchived} {#if !isSharedLink() && showArchiveIcon && asset.isArchived}
<div class="absolute {asset.isFavorite ? 'bottom-10' : 'bottom-2'} left-2 z-10"> <div class="absolute {asset.isFavorite ? 'bottom-10' : 'bottom-2'} left-2 z-10">
<Icon path={mdiArchiveArrowDownOutline} size="24" class="text-white" /> <Icon path={mdiArchiveArrowDownOutline} size="24" class="text-white" />