feat(web,mobile) Allow videos to be looped in the detail viewer (#8615)

* First version of video looping for the web * Use prop for slideshow state * refactor asset settings and add autoloop video setting * rename variables and adjust description * loop videos based on user settings in gallery viewer * make asset viewer setting a stateless widget * do not update video playback value if looping is enabled * add some translations * adjust description * add missing id * WIP * chore: clean up --------- Co-authored-by: Alex <alex.tran1502@gmail.com> Co-authored-by: Jason Rasmussen <jrasm91@gmail.com>
2024-05-14 21:31:47 +02:00
parent 0f129cae4a
commit d62e90424e
18 changed files with 160 additions and 49 deletions
@@ -0,0 +1,23 @@
+import 'package:flutter/material.dart';
+import 'package:immich_mobile/widgets/settings/asset_viewer_settings/image_viewer_quality_setting.dart';
+import 'package:immich_mobile/widgets/settings/settings_sub_page_scaffold.dart';
+import 'video_viewer_settings.dart';
+
+class AssetViewerSettings extends StatelessWidget {
+  const AssetViewerSettings({
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final assetViewerSetting = [
+      const ImageViewerQualitySetting(),
+      const VideoViewerSettings(),
+    ];
+
+    return SettingsSubPageScaffold(
+      settings: assetViewerSetting,
+      showDivider: true,
+    );
+  }
+}
@@ -0,0 +1,47 @@
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
+import 'package:immich_mobile/providers/app_settings.provider.dart';
+import 'package:immich_mobile/services/app_settings.service.dart';
+import 'package:immich_mobile/widgets/settings/settings_sub_title.dart';
+import 'package:immich_mobile/widgets/settings/settings_switch_list_tile.dart';
+import 'package:immich_mobile/utils/hooks/app_settings_update_hook.dart';
+
+class ImageViewerQualitySetting extends HookConsumerWidget {
+  const ImageViewerQualitySetting({
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final isPreview = useAppSettingsState(AppSettingsEnum.loadPreview);
+    final isOriginal = useAppSettingsState(AppSettingsEnum.loadOriginal);
+
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        SettingsSubTitle(title: "setting_image_viewer_title".tr()),
+        ListTile(
+          contentPadding: const EdgeInsets.symmetric(horizontal: 20),
+          title: Text(
+            'setting_image_viewer_help',
+            style: context.textTheme.bodyMedium,
+          ).tr(),
+        ),
+        SettingsSwitchListTile(
+          valueNotifier: isPreview,
+          title: "setting_image_viewer_preview_title".tr(),
+          subtitle: "setting_image_viewer_preview_subtitle".tr(),
+          onChanged: (_) => ref.invalidate(appSettingsServiceProvider),
+        ),
+        SettingsSwitchListTile(
+          valueNotifier: isOriginal,
+          title: "setting_image_viewer_original_title".tr(),
+          subtitle: "setting_image_viewer_original_subtitle".tr(),
+          onChanged: (_) => ref.invalidate(appSettingsServiceProvider),
+        ),
+      ],
+    );
+  }
+}
@@ -0,0 +1,32 @@
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/providers/app_settings.provider.dart';
+import 'package:immich_mobile/services/app_settings.service.dart';
+import 'package:immich_mobile/widgets/settings/settings_sub_title.dart';
+import 'package:immich_mobile/widgets/settings/settings_switch_list_tile.dart';
+import 'package:immich_mobile/utils/hooks/app_settings_update_hook.dart';
+
+class VideoViewerSettings extends HookConsumerWidget {
+  const VideoViewerSettings({
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final useLoopVideo = useAppSettingsState(AppSettingsEnum.loopVideo);
+
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        SettingsSubTitle(title: "setting_video_viewer_title".tr()),
+        SettingsSwitchListTile(
+          valueNotifier: useLoopVideo,
+          title: "setting_video_viewer_looping_title".tr(),
+          subtitle: "setting_video_viewer_looping_subtitle".tr(),
+          onChanged: (_) => ref.invalidate(appSettingsServiceProvider),
+        ),
+      ],
+    );
+  }
+}