helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-10-17 18:19:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Feature - Implemented virtual scroll on web (#573)

Browse source 
This PR implemented a virtual scroll on the web, as seen in this article.

[Building the Google Photos Web UI](https://medium.com/google-design/google-photos-45b714dfbed1)
This commit is contained in:
Alex 2022-09-04 08:34:39 -05:00 • committed by GitHub
parent bd92dde117
commit 552340add7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
58 changed files with 2197 additions and 698 deletions
Download patch file Download diff file Expand all files Collapse all files

11
web/src/lib/components/asset-viewer/asset-viewer.svelte
View file

@ -52,12 +52,12 @@
const navigateAssetForward = (e?: Event) => {
e?.stopPropagation();
dispatch('navigate-forward');
dispatch('navigate-next');
};
const navigateAssetBackward = (e?: Event) => {
e?.stopPropagation();
dispatch('navigate-backward');
dispatch('navigate-previous');
};
const showDetailInfoHandler = () => {
@ -66,7 +66,6 @@
const downloadFile = async () => {
try {
console.log(asset.exifInfo);
const imageName = asset.exifInfo?.imageName ? asset.exifInfo?.imageName : asset.id;
const imageExtension = asset.originalPath.split('.')[1];
const imageFileName = imageName + '.' + imageExtension;
@ -130,7 +129,7 @@
<section
id="immich-asset-viewer"
class="fixed h-screen w-screen top-0 overflow-y-hidden bg-black z-[999] grid grid-rows-[64px_1fr] grid-cols-4 "
class="fixed h-screen w-screen top-0 overflow-y-hidden bg-black z-[999] grid grid-rows-[64px_1fr] grid-cols-4"
>
<div class="col-start-1 col-span-4 row-start-1 row-span-1 z-[1000] transition-transform">
<AsserViewerNavBar
@ -207,6 +206,10 @@
</section>
<style>
#immich-asset-viewer {
contain: layout;
}
.navigation-button-hover {
background-color: rgb(107 114 128 / var(--tw-bg-opacity));
color: rgb(55 65 81 / var(--tw-text-opacity));