mirror of
https://github.com/immich-app/immich.git
synced 2025-12-18 17:23:16 +03:00
Feature - Implemented virtual scroll on web (#573)
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:
40
web/src/lib/models/asset-grid-state.ts
Normal file
40
web/src/lib/models/asset-grid-state.ts
Normal file
@@ -0,0 +1,40 @@
|
||||
import { AssetResponseDto } from '@api';
|
||||
|
||||
export class AssetBucket {
|
||||
/**
|
||||
* The DOM height of the bucket in pixel
|
||||
* This value is first estimated by the number of asset and later is corrected as the user scroll
|
||||
*/
|
||||
bucketHeight!: number;
|
||||
bucketDate!: string;
|
||||
assets!: AssetResponseDto[];
|
||||
cancelToken!: AbortController;
|
||||
}
|
||||
|
||||
export class AssetGridState {
|
||||
/**
|
||||
* The total height of the timeline in pixel
|
||||
* This value is first estimated by the number of asset and later is corrected as the user scroll
|
||||
*/
|
||||
timelineHeight: number = 0;
|
||||
|
||||
/**
|
||||
* The fixed viewport height in pixel
|
||||
*/
|
||||
viewportHeight: number = 0;
|
||||
|
||||
/**
|
||||
* The fixed viewport width in pixel
|
||||
*/
|
||||
viewportWidth: number = 0;
|
||||
|
||||
/**
|
||||
* List of bucket information
|
||||
*/
|
||||
buckets: AssetBucket[] = [];
|
||||
|
||||
/**
|
||||
* Total assets that have been loaded
|
||||
*/
|
||||
assets: AssetResponseDto[] = [];
|
||||
}
|
||||
Reference in New Issue
Block a user