Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature - Implemented virtual scroll on web #573

Merged
merged 42 commits into from
Sep 4, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
42 commits
Select commit Hold shift + click to select a range
6c8a1a4
calculate total estimated length of viewport
alextran1502 Aug 27, 2022
94a62ee
Added implementation note
alextran1502 Aug 28, 2022
1217f56
Testing intersection observer
alextran1502 Aug 28, 2022
f793832
optimized scrolling by off loading unseen images
alextran1502 Aug 28, 2022
0e52ec8
calculating segment height on scrollbar
alextran1502 Aug 29, 2022
c1249dd
Render datetime segment
alextran1502 Aug 29, 2022
4fbc168
Added hover with infor at the cursor
alextran1502 Aug 30, 2022
27f51d4
Added scrollbar position
alextran1502 Aug 30, 2022
7f52bb8
Merge branch 'main' of github.com:immich-app/immich into dev/scroll-l…
alextran1502 Aug 31, 2022
356eaff
Merge branch 'main' of github.com:immich-app/immich into dev/scroll-l…
alextran1502 Aug 31, 2022
77a5388
Merge upstream
alextran1502 Aug 31, 2022
dd9e7b3
Added endpoint to get asset by time bucket
alextran1502 Aug 31, 2022
96973ea
Load asset by time bucket on load
alextran1502 Aug 31, 2022
7979334
Render datetime group
alextran1502 Aug 31, 2022
33b4884
Fixed issue with crashing browswer when update segment height
alextran1502 Sep 1, 2022
521c7ec
Added scroll while loading
alextran1502 Sep 1, 2022
1acd221
Display in date group
alextran1502 Sep 1, 2022
520ac06
Refactor API name
alextran1502 Sep 2, 2022
02bb55a
Intersection observer now has margin working
alextran1502 Sep 2, 2022
301a058
Merge branch 'main' of github.com:immich-app/immich into dev/smart-im…
alextran1502 Sep 2, 2022
8957605
merge upstream
alextran1502 Sep 2, 2022
d0e9495
Refactor API name
alextran1502 Sep 2, 2022
560bdd4
Handle fetching data on scrolled
alextran1502 Sep 2, 2022
0468b44
Display succesfully
alextran1502 Sep 3, 2022
0119695
adding viewing functionality
alextran1502 Sep 3, 2022
f07cd46
Refactor naming for UI interaction store
alextran1502 Sep 3, 2022
dfc6951
Cancel request on fast scroll
alextran1502 Sep 3, 2022
758c4a8
Remove cancel request for further testing
alextran1502 Sep 3, 2022
d6a8fc0
Restore asset navigation
alextran1502 Sep 3, 2022
0c83c6d
Remove dead code
alextran1502 Sep 3, 2022
535ccfe
Added condition to stop fetching for bucket
alextran1502 Sep 3, 2022
f04bbd1
Added selection UI
alextran1502 Sep 4, 2022
c52e099
Added back the ControlAppbar on home screen
alextran1502 Sep 4, 2022
7580b4f
reimplemented delete assets
alextran1502 Sep 4, 2022
8af76fa
Fixed asset selection for album
alextran1502 Sep 4, 2022
8e2886f
Update style
alextran1502 Sep 4, 2022
25a5c9b
Remove dead code
alextran1502 Sep 4, 2022
f91c7a7
select and add new asset to album
alextran1502 Sep 4, 2022
cec479e
Update readme
alextran1502 Sep 4, 2022
d472633
Remove test that depends on actual file
alextran1502 Sep 4, 2022
9373f58
Added back abort signal to abort request on load
alextran1502 Sep 4, 2022
f66c6d7
remove debug ui elements
alextran1502 Sep 4, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 16 additions & 14 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,20 +36,22 @@

> ⚠️ WARNING: **NOT READY FOR PRODUCTION! DO NOT USE TO STORE YOUR ASSETS**. This project is under heavy development, there will be continuous functions, features and api changes.

| | Mobile | Web |
| - | - | - |
| ☁️ Upload and view videos and photos | Yes | Yes
| 🔄 Auto backup when the app is opened | Yes | N/A
| ☑️ Selective album(s) for backup | Yes | N/A
| ⬇️ Download photos and videos to local device | Yes | Yes
| 👪 Multi-user support | Yes | Yes
| 🖼️ Album | Yes | Yes
| 🤝 Shared Albums | Yes | Yes
| 🚀 Quick navigation with draggable scrollbar | Yes | Yes
| 🗃️ Support RAW (HEIC, HEIF, DNG, Apple ProRaw) | Yes | Yes
| 🧭 Metadata view (EXIF, map) | Yes | Yes
| 🔎 Search by metadata, objects and image tags | Yes | No
| ⚙️ Administrative functions (user management) | N/A | Yes
| Mobile | Web |
| - | - |
| Upload and view videos and photos | Yes | Yes
| Auto backup when the app is opened | Yes | N/A
| Selective album(s) for backup | Yes | N/A
| Download photos and videos to local device | Yes | Yes
| Multi-user support | Yes | Yes
| Album | Yes | Yes
| Shared Albums | Yes | Yes
| Quick navigation with draggable scrollbar | Yes | Yes
| Support RAW (HEIC, HEIF, DNG, Apple ProRaw) | Yes | Yes
| Metadata view (EXIF, map) | Yes | Yes
| Search by metadata, objects and image tags | Yes | No
| Administrative functions (user management) | N/A | Yes
| Background backup | Android | N/A
| Virtual scroll | N/A | Yes


