mirror of
https://github.com/gabehf/Fladder.git
synced 2026-03-14 09:46:01 -07:00
feat: UI 2.0 and other Improvements (#357)
Co-authored-by: PartyDonut <PartyDonut@users.noreply.github.com>
This commit is contained in:
PartyDonut
GitHub
parent
9ca06eaa37
commit
e7b5bb40ff
169 changed files with 4584 additions and 3626 deletions
|
|
@ -11,12 +11,9 @@ import 'package:fladder/models/item_base_model.dart';
|
|||
import 'package:fladder/models/items/photos_model.dart';
|
||||
import 'package:fladder/models/library_search/library_search_model.dart';
|
||||
import 'package:fladder/models/library_search/library_search_options.dart';
|
||||
import 'package:fladder/models/media_playback_model.dart';
|
||||
import 'package:fladder/models/playlist_model.dart';
|
||||
import 'package:fladder/models/settings/home_settings_model.dart';
|
||||
import 'package:fladder/providers/library_search_provider.dart';
|
||||
import 'package:fladder/providers/settings/client_settings_provider.dart';
|
||||
import 'package:fladder/providers/video_player_provider.dart';
|
||||
import 'package:fladder/screens/collections/add_to_collection.dart';
|
||||
import 'package:fladder/screens/library_search/widgets/library_filter_chips.dart';
|
||||
import 'package:fladder/screens/library_search/widgets/library_play_options_.dart';
|
||||
|
|
@ -26,9 +23,9 @@ import 'package:fladder/screens/library_search/widgets/library_views.dart';
|
|||
import 'package:fladder/screens/library_search/widgets/suggestion_search_bar.dart';
|
||||
import 'package:fladder/screens/playlists/add_to_playlists.dart';
|
||||
import 'package:fladder/screens/shared/animated_fade_size.dart';
|
||||
import 'package:fladder/screens/shared/flat_button.dart';
|
||||
import 'package:fladder/screens/shared/nested_bottom_appbar.dart';
|
||||
import 'package:fladder/util/adaptive_layout.dart';
|
||||
import 'package:fladder/screens/shared/nested_scaffold.dart';
|
||||
import 'package:fladder/util/adaptive_layout/adaptive_layout.dart';
|
||||
import 'package:fladder/util/debouncer.dart';
|
||||
import 'package:fladder/util/fab_extended_anim.dart';
|
||||
import 'package:fladder/util/item_base_model/item_base_model_extensions.dart';
|
||||
|
|
@ -37,8 +34,7 @@ import 'package:fladder/util/localization_helper.dart';
|
|||
import 'package:fladder/util/map_bool_helper.dart';
|
||||
import 'package:fladder/util/refresh_state.dart';
|
||||
import 'package:fladder/util/router_extension.dart';
|
||||
import 'package:fladder/util/sliver_list_padding.dart';
|
||||
import 'package:fladder/widgets/navigation_scaffold/components/floating_player_bar.dart';
|
||||
import 'package:fladder/widgets/navigation_scaffold/components/background_image.dart';
|
||||
import 'package:fladder/widgets/navigation_scaffold/components/settings_user_icon.dart';
|
||||
import 'package:fladder/widgets/shared/fladder_scrollbar.dart';
|
||||
import 'package:fladder/widgets/shared/hide_on_scroll.dart';
|
||||
|
|
@ -136,7 +132,6 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
final isEmptySearchScreen = widget.viewModelId == null && widget.favourites == null && widget.folderId == null;
|
||||
final librarySearchResults = ref.watch(providerKey);
|
||||
final postersList = librarySearchResults.posters.hideEmptyChildren(librarySearchResults.hideEmptyShows);
|
||||
final playerState = ref.watch(mediaPlaybackProvider.select((value) => value.state));
|
||||
final libraryViewType = ref.watch(libraryViewTypeProvider);
|
||||
|
||||
ref.listen(
|
||||
|
|
@ -157,19 +152,14 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
libraryProvider.toggleSelectMode();
|
||||
}
|
||||
},
|
||||
child: Scaffold(
|
||||
extendBody: true,
|
||||
extendBodyBehindAppBar: true,
|
||||
floatingActionButtonAnimator:
|
||||
playerState == VideoPlayerState.minimized ? FloatingActionButtonAnimator.noAnimation : null,
|
||||
floatingActionButtonLocation:
|
||||
playerState == VideoPlayerState.minimized ? FloatingActionButtonLocation.centerFloat : null,
|
||||
floatingActionButton: switch (playerState) {
|
||||
VideoPlayerState.minimized => const Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 8),
|
||||
child: FloatingPlayerBar(),
|
||||
),
|
||||
_ => HideOnScroll(
|
||||
child: NestedScaffold(
|
||||
background: BackgroundImage(items: librarySearchResults.activePosters),
|
||||
body: Padding(
|
||||
padding: EdgeInsets.only(left: AdaptiveLayout.of(context).sideBarWidth),
|
||||
child: Scaffold(
|
||||
extendBody: true,
|
||||
extendBodyBehindAppBar: true,
|
||||
floatingActionButton: HideOnScroll(
|
||||
controller: scrollController,
|
||||
visibleBuilder: (visible) => Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
|
|
@ -206,29 +196,26 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
].addInBetween(const SizedBox(height: 10)),
|
||||
),
|
||||
),
|
||||
},
|
||||
bottomNavigationBar: HideOnScroll(
|
||||
controller: AdaptiveLayout.of(context).isDesktop ? null : scrollController,
|
||||
child: IgnorePointer(
|
||||
ignoring: librarySearchResults.fetchingItems,
|
||||
child: _LibrarySearchBottomBar(
|
||||
uniqueKey: uniqueKey,
|
||||
refreshKey: refreshKey,
|
||||
scrollController: scrollController,
|
||||
libraryProvider: libraryProvider,
|
||||
postersList: postersList,
|
||||
bottomNavigationBar: HideOnScroll(
|
||||
controller: AdaptiveLayout.of(context).isDesktop ? null : scrollController,
|
||||
child: IgnorePointer(
|
||||
ignoring: librarySearchResults.fetchingItems,
|
||||
child: _LibrarySearchBottomBar(
|
||||
uniqueKey: uniqueKey,
|
||||
refreshKey: refreshKey,
|
||||
scrollController: scrollController,
|
||||
libraryProvider: libraryProvider,
|
||||
postersList: postersList,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
body: Stack(
|
||||
children: [
|
||||
Positioned.fill(
|
||||
child: Card(
|
||||
elevation: 1,
|
||||
child: PinchPosterZoom(
|
||||
scaleDifference: (difference) => ref.read(clientSettingsProvider.notifier).addPosterSize(difference),
|
||||
child: MediaQuery.removeViewInsets(
|
||||
context: context,
|
||||
body: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
Positioned.fill(
|
||||
child: PinchPosterZoom(
|
||||
scaleDifference: (difference) =>
|
||||
ref.read(clientSettingsProvider.notifier).addPosterSize(difference),
|
||||
child: ClipRRect(
|
||||
borderRadius: AdaptiveLayout.viewSizeOf(context) == ViewSize.desktop
|
||||
? BorderRadius.circular(15)
|
||||
|
|
@ -370,7 +357,7 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
onTapUp: (details) async {
|
||||
if (AdaptiveLayout.of(context).inputDevice == InputDevice.pointer) {
|
||||
double left = details.globalPosition.dx;
|
||||
double top = details.globalPosition.dy + 20;
|
||||
double top = details.globalPosition.dy;
|
||||
await showMenu(
|
||||
context: context,
|
||||
position: RelativeRect.fromLTRB(left, top, 40, 100),
|
||||
|
|
@ -463,16 +450,10 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
padding: const EdgeInsets.all(8),
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: LibraryFilterChips(
|
||||
controller: scrollController,
|
||||
libraryProvider: libraryProvider,
|
||||
librarySearchResults: librarySearchResults,
|
||||
uniqueKey: uniqueKey,
|
||||
postersList: postersList,
|
||||
libraryViewType: libraryViewType,
|
||||
key: uniqueKey,
|
||||
),
|
||||
),
|
||||
),
|
||||
const Row(),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
|
@ -500,13 +481,12 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
),
|
||||
)
|
||||
else
|
||||
SliverToBoxAdapter(
|
||||
SliverFillRemaining(
|
||||
child: Center(
|
||||
child: Text(context.localized.noItemsToShow),
|
||||
),
|
||||
),
|
||||
const DefautlSliverBottomPadding(),
|
||||
const SliverPadding(padding: EdgeInsets.only(bottom: 80))
|
||||
SliverPadding(padding: EdgeInsets.only(bottom: MediaQuery.sizeOf(context).height * 0.20))
|
||||
],
|
||||
),
|
||||
),
|
||||
|
|
@ -514,36 +494,36 @@ class _LibrarySearchScreenState extends ConsumerState<LibrarySearchScreen> {
|
|||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
if (librarySearchResults.fetchingItems) ...[
|
||||
Container(
|
||||
color: Colors.black.withValues(alpha: 0.1),
|
||||
),
|
||||
Center(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
if (librarySearchResults.fetchingItems) ...[
|
||||
Container(
|
||||
color: Colors.black.withValues(alpha: 0.1),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const CircularProgressIndicator.adaptive(),
|
||||
Text(context.localized.fetchingLibrary, style: Theme.of(context).textTheme.titleMedium),
|
||||
IconButton(
|
||||
onPressed: () => libraryProvider.cancelFetch(),
|
||||
icon: const Icon(IconsaxPlusLinear.close_square),
|
||||
)
|
||||
].addInBetween(const SizedBox(width: 16)),
|
||||
Center(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const CircularProgressIndicator.adaptive(),
|
||||
Text(context.localized.fetchingLibrary, style: Theme.of(context).textTheme.titleMedium),
|
||||
IconButton(
|
||||
onPressed: () => libraryProvider.cancelFetch(),
|
||||
icon: const Icon(IconsaxPlusLinear.close_square),
|
||||
)
|
||||
].addInBetween(const SizedBox(width: 16)),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
],
|
||||
)
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
|
@ -663,173 +643,156 @@ class _LibrarySearchBottomBar extends ConsumerWidget {
|
|||
icon: const Icon(IconsaxPlusLinear.save_add),
|
||||
),
|
||||
];
|
||||
return NestedBottomAppBar(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Row(
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(left: MediaQuery.paddingOf(context).left),
|
||||
child: NestedBottomAppBar(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
ScrollStatePosition(
|
||||
controller: scrollController,
|
||||
positionBuilder: (state) => AnimatedFadeSize(
|
||||
child: state != ScrollState.top
|
||||
? Tooltip(
|
||||
message: context.localized.scrollToTop,
|
||||
child: FlatButton(
|
||||
clipBehavior: Clip.antiAlias,
|
||||
elevation: 0,
|
||||
borderRadiusGeometry: BorderRadius.circular(6),
|
||||
onTap: () => scrollController.animateTo(0,
|
||||
duration: const Duration(milliseconds: 500), curve: Curves.easeInOutCubic),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
Row(
|
||||
spacing: 6,
|
||||
children: [
|
||||
ScrollStatePosition(
|
||||
controller: scrollController,
|
||||
positionBuilder: (state) => AnimatedFadeSize(
|
||||
child: state != ScrollState.top
|
||||
? Tooltip(
|
||||
message: context.localized.scrollToTop,
|
||||
child: IconButton.filled(
|
||||
onPressed: () => scrollController.animateTo(0,
|
||||
duration: const Duration(milliseconds: 500), curve: Curves.easeInOutCubic),
|
||||
icon: const Icon(
|
||||
IconsaxPlusLinear.arrow_up,
|
||||
),
|
||||
),
|
||||
padding: const EdgeInsets.all(6),
|
||||
child: Icon(
|
||||
IconsaxPlusLinear.arrow_up,
|
||||
color: Theme.of(context).colorScheme.onPrimaryContainer,
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
: const SizedBox(),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
if (!librarySearchResults.selecteMode) ...{
|
||||
const SizedBox(width: 6),
|
||||
IconButton(
|
||||
tooltip: context.localized.sortBy,
|
||||
onPressed: () async {
|
||||
final newOptions = await openSortByDialogue(
|
||||
context,
|
||||
libraryProvider: libraryProvider,
|
||||
uniqueKey: uniqueKey,
|
||||
options: (librarySearchResults.sortingOption, librarySearchResults.sortOrder),
|
||||
);
|
||||
if (newOptions != null) {
|
||||
if (newOptions.$1 != null) {
|
||||
libraryProvider.setSortBy(newOptions.$1!);
|
||||
}
|
||||
if (newOptions.$2 != null) {
|
||||
libraryProvider.setSortOrder(newOptions.$2!);
|
||||
}
|
||||
}
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.sort),
|
||||
),
|
||||
if (librarySearchResults.hasActiveFilters) ...{
|
||||
const SizedBox(width: 6),
|
||||
IconButton(
|
||||
tooltip: context.localized.disableFilters,
|
||||
onPressed: disableFilters(librarySearchResults, libraryProvider),
|
||||
icon: const Icon(IconsaxPlusLinear.filter_remove),
|
||||
),
|
||||
},
|
||||
},
|
||||
const SizedBox(width: 6),
|
||||
IconButton(
|
||||
onPressed: () => libraryProvider.toggleSelectMode(),
|
||||
color: librarySearchResults.selecteMode ? Theme.of(context).colorScheme.primary : null,
|
||||
icon: const Icon(IconsaxPlusLinear.category_2),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
AnimatedFadeSize(
|
||||
child: librarySearchResults.selecteMode
|
||||
? Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(16)),
|
||||
child: Row(
|
||||
children: [
|
||||
Tooltip(
|
||||
message: context.localized.selectAll,
|
||||
child: IconButton(
|
||||
onPressed: () => libraryProvider.selectAll(true),
|
||||
icon: const Icon(IconsaxPlusLinear.box_add),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Tooltip(
|
||||
message: context.localized.clearSelection,
|
||||
child: IconButton(
|
||||
onPressed: () => libraryProvider.selectAll(false),
|
||||
icon: const Icon(IconsaxPlusLinear.box_remove),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
if (librarySearchResults.selectedPosters.isNotEmpty) ...{
|
||||
if (AdaptiveLayout.of(context).isDesktop)
|
||||
PopupMenuButton(
|
||||
itemBuilder: (context) => actions.popupMenuItems(useIcons: true),
|
||||
)
|
||||
else
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
showBottomSheetPill(
|
||||
context: context,
|
||||
content: (context, scrollController) => ListView(
|
||||
shrinkWrap: true,
|
||||
controller: scrollController,
|
||||
children: actions.listTileItems(context, useIcons: true),
|
||||
),
|
||||
);
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.more))
|
||||
},
|
||||
],
|
||||
),
|
||||
)
|
||||
: const SizedBox(),
|
||||
),
|
||||
const Spacer(),
|
||||
if (librarySearchResults.activePosters.isNotEmpty)
|
||||
IconButton(
|
||||
tooltip: context.localized.random,
|
||||
onPressed: () => libraryProvider.openRandom(context),
|
||||
icon: Card(
|
||||
color: Theme.of(context).colorScheme.secondary,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(2.0),
|
||||
child: Icon(
|
||||
IconsaxPlusBold.arrow_up_1,
|
||||
color: Theme.of(context).colorScheme.onSecondary,
|
||||
),
|
||||
)
|
||||
: const SizedBox(),
|
||||
),
|
||||
),
|
||||
),
|
||||
if (librarySearchResults.activePosters.isNotEmpty)
|
||||
IconButton(
|
||||
tooltip: context.localized.shuffleVideos,
|
||||
onPressed: () async {
|
||||
if (librarySearchResults.showGalleryButtons && !librarySearchResults.showPlayButtons) {
|
||||
libraryProvider.viewGallery(context, shuffle: true);
|
||||
return;
|
||||
} else if (!librarySearchResults.showGalleryButtons && librarySearchResults.showPlayButtons) {
|
||||
libraryProvider.playLibraryItems(context, ref, shuffle: true);
|
||||
return;
|
||||
}
|
||||
|
||||
await showLibraryPlayOptions(
|
||||
context,
|
||||
context.localized.libraryShuffleAndPlayItems,
|
||||
playVideos: librarySearchResults.showPlayButtons
|
||||
? () => libraryProvider.playLibraryItems(context, ref, shuffle: true)
|
||||
: null,
|
||||
viewGallery: librarySearchResults.showGalleryButtons
|
||||
? () => libraryProvider.viewGallery(context, shuffle: true)
|
||||
: null,
|
||||
);
|
||||
if (!librarySearchResults.selecteMode) ...{
|
||||
IconButton(
|
||||
tooltip: context.localized.sortBy,
|
||||
onPressed: () async {
|
||||
final newOptions = await openSortByDialogue(
|
||||
context,
|
||||
libraryProvider: libraryProvider,
|
||||
uniqueKey: uniqueKey,
|
||||
options: (librarySearchResults.sortingOption, librarySearchResults.sortOrder),
|
||||
);
|
||||
if (newOptions != null) {
|
||||
if (newOptions.$1 != null) {
|
||||
libraryProvider.setSortBy(newOptions.$1!);
|
||||
}
|
||||
if (newOptions.$2 != null) {
|
||||
libraryProvider.setSortOrder(newOptions.$2!);
|
||||
}
|
||||
}
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.sort),
|
||||
),
|
||||
if (librarySearchResults.hasActiveFilters) ...{
|
||||
IconButton(
|
||||
tooltip: context.localized.disableFilters,
|
||||
onPressed: disableFilters(librarySearchResults, libraryProvider),
|
||||
icon: const Icon(IconsaxPlusLinear.filter_remove),
|
||||
),
|
||||
},
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.shuffle),
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () => libraryProvider.toggleSelectMode(),
|
||||
color: librarySearchResults.selecteMode ? Theme.of(context).colorScheme.primary : null,
|
||||
icon: const Icon(IconsaxPlusLinear.category_2),
|
||||
),
|
||||
AnimatedFadeSize(
|
||||
child: librarySearchResults.selecteMode
|
||||
? Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(16)),
|
||||
child: Row(
|
||||
spacing: 6,
|
||||
children: [
|
||||
Tooltip(
|
||||
message: context.localized.selectAll,
|
||||
child: IconButton(
|
||||
onPressed: () => libraryProvider.selectAll(true),
|
||||
icon: const Icon(IconsaxPlusLinear.box_add),
|
||||
),
|
||||
),
|
||||
Tooltip(
|
||||
message: context.localized.clearSelection,
|
||||
child: IconButton(
|
||||
onPressed: () => libraryProvider.selectAll(false),
|
||||
icon: const Icon(IconsaxPlusLinear.box_remove),
|
||||
),
|
||||
),
|
||||
if (librarySearchResults.selectedPosters.isNotEmpty) ...{
|
||||
if (AdaptiveLayout.of(context).isDesktop)
|
||||
PopupMenuButton(
|
||||
itemBuilder: (context) => actions.popupMenuItems(useIcons: true),
|
||||
)
|
||||
else
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
showBottomSheetPill(
|
||||
context: context,
|
||||
content: (context, scrollController) => ListView(
|
||||
shrinkWrap: true,
|
||||
controller: scrollController,
|
||||
children: actions.listTileItems(context, useIcons: true),
|
||||
),
|
||||
);
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.more))
|
||||
},
|
||||
],
|
||||
),
|
||||
)
|
||||
: const SizedBox(),
|
||||
),
|
||||
const Spacer(),
|
||||
if (librarySearchResults.activePosters.isNotEmpty)
|
||||
IconButton.filledTonal(
|
||||
tooltip: context.localized.random,
|
||||
onPressed: () => libraryProvider.openRandom(context),
|
||||
icon: const Icon(
|
||||
IconsaxPlusBold.arrow_up_1,
|
||||
),
|
||||
),
|
||||
if (librarySearchResults.activePosters.isNotEmpty)
|
||||
IconButton(
|
||||
tooltip: context.localized.shuffleVideos,
|
||||
onPressed: () async {
|
||||
if (librarySearchResults.showGalleryButtons && !librarySearchResults.showPlayButtons) {
|
||||
libraryProvider.viewGallery(context, shuffle: true);
|
||||
return;
|
||||
} else if (!librarySearchResults.showGalleryButtons && librarySearchResults.showPlayButtons) {
|
||||
libraryProvider.playLibraryItems(context, ref, shuffle: true);
|
||||
return;
|
||||
}
|
||||
|
||||
await showLibraryPlayOptions(
|
||||
context,
|
||||
context.localized.libraryShuffleAndPlayItems,
|
||||
playVideos: librarySearchResults.showPlayButtons
|
||||
? () => libraryProvider.playLibraryItems(context, ref, shuffle: true)
|
||||
: null,
|
||||
viewGallery: librarySearchResults.showGalleryButtons
|
||||
? () => libraryProvider.viewGallery(context, shuffle: true)
|
||||
: null,
|
||||
);
|
||||
},
|
||||
icon: const Icon(IconsaxPlusLinear.shuffle),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
if (AdaptiveLayout.of(context).isDesktop) const SizedBox(height: 8),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,221 +1,193 @@
|
|||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:iconsax_plus/iconsax_plus.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:iconsax_plus/iconsax_plus.dart';
|
||||
|
||||
import 'package:fladder/jellyfin/jellyfin_open_api.enums.swagger.dart';
|
||||
import 'package:fladder/models/item_base_model.dart';
|
||||
import 'package:fladder/models/items/item_shared_models.dart';
|
||||
import 'package:fladder/models/library_search/library_search_model.dart';
|
||||
import 'package:fladder/models/library_search/library_search_options.dart';
|
||||
import 'package:fladder/providers/library_search_provider.dart';
|
||||
import 'package:fladder/screens/library_search/widgets/library_views.dart';
|
||||
import 'package:fladder/screens/shared/chips/category_chip.dart';
|
||||
import 'package:fladder/util/list_padding.dart';
|
||||
import 'package:fladder/util/localization_helper.dart';
|
||||
import 'package:fladder/util/map_bool_helper.dart';
|
||||
import 'package:fladder/util/refresh_state.dart';
|
||||
import 'package:fladder/widgets/shared/scroll_position.dart';
|
||||
|
||||
class LibraryFilterChips extends ConsumerWidget {
|
||||
final Key uniqueKey;
|
||||
final ScrollController controller;
|
||||
final LibrarySearchModel librarySearchResults;
|
||||
final LibrarySearchNotifier libraryProvider;
|
||||
final List<ItemBaseModel> postersList;
|
||||
final LibraryViewTypes libraryViewType;
|
||||
const LibraryFilterChips({
|
||||
required this.uniqueKey,
|
||||
required this.controller,
|
||||
required this.librarySearchResults,
|
||||
required this.libraryProvider,
|
||||
required this.postersList,
|
||||
required this.libraryViewType,
|
||||
super.key,
|
||||
});
|
||||
class LibraryFilterChips extends ConsumerStatefulWidget {
|
||||
const LibraryFilterChips({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
return ScrollStatePosition(
|
||||
controller: controller,
|
||||
positionBuilder: (state) {
|
||||
return Row(
|
||||
mainAxisAlignment: MainAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: libraryFilterChips(
|
||||
context,
|
||||
ref,
|
||||
uniqueKey,
|
||||
librarySearchResults: librarySearchResults,
|
||||
libraryProvider: libraryProvider,
|
||||
postersList: postersList,
|
||||
libraryViewType: libraryViewType,
|
||||
).addPadding(const EdgeInsets.symmetric(horizontal: 8)),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
ConsumerState<ConsumerStatefulWidget> createState() => _LibraryFilterChipsState();
|
||||
}
|
||||
|
||||
List<Widget> libraryFilterChips(
|
||||
BuildContext context,
|
||||
WidgetRef ref,
|
||||
Key uniqueKey, {
|
||||
required LibrarySearchModel librarySearchResults,
|
||||
required LibrarySearchNotifier libraryProvider,
|
||||
required List<ItemBaseModel> postersList,
|
||||
required LibraryViewTypes libraryViewType,
|
||||
}) {
|
||||
Future<dynamic> openGroupDialogue() {
|
||||
return showDialog(
|
||||
class _LibraryFilterChipsState extends ConsumerState<LibraryFilterChips> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final uniqueKey = widget.key ?? UniqueKey();
|
||||
final libraryProvider = ref.watch(librarySearchProvider(uniqueKey).notifier);
|
||||
final groupBy = ref.watch(librarySearchProvider(uniqueKey).select((v) => v.groupBy));
|
||||
final favourites = ref.watch(librarySearchProvider(uniqueKey).select((v) => v.favourites));
|
||||
final recursive = ref.watch(librarySearchProvider(uniqueKey).select((v) => v.recursive));
|
||||
final hideEmpty = ref.watch(librarySearchProvider(uniqueKey).select((v) => v.hideEmptyShows));
|
||||
final librarySearchResults = ref.watch(librarySearchProvider(uniqueKey));
|
||||
|
||||
return Row(
|
||||
spacing: 8,
|
||||
children: [
|
||||
if (librarySearchResults.folderOverwrite.isEmpty)
|
||||
CategoryChip(
|
||||
label: Text(context.localized.library(2)),
|
||||
items: librarySearchResults.views,
|
||||
labelBuilder: (item) => Text(item.name),
|
||||
onSave: (value) => libraryProvider.setViews(value),
|
||||
onCancel: () => libraryProvider.setViews(librarySearchResults.views),
|
||||
onClear: () => libraryProvider.setViews(librarySearchResults.views.setAll(false)),
|
||||
),
|
||||
CategoryChip<FladderItemType>(
|
||||
label: Text(context.localized.type(librarySearchResults.types.length)),
|
||||
items: librarySearchResults.types,
|
||||
labelBuilder: (item) => Row(
|
||||
children: [
|
||||
Icon(item.icon),
|
||||
const SizedBox(width: 12),
|
||||
Text(item.label(context)),
|
||||
],
|
||||
),
|
||||
onSave: (value) => libraryProvider.setTypes(value),
|
||||
onClear: () => libraryProvider.setTypes(librarySearchResults.types.setAll(false)),
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.favorites),
|
||||
avatar: Icon(
|
||||
favourites ? IconsaxPlusBold.heart : IconsaxPlusLinear.heart,
|
||||
color: Theme.of(context).colorScheme.onSurface,
|
||||
),
|
||||
selected: favourites,
|
||||
showCheckmark: false,
|
||||
onSelected: (_) {
|
||||
libraryProvider.toggleFavourite();
|
||||
context.refreshData();
|
||||
},
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.recursive),
|
||||
selected: recursive,
|
||||
onSelected: (_) {
|
||||
libraryProvider.toggleRecursive();
|
||||
context.refreshData();
|
||||
},
|
||||
),
|
||||
if (librarySearchResults.genres.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.genre(librarySearchResults.genres.length)),
|
||||
activeIcon: IconsaxPlusBold.hierarchy_2,
|
||||
items: librarySearchResults.genres,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setGenres(value),
|
||||
onCancel: () => libraryProvider.setGenres(librarySearchResults.genres),
|
||||
onClear: () => libraryProvider.setGenres(librarySearchResults.genres.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.studios.isNotEmpty)
|
||||
CategoryChip<Studio>(
|
||||
label: Text(context.localized.studio(librarySearchResults.studios.length)),
|
||||
activeIcon: IconsaxPlusBold.airdrop,
|
||||
items: librarySearchResults.studios,
|
||||
labelBuilder: (item) => Text(item.name),
|
||||
onSave: (value) => libraryProvider.setStudios(value),
|
||||
onCancel: () => libraryProvider.setStudios(librarySearchResults.studios),
|
||||
onClear: () => libraryProvider.setStudios(librarySearchResults.studios.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.tags.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.label(librarySearchResults.tags.length)),
|
||||
activeIcon: Icons.label_rounded,
|
||||
items: librarySearchResults.tags,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setTags(value),
|
||||
onCancel: () => libraryProvider.setTags(librarySearchResults.tags),
|
||||
onClear: () => libraryProvider.setTags(librarySearchResults.tags.setAll(false)),
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.group),
|
||||
selected: groupBy != GroupBy.none,
|
||||
onSelected: (_) {
|
||||
_openGroupDialogue(context, ref, libraryProvider, uniqueKey);
|
||||
},
|
||||
),
|
||||
CategoryChip<ItemFilter>(
|
||||
label: Text(context.localized.filter(librarySearchResults.filters.length)),
|
||||
items: librarySearchResults.filters,
|
||||
labelBuilder: (item) => Text(item.label(context)),
|
||||
onSave: (value) => libraryProvider.setFilters(value),
|
||||
onClear: () => libraryProvider.setFilters(librarySearchResults.filters.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.types[FladderItemType.series] == true)
|
||||
FilterChip(
|
||||
avatar: Icon(
|
||||
hideEmpty ? Icons.visibility_off_rounded : Icons.visibility_rounded,
|
||||
color: Theme.of(context).colorScheme.onSurface,
|
||||
),
|
||||
selected: hideEmpty,
|
||||
showCheckmark: false,
|
||||
label: Text(context.localized.hideEmpty),
|
||||
onSelected: libraryProvider.setHideEmpty,
|
||||
),
|
||||
if (librarySearchResults.officialRatings.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.rating(librarySearchResults.officialRatings.length)),
|
||||
activeIcon: Icons.star_rate_rounded,
|
||||
items: librarySearchResults.officialRatings,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setRatings(value),
|
||||
onCancel: () => libraryProvider.setRatings(librarySearchResults.officialRatings),
|
||||
onClear: () => libraryProvider.setRatings(librarySearchResults.officialRatings.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.years.isNotEmpty)
|
||||
CategoryChip<int>(
|
||||
label: Text(context.localized.year(librarySearchResults.years.length)),
|
||||
items: librarySearchResults.years,
|
||||
labelBuilder: (item) => Text(item.toString()),
|
||||
onSave: (value) => libraryProvider.setYears(value),
|
||||
onCancel: () => libraryProvider.setYears(librarySearchResults.years),
|
||||
onClear: () => libraryProvider.setYears(librarySearchResults.years.setAll(false)),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
void _openGroupDialogue(
|
||||
BuildContext context,
|
||||
WidgetRef ref,
|
||||
LibrarySearchNotifier provider,
|
||||
Key uniqueKey,
|
||||
) {
|
||||
showDialog(
|
||||
context: context,
|
||||
builder: (context) {
|
||||
return Consumer(
|
||||
builder: (context, ref, child) {
|
||||
return AlertDialog(
|
||||
content: SizedBox(
|
||||
width: MediaQuery.of(context).size.width * 0.65,
|
||||
child: ListView(
|
||||
shrinkWrap: true,
|
||||
children: [
|
||||
Text(context.localized.groupBy),
|
||||
...GroupBy.values.map((groupBy) => RadioListTile.adaptive(
|
||||
value: groupBy,
|
||||
title: Text(groupBy.value(context)),
|
||||
groupValue: ref.watch(librarySearchProvider(uniqueKey).select((value) => value.groupBy)),
|
||||
onChanged: (value) {
|
||||
libraryProvider.setGroupBy(groupBy);
|
||||
Navigator.pop(context);
|
||||
},
|
||||
)),
|
||||
],
|
||||
final groupBy = ref.watch(librarySearchProvider(uniqueKey).select((v) => v.groupBy));
|
||||
return AlertDialog(
|
||||
content: SizedBox(
|
||||
width: MediaQuery.of(context).size.width * 0.65,
|
||||
child: ListView(
|
||||
shrinkWrap: true,
|
||||
children: [
|
||||
Text(context.localized.groupBy),
|
||||
...GroupBy.values.map(
|
||||
(group) => RadioListTile.adaptive(
|
||||
value: group,
|
||||
groupValue: groupBy,
|
||||
title: Text(group.value(context)),
|
||||
onChanged: (_) {
|
||||
provider.setGroupBy(group);
|
||||
Navigator.pop(context);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return [
|
||||
if (librarySearchResults.folderOverwrite.isEmpty)
|
||||
CategoryChip(
|
||||
label: Text(context.localized.library(2)),
|
||||
items: librarySearchResults.views,
|
||||
labelBuilder: (item) => Text(item.name),
|
||||
onSave: (value) => libraryProvider.setViews(value),
|
||||
onCancel: () => libraryProvider.setViews(librarySearchResults.views),
|
||||
onClear: () => libraryProvider.setViews(librarySearchResults.views.setAll(false)),
|
||||
),
|
||||
CategoryChip<FladderItemType>(
|
||||
label: Text(context.localized.type(librarySearchResults.types.length)),
|
||||
items: librarySearchResults.types,
|
||||
labelBuilder: (item) => Row(
|
||||
children: [
|
||||
Icon(item.icon),
|
||||
const SizedBox(width: 12),
|
||||
Text(item.label(context)),
|
||||
],
|
||||
),
|
||||
onSave: (value) => libraryProvider.setTypes(value),
|
||||
onClear: () => libraryProvider.setTypes(librarySearchResults.types.setAll(false)),
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.favorites),
|
||||
avatar: Icon(
|
||||
librarySearchResults.favourites ? IconsaxPlusBold.heart : IconsaxPlusLinear.heart,
|
||||
color: Theme.of(context).colorScheme.onSurface,
|
||||
),
|
||||
selected: librarySearchResults.favourites,
|
||||
showCheckmark: false,
|
||||
onSelected: (value) {
|
||||
libraryProvider.toggleFavourite();
|
||||
context.refreshData();
|
||||
},
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.recursive),
|
||||
selected: librarySearchResults.recursive,
|
||||
onSelected: (value) {
|
||||
libraryProvider.toggleRecursive();
|
||||
context.refreshData();
|
||||
},
|
||||
),
|
||||
if (librarySearchResults.genres.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.genre(librarySearchResults.genres.length)),
|
||||
activeIcon: IconsaxPlusBold.hierarchy_2,
|
||||
items: librarySearchResults.genres,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setGenres(value),
|
||||
onCancel: () => libraryProvider.setGenres(librarySearchResults.genres),
|
||||
onClear: () => libraryProvider.setGenres(librarySearchResults.genres.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.studios.isNotEmpty)
|
||||
CategoryChip<Studio>(
|
||||
label: Text(context.localized.studio(librarySearchResults.studios.length)),
|
||||
activeIcon: IconsaxPlusBold.airdrop,
|
||||
items: librarySearchResults.studios,
|
||||
labelBuilder: (item) => Text(item.name),
|
||||
onSave: (value) => libraryProvider.setStudios(value),
|
||||
onCancel: () => libraryProvider.setStudios(librarySearchResults.studios),
|
||||
onClear: () => libraryProvider.setStudios(librarySearchResults.studios.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.tags.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.label(librarySearchResults.tags.length)),
|
||||
activeIcon: Icons.label_rounded,
|
||||
items: librarySearchResults.tags,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setTags(value),
|
||||
onCancel: () => libraryProvider.setTags(librarySearchResults.tags),
|
||||
onClear: () => libraryProvider.setTags(librarySearchResults.tags.setAll(false)),
|
||||
),
|
||||
FilterChip(
|
||||
label: Text(context.localized.group),
|
||||
selected: librarySearchResults.groupBy != GroupBy.none,
|
||||
onSelected: (value) {
|
||||
openGroupDialogue();
|
||||
},
|
||||
),
|
||||
CategoryChip<ItemFilter>(
|
||||
label: Text(context.localized.filter(librarySearchResults.filters.length)),
|
||||
items: librarySearchResults.filters,
|
||||
labelBuilder: (item) => Text(item.label(context)),
|
||||
onSave: (value) => libraryProvider.setFilters(value),
|
||||
onClear: () => libraryProvider.setFilters(librarySearchResults.filters.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.types[FladderItemType.series] == true)
|
||||
FilterChip(
|
||||
avatar: Icon(
|
||||
librarySearchResults.hideEmptyShows ? Icons.visibility_off_rounded : Icons.visibility_rounded,
|
||||
color: Theme.of(context).colorScheme.onSurface,
|
||||
),
|
||||
selected: librarySearchResults.hideEmptyShows,
|
||||
showCheckmark: false,
|
||||
label: Text(context.localized.hideEmpty),
|
||||
onSelected: libraryProvider.setHideEmpty,
|
||||
),
|
||||
if (librarySearchResults.officialRatings.isNotEmpty)
|
||||
CategoryChip<String>(
|
||||
label: Text(context.localized.rating(librarySearchResults.officialRatings.length)),
|
||||
activeIcon: Icons.star_rate_rounded,
|
||||
items: librarySearchResults.officialRatings,
|
||||
labelBuilder: (item) => Text(item),
|
||||
onSave: (value) => libraryProvider.setRatings(value),
|
||||
onCancel: () => libraryProvider.setRatings(librarySearchResults.officialRatings),
|
||||
onClear: () => libraryProvider.setRatings(librarySearchResults.officialRatings.setAll(false)),
|
||||
),
|
||||
if (librarySearchResults.years.isNotEmpty)
|
||||
CategoryChip<int>(
|
||||
label: Text(context.localized.year(librarySearchResults.years.length)),
|
||||
items: librarySearchResults.years,
|
||||
labelBuilder: (item) => Text(item.toString()),
|
||||
onSave: (value) => libraryProvider.setYears(value),
|
||||
onCancel: () => libraryProvider.setYears(librarySearchResults.years),
|
||||
onClear: () => libraryProvider.setYears(librarySearchResults.years.setAll(false)),
|
||||
),
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,16 @@
|
|||
import 'dart:ui';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:collection/collection.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
|
||||
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
|
||||
import 'package:iconsax_plus/iconsax_plus.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:page_transition/page_transition.dart';
|
||||
import 'package:sliver_tools/sliver_tools.dart';
|
||||
|
||||
import 'package:fladder/models/boxset_model.dart';
|
||||
import 'package:fladder/models/item_base_model.dart';
|
||||
import 'package:fladder/models/items/photos_model.dart';
|
||||
|
|
@ -10,22 +19,15 @@ import 'package:fladder/models/playlist_model.dart';
|
|||
import 'package:fladder/providers/library_search_provider.dart';
|
||||
import 'package:fladder/providers/settings/client_settings_provider.dart';
|
||||
import 'package:fladder/screens/photo_viewer/photo_viewer_screen.dart';
|
||||
import 'package:fladder/screens/shared/media/poster_grid.dart';
|
||||
import 'package:fladder/screens/shared/media/poster_list_item.dart';
|
||||
import 'package:fladder/screens/shared/media/poster_widget.dart';
|
||||
import 'package:fladder/util/adaptive_layout.dart';
|
||||
import 'package:fladder/util/adaptive_layout/adaptive_layout.dart';
|
||||
import 'package:fladder/util/item_base_model/item_base_model_extensions.dart';
|
||||
import 'package:fladder/util/localization_helper.dart';
|
||||
import 'package:fladder/util/refresh_state.dart';
|
||||
import 'package:fladder/util/string_extensions.dart';
|
||||
import 'package:fladder/util/theme_extensions.dart';
|
||||
import 'package:fladder/widgets/shared/item_actions.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:page_transition/page_transition.dart';
|
||||
import 'package:sliver_tools/sliver_tools.dart';
|
||||
import 'package:sticky_headers/sticky_headers/widget.dart';
|
||||
|
||||
final libraryViewTypeProvider = StateProvider<LibraryViewTypes>((ref) {
|
||||
return LibraryViewTypes.grid;
|
||||
|
|
@ -107,179 +109,139 @@ class LibraryViews extends ConsumerWidget {
|
|||
|
||||
switch (ref.watch(libraryViewTypeProvider)) {
|
||||
case LibraryViewTypes.grid:
|
||||
if (groupByType != GroupBy.none) {
|
||||
final groupedItems = groupItemsBy(context, items, groupByType);
|
||||
return SliverList.builder(
|
||||
itemCount: groupedItems.length,
|
||||
Widget createGrid(List<ItemBaseModel> items) {
|
||||
return SliverGrid.builder(
|
||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: posterSize.toInt(),
|
||||
mainAxisSpacing: (8 * decimal) + 8,
|
||||
crossAxisSpacing: (8 * decimal) + 8,
|
||||
childAspectRatio: items.getMostCommonType.aspectRatio,
|
||||
),
|
||||
itemCount: items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final name = groupedItems.keys.elementAt(index);
|
||||
final group = groupedItems[name];
|
||||
if (group?.isEmpty ?? false || group == null) {
|
||||
return Text(context.localized.empty);
|
||||
}
|
||||
return PosterGrid(
|
||||
posters: group!,
|
||||
name: name,
|
||||
itemBuilder: (context, index) {
|
||||
final item = group[index];
|
||||
return PosterWidget(
|
||||
key: Key(item.id),
|
||||
poster: group[index],
|
||||
maxLines: 2,
|
||||
heroTag: true,
|
||||
subTitle: item.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(item),
|
||||
selected: selected.contains(item),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
final item = items[index];
|
||||
return PosterWidget(
|
||||
key: Key(item.id),
|
||||
poster: item,
|
||||
maxLines: 2,
|
||||
heroTag: true,
|
||||
subTitle: item.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(item),
|
||||
selected: selected.contains(item),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
if (groupByType != GroupBy.none) {
|
||||
final groupedItems = groupItemsBy(context, items, groupByType);
|
||||
return MultiSliver(
|
||||
children: groupedItems.entries.map(
|
||||
(element) {
|
||||
final name = element.key;
|
||||
final group = element.value;
|
||||
return stickyHeaderBuilder(
|
||||
context,
|
||||
header: name,
|
||||
sliver: createGrid(group),
|
||||
);
|
||||
},
|
||||
).toList());
|
||||
} else {
|
||||
return SliverPadding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8),
|
||||
sliver: SliverGrid.builder(
|
||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: posterSize.toInt(),
|
||||
mainAxisSpacing: (8 * decimal) + 8,
|
||||
crossAxisSpacing: (8 * decimal) + 8,
|
||||
childAspectRatio: AdaptiveLayout.poster(context).ratio,
|
||||
),
|
||||
itemCount: items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final item = items[index];
|
||||
return PosterWidget(
|
||||
key: Key(item.id),
|
||||
poster: item,
|
||||
maxLines: 2,
|
||||
heroTag: true,
|
||||
subTitle: item.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(item),
|
||||
selected: selected.contains(item),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
),
|
||||
sliver: createGrid(items),
|
||||
);
|
||||
}
|
||||
case LibraryViewTypes.list:
|
||||
if (groupByType != GroupBy.none) {
|
||||
final groupedItems = groupItemsBy(context, items, groupByType);
|
||||
Widget listBuilder(List<ItemBaseModel> items) {
|
||||
return SliverList.builder(
|
||||
itemCount: groupedItems.length,
|
||||
itemCount: items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final name = groupedItems.keys.elementAt(index);
|
||||
final group = groupedItems[name];
|
||||
if (group?.isEmpty ?? false) {
|
||||
return Text(context.localized.empty);
|
||||
}
|
||||
return StickyHeader(
|
||||
header: Text(name, style: Theme.of(context).textTheme.headlineSmall),
|
||||
content: ListView.builder(
|
||||
shrinkWrap: true,
|
||||
padding: EdgeInsets.zero,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
itemCount: group?.length,
|
||||
itemBuilder: (context, index) {
|
||||
final poster = group![index];
|
||||
return PosterListItem(
|
||||
key: Key(poster.id),
|
||||
poster: poster,
|
||||
subTitle: poster.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(poster),
|
||||
selected: selected.contains(poster),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
),
|
||||
final poster = items[index];
|
||||
return PosterListItem(
|
||||
poster: poster,
|
||||
selected: selected.contains(poster),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(poster),
|
||||
subTitle: poster.subTitle(sortingOptions),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
return SliverList.builder(
|
||||
itemCount: items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final poster = items[index];
|
||||
return PosterListItem(
|
||||
poster: poster,
|
||||
selected: selected.contains(poster),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(poster),
|
||||
subTitle: poster.subTitle(sortingOptions),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
);
|
||||
if (groupByType != GroupBy.none) {
|
||||
final groupedItems = groupItemsBy(context, items, groupByType);
|
||||
return MultiSliver(
|
||||
children: groupedItems.entries.map(
|
||||
(element) {
|
||||
final name = element.key;
|
||||
final group = element.value;
|
||||
return stickyHeaderBuilder(
|
||||
context,
|
||||
header: name,
|
||||
sliver: listBuilder(group),
|
||||
);
|
||||
},
|
||||
).toList());
|
||||
}
|
||||
return listBuilder(items);
|
||||
case LibraryViewTypes.masonry:
|
||||
if (groupByType != GroupBy.none) {
|
||||
final groupedItems = groupItemsBy(context, items, groupByType);
|
||||
return SliverList.builder(
|
||||
itemCount: groupedItems.length,
|
||||
itemBuilder: (context, index) {
|
||||
final name = groupedItems.keys.elementAt(index);
|
||||
final group = groupedItems[name];
|
||||
if (group?.isEmpty ?? false) {
|
||||
return Text(context.localized.empty);
|
||||
}
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(top: index == 0 ? 0 : 64.0),
|
||||
child: StickyHeader(
|
||||
header: Text(name, style: Theme.of(context).textTheme.headlineMedium),
|
||||
overlapHeaders: true,
|
||||
content: Padding(
|
||||
padding: const EdgeInsets.only(top: 16.0),
|
||||
child: MasonryGridView.builder(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
mainAxisSpacing: (8 * decimal) + 8,
|
||||
crossAxisSpacing: (8 * decimal) + 8,
|
||||
gridDelegate: SliverSimpleGridDelegateWithMaxCrossAxisExtent(
|
||||
maxCrossAxisExtent:
|
||||
(MediaQuery.sizeOf(context).width ~/ (lerpDouble(250, 75, posterSizeMultiplier) ?? 1.0))
|
||||
.toDouble() *
|
||||
20,
|
||||
),
|
||||
itemCount: group!.length,
|
||||
itemBuilder: (context, index) {
|
||||
final item = group[index];
|
||||
return PosterWidget(
|
||||
key: Key(item.id),
|
||||
poster: item,
|
||||
aspectRatio: item.primaryRatio,
|
||||
selected: selected.contains(item),
|
||||
inlineTitle: true,
|
||||
heroTag: true,
|
||||
subTitle: item.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(group[index]),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
),
|
||||
)),
|
||||
return MultiSliver(
|
||||
children: groupedItems.entries.map(
|
||||
(element) {
|
||||
final name = element.key;
|
||||
final group = element.value;
|
||||
return stickyHeaderBuilder(
|
||||
context,
|
||||
header: name,
|
||||
//MasonryGridView because SliverMasonryGrid breaks scrolling
|
||||
sliver: SliverToBoxAdapter(
|
||||
child: MasonryGridView.builder(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
mainAxisSpacing: (8 * decimal) + 8,
|
||||
crossAxisSpacing: (8 * decimal) + 8,
|
||||
gridDelegate: SliverSimpleGridDelegateWithMaxCrossAxisExtent(
|
||||
maxCrossAxisExtent:
|
||||
(MediaQuery.sizeOf(context).width ~/ (lerpDouble(250, 75, posterSizeMultiplier) ?? 1.0))
|
||||
.toDouble() *
|
||||
12,
|
||||
),
|
||||
itemCount: group.length,
|
||||
itemBuilder: (context, index) {
|
||||
final item = group[index];
|
||||
return PosterWidget(
|
||||
key: Key(item.id),
|
||||
poster: item,
|
||||
aspectRatio: item.primaryRatio,
|
||||
selected: selected.contains(item),
|
||||
inlineTitle: true,
|
||||
heroTag: true,
|
||||
subTitle: item.subTitle(sortingOptions),
|
||||
excludeActions: excludeActions,
|
||||
otherActions: otherActions(group[index]),
|
||||
onUserDataChanged: (id, newData) => libraryProvider.updateUserData(id, newData),
|
||||
onItemRemoved: (oldItem) => libraryProvider.removeFromPosters([oldItem.id]),
|
||||
onItemUpdated: (newItem) => libraryProvider.updateItem(newItem),
|
||||
onPressed: (action, item) async => onItemPressed(action, key, item, ref, context),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
).toList());
|
||||
} else {
|
||||
return SliverMasonryGrid.count(
|
||||
mainAxisSpacing: (8 * decimal) + 8,
|
||||
|
|
@ -309,6 +271,36 @@ class LibraryViews extends ConsumerWidget {
|
|||
}
|
||||
}
|
||||
|
||||
SliverStickyHeader stickyHeaderBuilder(
|
||||
BuildContext context, {
|
||||
required String header,
|
||||
Widget? sliver,
|
||||
}) {
|
||||
return SliverStickyHeader(
|
||||
header: Container(
|
||||
height: 50,
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Transform.translate(
|
||||
offset: const Offset(-20, 0),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: context.colors.surface.withValues(alpha: 0.9),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: Text(
|
||||
header,
|
||||
style: Theme.of(context).textTheme.titleMedium?.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
sliver: sliver,
|
||||
);
|
||||
}
|
||||
|
||||
Map<String, List<ItemBaseModel>> groupItemsBy(BuildContext context, List<ItemBaseModel> list, GroupBy groupOption) {
|
||||
switch (groupOption) {
|
||||
case GroupBy.dateAdded:
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:iconsax_plus/iconsax_plus.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:flutter_typeahead/flutter_typeahead.dart';
|
||||
import 'package:iconsax_plus/iconsax_plus.dart';
|
||||
import 'package:page_transition/page_transition.dart';
|
||||
|
||||
import 'package:fladder/models/item_base_model.dart';
|
||||
|
|
@ -65,6 +65,9 @@ class _SearchBarState extends ConsumerState<SuggestionSearchBar> {
|
|||
});
|
||||
return Card(
|
||||
elevation: 2,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: FladderTheme.largeShape.borderRadius,
|
||||
),
|
||||
shadowColor: Colors.transparent,
|
||||
child: TypeAheadField<ItemBaseModel>(
|
||||
focusNode: focusNode,
|
||||
|
|
@ -80,7 +83,7 @@ class _SearchBarState extends ConsumerState<SuggestionSearchBar> {
|
|||
decorationBuilder: (context, child) => DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context).colorScheme.secondaryContainer,
|
||||
borderRadius: FladderTheme.defaultShape.borderRadius,
|
||||
borderRadius: FladderTheme.largeShape.borderRadius,
|
||||
),
|
||||
child: child,
|
||||
),
|
||||
|
|
@ -133,39 +136,45 @@ class _SearchBarState extends ConsumerState<SuggestionSearchBar> {
|
|||
}
|
||||
},
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 8),
|
||||
title: SizedBox(
|
||||
height: 50,
|
||||
child: Row(
|
||||
children: [
|
||||
Card(
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
|
||||
child: AspectRatio(
|
||||
aspectRatio: 0.8,
|
||||
child: FladderImage(
|
||||
image: suggestion.images?.primary,
|
||||
fit: BoxFit.cover,
|
||||
title: ConstrainedBox(
|
||||
constraints: const BoxConstraints(
|
||||
minHeight: 50,
|
||||
maxHeight: 65,
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: Row(
|
||||
children: [
|
||||
Card(
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
|
||||
child: AspectRatio(
|
||||
aspectRatio: 0.8,
|
||||
child: FladderImage(
|
||||
image: suggestion.images?.primary,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Flexible(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Flexible(
|
||||
child: Text(
|
||||
suggestion.name,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
)),
|
||||
if (suggestion.overview.yearAired.toString().isNotEmpty)
|
||||
const SizedBox(width: 8),
|
||||
Flexible(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Flexible(
|
||||
child:
|
||||
Opacity(opacity: 0.45, child: Text(suggestion.overview.yearAired?.toString() ?? ""))),
|
||||
],
|
||||
child: Text(
|
||||
suggestion.name,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
)),
|
||||
if (suggestion.overview.yearAired.toString().isNotEmpty)
|
||||
Flexible(
|
||||
child: Opacity(
|
||||
opacity: 0.45, child: Text(suggestion.overview.yearAired?.toString() ?? ""))),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue