ente/lib/ui/huge_listview/lazy_loading_gallery.dart
2023-05-03 18:17:21 +05:30

765 lines
24 KiB
Dart

import 'dart:async';
import 'dart:math';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:logging/logging.dart';
import 'package:media_extension/media_extension.dart';
import 'package:media_extension/media_extension_action_types.dart';
import "package:photos/core/configuration.dart";
import 'package:photos/core/constants.dart';
import 'package:photos/core/event_bus.dart';
import 'package:photos/events/clear_selections_event.dart';
import 'package:photos/events/files_updated_event.dart';
import 'package:photos/extensions/string_ext.dart';
import 'package:photos/models/file.dart';
import 'package:photos/models/selected_files.dart';
import 'package:photos/services/app_lifecycle_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/huge_listview/place_holder_widget.dart';
import 'package:photos/ui/viewer/file/detail_page.dart';
import 'package:photos/ui/viewer/file/thumbnail_widget.dart';
import 'package:photos/ui/viewer/gallery/gallery.dart';
import 'package:photos/utils/date_time_util.dart';
import 'package:photos/utils/file_util.dart';
import 'package:photos/utils/navigation_util.dart';
import 'package:visibility_detector/visibility_detector.dart';
class LazyLoadingGallery extends StatefulWidget {
final List<File> files;
final int index;
final Stream<FilesUpdatedEvent>? reloadEvent;
final Set<EventType> removalEventTypes;
final GalleryLoader asyncLoader;
final SelectedFiles? selectedFiles;
final String tag;
final String? logTag;
final Stream<int> currentIndexStream;
final int photoGridSize;
final bool areFilesCollatedByDay;
final bool limitSelectionToOne;
LazyLoadingGallery(
this.files,
this.index,
this.reloadEvent,
this.removalEventTypes,
this.asyncLoader,
this.selectedFiles,
this.tag,
this.currentIndexStream,
this.areFilesCollatedByDay, {
this.logTag = "",
this.photoGridSize = photoGridSizeDefault,
this.limitSelectionToOne = false,
Key? key,
}) : super(key: key ?? UniqueKey());
@override
State<LazyLoadingGallery> createState() => _LazyLoadingGalleryState();
}
class _LazyLoadingGalleryState extends State<LazyLoadingGallery> {
static const kNumberOfDaysToRenderBeforeAndAfter = 8;
late Logger _logger;
late List<File> _files;
late StreamSubscription<FilesUpdatedEvent>? _reloadEventSubscription;
late StreamSubscription<int> _currentIndexSubscription;
bool? _shouldRender;
final ValueNotifier<bool> _toggleSelectAllFromDay = ValueNotifier(false);
final ValueNotifier<bool> _showSelectAllButton = ValueNotifier(false);
final ValueNotifier<bool> _areAllFromDaySelected = ValueNotifier(false);
@override
void initState() {
//this is for removing the 'select all from day' icon on unselecting all files with 'cancel'
widget.selectedFiles?.addListener(_selectedFilesListener);
super.initState();
_init();
}
void _init() {
_logger = Logger("LazyLoading_${widget.logTag}");
_shouldRender = true;
_files = widget.files;
_reloadEventSubscription = widget.reloadEvent?.listen((e) => _onReload(e));
_currentIndexSubscription =
widget.currentIndexStream.listen((currentIndex) {
final bool shouldRender = (currentIndex - widget.index).abs() <
kNumberOfDaysToRenderBeforeAndAfter;
if (mounted && shouldRender != _shouldRender) {
setState(() {
_shouldRender = shouldRender;
});
}
});
}
Future _onReload(FilesUpdatedEvent event) async {
final galleryDate =
DateTime.fromMicrosecondsSinceEpoch(_files[0].creationTime!);
final filesUpdatedThisDay = event.updatedFiles.where((file) {
final fileDate = DateTime.fromMicrosecondsSinceEpoch(file.creationTime!);
return fileDate.year == galleryDate.year &&
fileDate.month == galleryDate.month &&
fileDate.day == galleryDate.day;
});
if (filesUpdatedThisDay.isNotEmpty) {
if (kDebugMode) {
_logger.info(
filesUpdatedThisDay.length.toString() +
" files were updated due to ${event.reason} on " +
getDayTitle(galleryDate.microsecondsSinceEpoch),
);
}
if (event.type == EventType.addedOrUpdated) {
final dayStartTime =
DateTime(galleryDate.year, galleryDate.month, galleryDate.day);
final result = await widget.asyncLoader(
dayStartTime.microsecondsSinceEpoch,
dayStartTime.microsecondsSinceEpoch + microSecondsInDay - 1,
);
if (mounted) {
setState(() {
_files = result.files;
});
}
} else if (widget.removalEventTypes.contains(event.type)) {
// Files were removed
final generatedFileIDs = <int?>{};
final uploadedFileIds = <int?>{};
for (final file in filesUpdatedThisDay) {
if (file.generatedID != null) {
generatedFileIDs.add(file.generatedID);
} else if (file.uploadedFileID != null) {
uploadedFileIds.add(file.uploadedFileID);
}
}
final List<File> files = [];
files.addAll(_files);
files.removeWhere(
(file) =>
generatedFileIDs.contains(file.generatedID) ||
uploadedFileIds.contains(file.uploadedFileID),
);
if (kDebugMode) {
_logger.finest(
"removed ${_files.length - files.length} due to ${event.reason}",
);
}
if (mounted) {
setState(() {
_files = files;
});
}
} else {
if (kDebugMode) {
debugPrint("Unexpected event ${event.type.name}");
}
}
}
}
@override
void dispose() {
_reloadEventSubscription?.cancel();
_currentIndexSubscription.cancel();
widget.selectedFiles?.removeListener(_selectedFilesListener);
_toggleSelectAllFromDay.dispose();
_showSelectAllButton.dispose();
_areAllFromDaySelected.dispose();
super.dispose();
}
@override
void didUpdateWidget(LazyLoadingGallery oldWidget) {
super.didUpdateWidget(oldWidget);
if (!listEquals(_files, widget.files)) {
_reloadEventSubscription?.cancel();
_init();
}
}
@override
Widget build(BuildContext context) {
if (_files.isEmpty) {
return const SizedBox.shrink();
}
return Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
if (widget.areFilesCollatedByDay)
DayWidget(
timestamp: _files[0].creationTime!,
photoGridSize: widget.photoGridSize,
),
widget.limitSelectionToOne
? const SizedBox.shrink()
: ValueListenableBuilder(
valueListenable: _showSelectAllButton,
builder: (context, dynamic value, _) {
return !value
? const SizedBox.shrink()
: GestureDetector(
behavior: HitTestBehavior.translucent,
child: SizedBox(
width: 48,
height: 44,
child: ValueListenableBuilder(
valueListenable: _areAllFromDaySelected,
builder: (context, dynamic value, _) {
return value
? const Icon(
Icons.check_circle,
size: 18,
)
: Icon(
Icons.check_circle_outlined,
color: getEnteColorScheme(context)
.strokeMuted,
size: 18,
);
},
),
),
onTap: () {
//this value has no significance
//changing only to notify the listeners
_toggleSelectAllFromDay.value =
!_toggleSelectAllFromDay.value;
},
);
},
)
],
),
_shouldRender!
? GetGallery(
photoGridSize: widget.photoGridSize,
files: _files,
tag: widget.tag,
asyncLoader: widget.asyncLoader,
selectedFiles: widget.selectedFiles,
toggleSelectAllFromDay: _toggleSelectAllFromDay,
areAllFromDaySelected: _areAllFromDaySelected,
limitSelectionToOne: widget.limitSelectionToOne,
)
: PlaceHolderWidget(
_files.length,
widget.photoGridSize,
),
],
);
}
void _selectedFilesListener() {
if (widget.selectedFiles!.files.isEmpty) {
_showSelectAllButton.value = false;
} else {
_showSelectAllButton.value = true;
}
}
}
class GetGallery extends StatelessWidget {
final int photoGridSize;
final List<File> files;
final String tag;
final GalleryLoader asyncLoader;
final SelectedFiles? selectedFiles;
final ValueNotifier<bool> toggleSelectAllFromDay;
final ValueNotifier<bool> areAllFromDaySelected;
final bool limitSelectionToOne;
const GetGallery({
required this.photoGridSize,
required this.files,
required this.tag,
required this.asyncLoader,
required this.selectedFiles,
required this.toggleSelectAllFromDay,
required this.areAllFromDaySelected,
required this.limitSelectionToOne,
super.key,
});
@override
Widget build(BuildContext context) {
const kRecycleLimit = 400;
final List<Widget> childGalleries = [];
final subGalleryItemLimit = photoGridSize * subGalleryMultiplier;
for (int index = 0; index < files.length; index += subGalleryItemLimit) {
childGalleries.add(
LazyLoadingGridView(
tag,
files.sublist(
index,
min(index + subGalleryItemLimit, files.length),
),
asyncLoader,
selectedFiles,
index == 0,
files.length > kRecycleLimit,
toggleSelectAllFromDay,
areAllFromDaySelected,
photoGridSize,
limitSelectionToOne: limitSelectionToOne,
),
);
}
return Column(
children: childGalleries,
);
}
}
class LazyLoadingGridView extends StatefulWidget {
final String tag;
final List<File> filesInDay;
final GalleryLoader asyncLoader;
final SelectedFiles? selectedFiles;
final bool shouldRender;
final bool shouldRecycle;
final ValueNotifier toggleSelectAllFromDay;
final ValueNotifier areAllFilesSelected;
final int? photoGridSize;
final bool limitSelectionToOne;
LazyLoadingGridView(
this.tag,
this.filesInDay,
this.asyncLoader,
this.selectedFiles,
this.shouldRender,
this.shouldRecycle,
this.toggleSelectAllFromDay,
this.areAllFilesSelected,
this.photoGridSize, {
this.limitSelectionToOne = false,
Key? key,
}) : super(key: key ?? UniqueKey());
@override
State<LazyLoadingGridView> createState() => _LazyLoadingGridViewState();
}
class _LazyLoadingGridViewState extends State<LazyLoadingGridView> {
late bool _shouldRender;
int? _currentUserID;
late StreamSubscription<ClearSelectionsEvent> _clearSelectionsEvent;
@override
void initState() {
_shouldRender = widget.shouldRender;
_currentUserID = Configuration.instance.getUserID();
widget.selectedFiles?.addListener(_selectedFilesListener);
_clearSelectionsEvent =
Bus.instance.on<ClearSelectionsEvent>().listen((event) {
if (mounted) {
setState(() {});
}
});
widget.toggleSelectAllFromDay.addListener(_toggleSelectAllFromDayListener);
super.initState();
}
@override
void dispose() {
widget.selectedFiles?.removeListener(_selectedFilesListener);
_clearSelectionsEvent.cancel();
widget.toggleSelectAllFromDay
.removeListener(_toggleSelectAllFromDayListener);
super.dispose();
}
@override
void didUpdateWidget(LazyLoadingGridView oldWidget) {
super.didUpdateWidget(oldWidget);
if (!listEquals(widget.filesInDay, oldWidget.filesInDay)) {
_shouldRender = widget.shouldRender;
}
}
@override
Widget build(BuildContext context) {
if (widget.shouldRecycle) {
return RecyclableViewWidget(
shouldRender: _shouldRender,
filesInDay: widget.filesInDay,
photoGridSize: widget.photoGridSize!,
limitSelectionToOne: widget.limitSelectionToOne,
tag: widget.tag,
asyncLoader: widget.asyncLoader,
selectedFiles: widget.selectedFiles,
currentUserID: _currentUserID,
);
} else {
return NonRecyclableViewWidget(
shouldRender: _shouldRender,
filesInDay: widget.filesInDay,
photoGridSize: widget.photoGridSize!,
limitSelectionToOne: widget.limitSelectionToOne,
tag: widget.tag,
asyncLoader: widget.asyncLoader,
selectedFiles: widget.selectedFiles,
currentUserID: _currentUserID,
);
}
}
void _selectedFilesListener() {
if (widget.selectedFiles!.files.containsAll(widget.filesInDay.toSet())) {
widget.areAllFilesSelected.value = true;
} else {
widget.areAllFilesSelected.value = false;
}
bool shouldRefresh = false;
for (final file in widget.filesInDay) {
if (widget.selectedFiles!.isPartOfLastSelected(file)) {
shouldRefresh = true;
}
}
if (shouldRefresh && mounted) {
setState(() {});
}
}
void _toggleSelectAllFromDayListener() {
if (widget.selectedFiles!.files.containsAll(widget.filesInDay.toSet())) {
setState(() {
widget.selectedFiles!.unSelectAll(widget.filesInDay.toSet());
});
} else {
widget.selectedFiles!.selectAll(widget.filesInDay.toSet());
}
}
}
class GalleryGridViewWidget extends StatelessWidget {
final List<File> filesInDay;
final int photoGridSize;
final SelectedFiles? selectedFiles;
final bool limitSelectionToOne;
final String tag;
final int? currentUserID;
final GalleryLoader asyncLoader;
const GalleryGridViewWidget({
required this.filesInDay,
required this.photoGridSize,
this.selectedFiles,
required this.limitSelectionToOne,
required this.tag,
super.key,
this.currentUserID,
required this.asyncLoader,
});
@override
Widget build(BuildContext context) {
return GridView.builder(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
// to disable GridView's scrolling
itemBuilder: (context, index) {
return GalleryFileWidget(
file: filesInDay[index],
selectedFiles: selectedFiles,
limitSelectionToOne: limitSelectionToOne,
tag: tag,
photoGridSize: photoGridSize,
currentUserID: currentUserID,
filesInDay: filesInDay,
asyncLoader: asyncLoader,
);
},
itemCount: filesInDay.length,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisSpacing: 2,
mainAxisSpacing: 2,
crossAxisCount: photoGridSize,
),
padding: const EdgeInsets.symmetric(vertical: (galleryGridSpacing / 2)),
);
}
}
class GalleryFileWidget extends StatelessWidget {
final File file;
final SelectedFiles? selectedFiles;
final bool limitSelectionToOne;
final String tag;
final int photoGridSize;
final int? currentUserID;
final List<File> filesInDay;
final GalleryLoader asyncLoader;
const GalleryFileWidget({
required this.file,
required this.selectedFiles,
required this.limitSelectionToOne,
required this.tag,
required this.photoGridSize,
required this.currentUserID,
required this.filesInDay,
required this.asyncLoader,
super.key,
});
@override
Widget build(BuildContext context) {
final isFileSelected = selectedFiles?.isFileSelected(file) ?? false;
Color selectionColor = Colors.white;
if (isFileSelected &&
file.isUploaded &&
(file.ownerID != currentUserID ||
file.pubMagicMetadata!.uploaderName != null)) {
final avatarColors = getEnteColorScheme(context).avatarColors;
final int randomID = file.ownerID != currentUserID
? file.ownerID!
: file.pubMagicMetadata!.uploaderName.sumAsciiValues;
selectionColor = avatarColors[(randomID).remainder(avatarColors.length)];
}
return GestureDetector(
onTap: () {
limitSelectionToOne
? _onTapWithSelectionLimit(file)
: _onTapNoSelectionLimit(context, file);
},
onLongPress: () {
limitSelectionToOne
? _onLongPressWithSelectionLimit(context, file)
: _onLongPressNoSelectionLimit(context, file);
},
child: ClipRRect(
borderRadius: BorderRadius.circular(1),
child: Stack(
children: [
Hero(
tag: tag + file.tag,
child: ColorFiltered(
colorFilter: ColorFilter.mode(
Colors.black.withOpacity(
isFileSelected ? 0.4 : 0,
),
BlendMode.darken,
),
child: ThumbnailWidget(
file,
diskLoadDeferDuration: thumbnailDiskLoadDeferDuration,
serverLoadDeferDuration: thumbnailServerLoadDeferDuration,
shouldShowLivePhotoOverlay: true,
key: Key(tag + file.tag),
thumbnailSize: photoGridSize < photoGridSizeDefault
? thumbnailLargeSize
: thumbnailSmallSize,
shouldShowOwnerAvatar: !isFileSelected,
),
),
),
Visibility(
visible: isFileSelected,
child: Positioned(
right: 4,
top: 4,
child: Icon(
Icons.check_circle_rounded,
size: 20,
color: selectionColor, //same for both themes
),
),
)
],
),
),
);
}
void _toggleFileSelection(File file) {
selectedFiles!.toggleSelection(file);
}
void _onTapWithSelectionLimit(File file) {
if (selectedFiles!.files.isNotEmpty && selectedFiles!.files.first != file) {
selectedFiles!.clearAll();
}
_toggleFileSelection(file);
}
void _onTapNoSelectionLimit(BuildContext context, File file) async {
if (selectedFiles?.files.isNotEmpty ?? false) {
_toggleFileSelection(file);
} else {
if (AppLifecycleService.instance.mediaExtensionAction.action ==
IntentAction.pick) {
final ioFile = await getFile(file);
MediaExtension().setResult("file://${ioFile!.path}");
} else {
_routeToDetailPage(file, context);
}
}
}
void _onLongPressNoSelectionLimit(BuildContext context, File file) {
if (selectedFiles!.files.isNotEmpty) {
_routeToDetailPage(file, context);
} else if (AppLifecycleService.instance.mediaExtensionAction.action ==
IntentAction.main) {
HapticFeedback.lightImpact();
_toggleFileSelection(file);
}
}
Future<void> _onLongPressWithSelectionLimit(
BuildContext context,
File file,
) async {
if (AppLifecycleService.instance.mediaExtensionAction.action ==
IntentAction.pick) {
final ioFile = await getFile(file);
MediaExtension().setResult("file://${ioFile!.path}");
} else {
_routeToDetailPage(file, context);
}
}
void _routeToDetailPage(File file, BuildContext context) {
final page = DetailPage(
DetailPageConfiguration(
List.unmodifiable(filesInDay),
asyncLoader,
filesInDay.indexOf(file),
tag,
),
);
routeToPage(context, page, forceCustomPageRoute: true);
}
}
class RecyclableViewWidget extends StatefulWidget {
final bool shouldRender;
final List<File> filesInDay;
final int photoGridSize;
final bool limitSelectionToOne;
final String tag;
final GalleryLoader asyncLoader;
final int? currentUserID;
final SelectedFiles? selectedFiles;
const RecyclableViewWidget({
required this.shouldRender,
required this.filesInDay,
required this.photoGridSize,
required this.limitSelectionToOne,
required this.tag,
required this.asyncLoader,
this.currentUserID,
this.selectedFiles,
super.key,
});
@override
State<RecyclableViewWidget> createState() => _RecyclableViewWidgetState();
}
class _RecyclableViewWidgetState extends State<RecyclableViewWidget> {
late bool _shouldRender;
@override
void initState() {
_shouldRender = widget.shouldRender;
super.initState();
}
@override
Widget build(BuildContext context) {
return VisibilityDetector(
key: Key("gallery" + widget.filesInDay.first.tag),
onVisibilityChanged: (visibility) {
final shouldRender = visibility.visibleFraction > 0;
if (mounted && shouldRender != _shouldRender) {
setState(() {
_shouldRender = shouldRender;
});
}
},
child: _shouldRender
? GalleryGridViewWidget(
filesInDay: widget.filesInDay,
photoGridSize: widget.photoGridSize,
limitSelectionToOne: widget.limitSelectionToOne,
tag: widget.tag,
asyncLoader: widget.asyncLoader,
selectedFiles: widget.selectedFiles,
currentUserID: widget.currentUserID,
)
: PlaceHolderWidget(widget.filesInDay.length, widget.photoGridSize),
);
}
}
class NonRecyclableViewWidget extends StatefulWidget {
final bool shouldRender;
final List<File> filesInDay;
final int photoGridSize;
final bool limitSelectionToOne;
final String tag;
final GalleryLoader asyncLoader;
final int? currentUserID;
final SelectedFiles? selectedFiles;
const NonRecyclableViewWidget({
required this.shouldRender,
required this.filesInDay,
required this.photoGridSize,
required this.limitSelectionToOne,
required this.tag,
required this.asyncLoader,
this.currentUserID,
this.selectedFiles,
super.key,
});
@override
State<NonRecyclableViewWidget> createState() =>
_NonRecyclableViewWidgetState();
}
class _NonRecyclableViewWidgetState extends State<NonRecyclableViewWidget> {
late bool _shouldRender;
@override
void initState() {
_shouldRender = widget.shouldRender;
super.initState();
}
@override
Widget build(BuildContext context) {
if (!_shouldRender!) {
return VisibilityDetector(
key: Key("gallery" + widget.filesInDay.first.tag),
onVisibilityChanged: (visibility) {
if (mounted && visibility.visibleFraction > 0 && !_shouldRender) {
setState(() {
_shouldRender = true;
});
}
},
child:
PlaceHolderWidget(widget.filesInDay.length, widget.photoGridSize),
);
} else {
return GalleryGridViewWidget(
filesInDay: widget.filesInDay,
photoGridSize: widget.photoGridSize,
limitSelectionToOne: widget.limitSelectionToOne,
tag: widget.tag,
asyncLoader: widget.asyncLoader,
selectedFiles: widget.selectedFiles,
currentUserID: widget.currentUserID,
);
}
}
}