<br/>
Expand Down
14 changes: 8 additions & 6 deletions mobile/openapi/.openapi-generator/FILES
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ doc/AdminSignupResponseDto.md
doc/AlbumApi.md
doc/AlbumResponseDto.md
doc/AssetApi.md
doc/AssetCountByTimeGroupDto.md
doc/AssetCountByTimeGroupResponseDto.md
doc/AssetCountByTimeBucket.md
doc/AssetCountByTimeBucketResponseDto.md
doc/AssetFileUploadResponseDto.md
doc/AssetResponseDto.md
doc/AssetTypeEnum.md
Expand All @@ -29,7 +29,8 @@ doc/DeviceInfoApi.md
doc/DeviceInfoResponseDto.md
doc/DeviceTypeEnum.md
doc/ExifResponseDto.md
doc/GetAssetCountByTimeGroupDto.md
doc/GetAssetByTimeBucketDto.md
doc/GetAssetCountByTimeBucketDto.md
doc/LoginCredentialDto.md
doc/LoginResponseDto.md
doc/LogoutResponseDto.md
Expand Down Expand Up @@ -70,8 +71,8 @@ lib/model/add_assets_dto.dart
lib/model/add_users_dto.dart
lib/model/admin_signup_response_dto.dart
lib/model/album_response_dto.dart
lib/model/asset_count_by_time_group_dto.dart
lib/model/asset_count_by_time_group_response_dto.dart
lib/model/asset_count_by_time_bucket.dart
lib/model/asset_count_by_time_bucket_response_dto.dart
lib/model/asset_file_upload_response_dto.dart
lib/model/asset_response_dto.dart
lib/model/asset_type_enum.dart
Expand All @@ -89,7 +90,8 @@ lib/model/delete_asset_status.dart
lib/model/device_info_response_dto.dart
lib/model/device_type_enum.dart
lib/model/exif_response_dto.dart
lib/model/get_asset_count_by_time_group_dto.dart
lib/model/get_asset_by_time_bucket_dto.dart
lib/model/get_asset_count_by_time_bucket_dto.dart
lib/model/login_credential_dto.dart
lib/model/login_response_dto.dart
lib/model/logout_response_dto.dart
Expand Down
10 changes: 6 additions & 4 deletions mobile/openapi/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,8 @@ Class | Method | HTTP request | Description
*AssetApi* | [**downloadFile**](doc//AssetApi.md#downloadfile) | **GET** /asset/download |
*AssetApi* | [**getAllAssets**](doc//AssetApi.md#getallassets) | **GET** /asset |
*AssetApi* | [**getAssetById**](doc//AssetApi.md#getassetbyid) | **GET** /asset/assetById/{assetId} |
*AssetApi* | [**getAssetCountByTimeGroup**](doc//AssetApi.md#getassetcountbytimegroup) | **GET** /asset/count-by-date |
*AssetApi* | [**getAssetByTimeBucket**](doc//AssetApi.md#getassetbytimebucket) | **POST** /asset/time-bucket |
*AssetApi* | [**getAssetCountByTimeBucket**](doc//AssetApi.md#getassetcountbytimebucket) | **POST** /asset/count-by-time-bucket |
*AssetApi* | [**getAssetSearchTerms**](doc//AssetApi.md#getassetsearchterms) | **GET** /asset/search-terms |
*AssetApi* | [**getAssetThumbnail**](doc//AssetApi.md#getassetthumbnail) | **GET** /asset/thumbnail/{assetId} |
*AssetApi* | [**getCuratedLocations**](doc//AssetApi.md#getcuratedlocations) | **GET** /asset/curated-locations |
Expand Down Expand Up @@ -113,8 +114,8 @@ Class | Method | HTTP request | Description
- [AddUsersDto](doc//AddUsersDto.md)
- [AdminSignupResponseDto](doc//AdminSignupResponseDto.md)
- [AlbumResponseDto](doc//AlbumResponseDto.md)
- [AssetCountByTimeGroupDto](doc//AssetCountByTimeGroupDto.md)
- [AssetCountByTimeGroupResponseDto](doc//AssetCountByTimeGroupResponseDto.md)
- [AssetCountByTimeBucket](doc//AssetCountByTimeBucket.md)
- [AssetCountByTimeBucketResponseDto](doc//AssetCountByTimeBucketResponseDto.md)
- [AssetFileUploadResponseDto](doc//AssetFileUploadResponseDto.md)
- [AssetResponseDto](doc//AssetResponseDto.md)
- [AssetTypeEnum](doc//AssetTypeEnum.md)
Expand All @@ -132,7 +133,8 @@ Class | Method | HTTP request | Description
- [DeviceInfoResponseDto](doc//DeviceInfoResponseDto.md)
- [DeviceTypeEnum](doc//DeviceTypeEnum.md)
- [ExifResponseDto](doc//ExifResponseDto.md)
- [GetAssetCountByTimeGroupDto](doc//GetAssetCountByTimeGroupDto.md)
- [GetAssetByTimeBucketDto](doc//GetAssetByTimeBucketDto.md)
- [GetAssetCountByTimeBucketDto](doc//GetAssetCountByTimeBucketDto.md)
- [LoginCredentialDto](doc//LoginCredentialDto.md)
- [LoginResponseDto](doc//LoginResponseDto.md)
- [LogoutResponseDto](doc//LogoutResponseDto.md)
Expand Down
64 changes: 56 additions & 8 deletions mobile/openapi/doc/AssetApi.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ Method | HTTP request | Description
[**downloadFile**](AssetApi.md#downloadfile) | **GET** /asset/download |
[**getAllAssets**](AssetApi.md#getallassets) | **GET** /asset |
[**getAssetById**](AssetApi.md#getassetbyid) | **GET** /asset/assetById/{assetId} |
[**getAssetCountByTimeGroup**](AssetApi.md#getassetcountbytimegroup) | **GET** /asset/count-by-date |
[**getAssetByTimeBucket**](AssetApi.md#getassetbytimebucket) | **POST** /asset/time-bucket |
[**getAssetCountByTimeBucket**](AssetApi.md#getassetcountbytimebucket) | **POST** /asset/count-by-time-bucket |
[**getAssetSearchTerms**](AssetApi.md#getassetsearchterms) | **GET** /asset/search-terms |
[**getAssetThumbnail**](AssetApi.md#getassetthumbnail) | **GET** /asset/thumbnail/{assetId} |
[**getCuratedLocations**](AssetApi.md#getcuratedlocations) | **GET** /asset/curated-locations |
Expand Down Expand Up @@ -268,8 +269,8 @@ Name | Type | Description | Notes

[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

# **getAssetCountByTimeGroup**
> AssetCountByTimeGroupResponseDto getAssetCountByTimeGroup(getAssetCountByTimeGroupDto)
# **getAssetByTimeBucket**
> List<AssetResponseDto> getAssetByTimeBucket(getAssetByTimeBucketDto)



Expand All @@ -284,25 +285,72 @@ import 'package:openapi/api.dart';
//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);

final api_instance = AssetApi();
final getAssetCountByTimeGroupDto = GetAssetCountByTimeGroupDto(); // GetAssetCountByTimeGroupDto |
final getAssetByTimeBucketDto = GetAssetByTimeBucketDto(); // GetAssetByTimeBucketDto |

try {
final result = api_instance.getAssetCountByTimeGroup(getAssetCountByTimeGroupDto);
final result = api_instance.getAssetByTimeBucket(getAssetByTimeBucketDto);
print(result);
} catch (e) {
print('Exception when calling AssetApi->getAssetCountByTimeGroup: $e\n');
print('Exception when calling AssetApi->getAssetByTimeBucket: $e\n');
}
```

### Parameters

Name | Type | Description | Notes
------------- | ------------- | ------------- | -------------
**getAssetCountByTimeGroupDto** | [**GetAssetCountByTimeGroupDto**](GetAssetCountByTimeGroupDto.md)| |
**getAssetByTimeBucketDto** | [**GetAssetByTimeBucketDto**](GetAssetByTimeBucketDto.md)| |

### Return type

[**AssetCountByTimeGroupResponseDto**](AssetCountByTimeGroupResponseDto.md)
[**List<AssetResponseDto>**](AssetResponseDto.md)

### Authorization

[bearer](../README.md#bearer)

### HTTP request headers

- **Content-Type**: application/json
- **Accept**: application/json

[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

# **getAssetCountByTimeBucket**
> AssetCountByTimeBucketResponseDto getAssetCountByTimeBucket(getAssetCountByTimeBucketDto)



### Example
```dart
import 'package:openapi/api.dart';
// TODO Configure HTTP Bearer authorization: bearer
// Case 1. Use String Token
//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken('YOUR_ACCESS_TOKEN');
// Case 2. Use Function which generate token.
// String yourTokenGeneratorFunction() { ... }
//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);

final api_instance = AssetApi();
final getAssetCountByTimeBucketDto = GetAssetCountByTimeBucketDto(); // GetAssetCountByTimeBucketDto |

try {
final result = api_instance.getAssetCountByTimeBucket(getAssetCountByTimeBucketDto);
print(result);
} catch (e) {
print('Exception when calling AssetApi->getAssetCountByTimeBucket: $e\n');
}
```

### Parameters

Name | Type | Description | Notes
------------- | ------------- | ------------- | -------------
**getAssetCountByTimeBucketDto** | [**GetAssetCountByTimeBucketDto**](GetAssetCountByTimeBucketDto.md)| |

### Return type

[**AssetCountByTimeBucketResponseDto**](AssetCountByTimeBucketResponseDto.md)

### Authorization

Expand Down
16 changes: 16 additions & 0 deletions mobile/openapi/doc/AssetCountByTimeBucket.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# openapi.model.AssetCountByTimeBucket

## Load the model package
```dart
import 'package:openapi/api.dart';
```

## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------
**timeBucket** | **String** | |
**count** | **int** | |

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)


16 changes: 16 additions & 0 deletions mobile/openapi/doc/AssetCountByTimeBucketResponseDto.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# openapi.model.AssetCountByTimeBucketResponseDto

## Load the model package
```dart
import 'package:openapi/api.dart';
```

## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------
**totalCount** | **int** | |
**buckets** | [**List<AssetCountByTimeBucket>**](AssetCountByTimeBucket.md) | | [default to const []]

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)


4 changes: 2 additions & 2 deletions mobile/openapi/doc/AssetCountByTimeGroupResponseDto.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ import 'package:openapi/api.dart';
## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------
**totalAssets** | **int** | |
**groups** | [**List<AssetCountByTimeGroupDto>**](AssetCountByTimeGroupDto.md) | | [default to const []]
**count** | **int** | |
**buckets** | [**List<AssetCountByTimeBucketResponseDto>**](AssetCountByTimeBucketResponseDto.md) | | [default to const []]

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)

Expand Down
15 changes: 15 additions & 0 deletions mobile/openapi/doc/GetAssetByTimeBucketDto.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
# openapi.model.GetAssetByTimeBucketDto

## Load the model package
```dart
import 'package:openapi/api.dart';
```

## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------
**timeBucket** | **List<String>** | | [default to const []]

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)


15 changes: 15 additions & 0 deletions mobile/openapi/doc/GetAssetCountByTimeBucketDto.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
# openapi.model.GetAssetCountByTimeBucketDto

## Load the model package
```dart
import 'package:openapi/api.dart';
```

## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------
**timeGroup** | [**TimeGroupEnum**](TimeGroupEnum.md) | |

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)


14 changes: 14 additions & 0 deletions mobile/openapi/doc/TimeBucketEnum.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
# openapi.model.TimeBucketEnum

## Load the model package
```dart
import 'package:openapi/api.dart';
```

## Properties
Name | Type | Description | Notes
------------ | ------------- | ------------- | -------------

[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)


7 changes: 4 additions & 3 deletions mobile/openapi/lib/api.dart
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,8 @@ part 'model/add_assets_dto.dart';
part 'model/add_users_dto.dart';
part 'model/admin_signup_response_dto.dart';
part 'model/album_response_dto.dart';
part 'model/asset_count_by_time_group_dto.dart';
part 'model/asset_count_by_time_group_response_dto.dart';
part 'model/asset_count_by_time_bucket.dart';
part 'model/asset_count_by_time_bucket_response_dto.dart';
part 'model/asset_file_upload_response_dto.dart';
part 'model/asset_response_dto.dart';
part 'model/asset_type_enum.dart';
Expand All @@ -57,7 +57,8 @@ part 'model/delete_asset_status.dart';
part 'model/device_info_response_dto.dart';
part 'model/device_type_enum.dart';
part 'model/exif_response_dto.dart';
part 'model/get_asset_count_by_time_group_dto.dart';
part 'model/get_asset_by_time_bucket_dto.dart';
part 'model/get_asset_count_by_time_bucket_dto.dart';
part 'model/login_credential_dto.dart';
part 'model/login_response_dto.dart';
part 'model/logout_response_dto.dart';
Expand Down
Loading