feat(server,web): hide faces ()

* feat: hide faces

* fix: types

* pr feedback

* fix: svelte checks

* feat: new server endpoint

* refactor: rename person count dto

* fix(server): linter

* fix: remove duplicate button

* docs: add comments

* pr feedback

* fix: get unhidden faces

* fix: do not use PersonCountResponseDto

* fix: transition

* pr feedback

* pr feedback

* fix: remove unused check

* add server tests

* rename persons to people

* feat: add exit button

* pr feedback

* add server tests

* pr feedback

* pr feedback

* fix: show & hide faces

* simplify

* fix: close button

* pr feeback

* pr feeback

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
This commit is contained in:
martin 2023-07-18 20:09:43 +02:00 committed by GitHub
parent 02b70e693c
commit f28fc8fa5c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
38 changed files with 742 additions and 108 deletions
web/src/lib/components/assets/thumbnail

View file

@ -3,6 +3,7 @@
import { fade } from 'svelte/transition';
import { thumbHashToDataURL } from 'thumbhash';
import { Buffer } from 'buffer';
import EyeOffOutline from 'svelte-material-icons/EyeOffOutline.svelte';
export let url: string;
export let altText: string;
@ -12,16 +13,17 @@
export let curve = false;
export let shadow = false;
export let circle = false;
export let hidden = false;
let complete = false;
</script>
<img
style:width={widthStyle}
style:height={heightStyle}
style:filter={hidden ? 'grayscale(75%)' : 'none'}
src={url}
alt={altText}
class="object-cover transition-opacity duration-300"
class="object-cover transition duration-300"
class:rounded-lg={curve}
class:shadow-lg={shadow}
class:rounded-full={circle}
@ -30,6 +32,11 @@
use:imageLoad
on:image-load|once={() => (complete = true)}
/>
{#if hidden}
<div class="absolute top-1/2 left-1/2 transform translate-x-[-50%] translate-y-[-50%]">
<EyeOffOutline size="2em" />
</div>
{/if}
{#if thumbhash && !complete}
<img