v1.4.5+66

README.md

@@ -1,5 +1,5 @@
 # fApp
-![f0ck.me Logo](https://git.lat/f0ck/fApp/raw/branch/master/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png)
+![f0ck.me Logo](https://git.lat/f0ck/fApp/raw/branch/master/assets/images/menu.webp)
 ## Overview
 
 fApp is the mobile application for the website [f0ck.me](https://f0ck.me). This app provides a user-friendly interface to access the content of the website and utilize its features conveniently from your mobile device.

lib/controller/authcontroller.dart

@@ -4,14 +4,14 @@ import 'package:get/get.dart';
 import 'package:encrypt_shared_preferences/provider.dart';
 import 'package:http/http.dart' as http;
 
+import 'package:f0ckapp/models/user.dart';
+
 class AuthController extends GetxController {
   final EncryptedSharedPreferencesAsync storage =
       EncryptedSharedPreferencesAsync.getInstance();
 
   RxnString token = RxnString();
-  RxnInt userId = RxnInt();
-  RxnString avatarUrl = RxnString();
-  RxnString username = RxnString();
+  Rxn<User> user = Rxn<User>();
   RxBool isLoading = false.obs;
   RxnString error = RxnString();
 
@@ -47,9 +47,7 @@ class AuthController extends GetxController {
       } catch (_) {}
     }
     token.value = null;
-    userId.value = null;
-    avatarUrl.value = null;
-    username.value = null;
+    user.value = null;
     await storage.remove('token');
   }
 
@@ -66,11 +64,7 @@ class AuthController extends GetxController {
         final dynamic data = json.decode(response.body);
         if (data['token'] != null) {
           await saveToken(data['token']);
-          userId.value = data['userid'];
-          avatarUrl.value = data['avatar'] != null
-              ? 'https://f0ck.me/t/${data['avatar']}.webp'
-              : null;
-          this.username.value = data['user'];
+          user.value = User.fromJson(data);
           return true;
         } else {
           error.value = 'Kein Token erhalten';
@@ -95,13 +89,7 @@ class AuthController extends GetxController {
       );
       if (response.statusCode == 200) {
         final dynamic data = json.decode(response.body);
-        userId.value = data['userid'] != null
-            ? int.tryParse(data['userid'].toString())
-            : null;
-        avatarUrl.value = data['avatar'] != null
-            ? 'https://f0ck.me/t/${data['avatar']}.webp'
-            : null;
-        username.value = data['user'];
+        user.value = User.fromJson(data);
       } else {
         await logout();
       }

lib/controller/localizationcontroller.dart

@@ -6,6 +6,13 @@ import 'package:flutter/services.dart';
 import 'package:get/get.dart';
 import 'package:encrypt_shared_preferences/provider.dart';
 
+const Map<String, Locale> supportedLocales = {
+  'en_US': Locale('en', 'US'),
+  'de_DE': Locale('de', 'DE'),
+  'fr_FR': Locale('fr', 'FR'),
+  'nl_NL': Locale('nl', 'NL'),
+};
+
 class MyTranslations extends Translations {
   static final MyTranslations instance = MyTranslations._internal();
   MyTranslations._internal();
@@ -13,15 +20,18 @@ class MyTranslations extends Translations {
   static final Map<String, Map<String, String>> _translations = {};
 
   static Future<void> loadTranslations() async {
-    final locales = ['en_US', 'de_DE', 'fr_FR', 'nl_NL'];
-    for (final locale in locales) {
-      final String jsonString = await rootBundle.loadString(
-        'assets/i18n/$locale.json',
-      );
-      final Map<String, dynamic> jsonMap = json.decode(jsonString);
-      _translations[locale] = jsonMap.map(
-        (key, value) => MapEntry(key, value.toString()),
-      );
+    for (final localeKey in supportedLocales.keys) {
+      try {
+        final String jsonString = await rootBundle.loadString(
+          'assets/i18n/$localeKey.json',
+        );
+        final Map<String, dynamic> jsonMap = json.decode(jsonString);
+        _translations[localeKey] = jsonMap.map(
+          (key, value) => MapEntry(key, value.toString()),
+        );
+      } catch (e) {
+        debugPrint('Konnte Übersetzung für $localeKey nicht laden: $e');
+      }
     }
   }
 
@@ -32,7 +42,7 @@ class MyTranslations extends Translations {
 class LocalizationController extends GetxController {
   final EncryptedSharedPreferencesAsync storage =
       EncryptedSharedPreferencesAsync.getInstance();
-  Rx<Locale> currentLocale = const Locale('en', 'US').obs;
+  Rx<Locale> currentLocale = supportedLocales['en_US']!.obs;
 
   @override
   void onInit() {
@@ -41,25 +51,29 @@ class LocalizationController extends GetxController {
   }
 
   Future<void> loadLocale() async {
-    String? savedLocale = await storage.getString(
+    String? savedLocaleKey = await storage.getString(
       'locale',
       defaultValue: 'en_US',
     );
-    if (savedLocale != null && savedLocale.isNotEmpty) {
-      final List<String> parts = savedLocale.split('_');
-      currentLocale.value = parts.length == 2
-          ? Locale(parts[0], parts[1])
-          : Locale(parts[0]);
-      Get.locale = currentLocale.value;
-    }
+
+    final Locale locale =
+        supportedLocales[savedLocaleKey ?? 'en_US'] ??
+        supportedLocales['en_US']!;
+
+    currentLocale.value = locale;
+    Get.locale = locale;
   }
 
   Future<void> changeLocale(Locale newLocale) async {
+    final String localeKey = supportedLocales.entries
+        .firstWhere(
+          (entry) => entry.value == newLocale,
+          orElse: () => supportedLocales.entries.first,
+        )
+        .key;
+
     currentLocale.value = newLocale;
     Get.updateLocale(newLocale);
-    await storage.setString(
-      'locale',
-      '${newLocale.languageCode}_${newLocale.countryCode}',
-    );
+    await storage.setString('locale', localeKey);
   }
 }

lib/controller/mediacontroller.dart

@@ -1,18 +1,14 @@
 import 'package:get/get.dart';
-import 'package:encrypt_shared_preferences/provider.dart';
 
 import 'package:f0ckapp/models/feed.dart';
 import 'package:f0ckapp/models/item.dart';
 import 'package:f0ckapp/services/api.dart';
-import 'package:f0ckapp/utils/animatedtransition.dart';
 
 const List<String> mediaTypes = ["alles", "image", "video", "audio"];
 const List<String> mediaModes = ["sfw", "nsfw", "untagged", "all"];
 
 class MediaController extends GetxController {
-  final ApiService _api = ApiService();
-  final EncryptedSharedPreferencesAsync storage =
-      EncryptedSharedPreferencesAsync.getInstance();
+  final ApiService _api = Get.find<ApiService>();
 
   RxList<MediaItem> items = <MediaItem>[].obs;
   RxBool loading = false.obs;
@@ -22,11 +18,7 @@ class MediaController extends GetxController {
   RxInt typeIndex = 0.obs;
   RxInt modeIndex = 0.obs;
   RxInt random = 0.obs;
-  Rxn<String> tag = Rxn<String>();
-  RxBool muted = false.obs;
-  Rx<PageTransition> transitionType = PageTransition.opacity.obs;
-  RxBool drawerSwipeEnabled = true.obs;
-  RxInt crossAxisCount = 0.obs;
+  Rxn<String> tag = Rxn<String>(null);
 
   void setTypeIndex(int idx) {
     typeIndex.value = idx;
@@ -45,14 +37,6 @@ class MediaController extends GetxController {
     }
   }
 
-  List<MediaItem> get filteredItems {
-    final String typeStr = mediaTypes[typeIndex.value];
-    return items.where((item) {
-      final bool typeOk = typeStr == "alles" || item.mime.startsWith(typeStr);
-      return typeOk;
-    }).toList();
-  }
-
   Future<List<Favorite>?> toggleFavorite(
     MediaItem item,
     bool isFavorite,
@@ -64,92 +48,83 @@ class MediaController extends GetxController {
     }
   }
 
-  Future<void> fetchInitial({int? id}) async {
+  Future<Feed?> _fetchItems({int? older, int? newer}) async {
+    if (loading.value) return null;
     loading.value = true;
     try {
-      final Feed result = await _api.fetchItems(
+      return await _api.fetchItems(
+        older: older,
+        newer: newer,
         type: typeIndex.value,
         mode: modeIndex.value,
         random: random.value,
         tag: tag.value,
-        older: id,
       );
+    } catch (e) {
+      Get.snackbar(
+        'Fehler beim Laden',
+        'Die Daten konnten nicht abgerufen werden. Wo Internet?',
+        snackPosition: SnackPosition.BOTTOM,
+      );
+      return null;
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  Future<void> fetchInitial({int? id}) async {
+    final result = await _fetchItems(older: id);
+    if (result != null) {
       items.assignAll(result.items);
       atEnd.value = result.atEnd;
       atStart.value = result.atStart;
-    } finally {
-      loading.value = false;
     }
   }
 
   Future<void> fetchMore() async {
     if (items.isEmpty || atEnd.value) return;
-    loading.value = true;
-    try {
-      final Feed result = await _api.fetchItems(
-        older: items.last.id,
-        type: typeIndex.value,
-        mode: modeIndex.value,
-        random: random.value,
-        tag: tag.value,
-      );
+    final result = await _fetchItems(older: items.last.id);
+    if (result != null) {
+      final Set<int> existingIds = items.map((e) => e.id).toSet();
       final List<MediaItem> newItems = result.items
-          .where((item) => !items.any((existing) => existing.id == item.id))
+          .where((item) => !existingIds.contains(item.id))
           .toList();
       items.addAll(newItems);
       items.refresh();
       atEnd.value = result.atEnd;
-    } finally {
-      loading.value = false;
     }
   }
 
   Future<int> fetchNewer() async {
     if (items.isEmpty || atStart.value) return 0;
-    loading.value = true;
-    try {
-      final Feed result = await _api.fetchItems(
-        newer: items.first.id,
-        type: typeIndex.value,
-        mode: modeIndex.value,
-        random: random.value,
-        tag: tag.value,
-      );
-      int oldLength = filteredItems.length;
+    final oldLength = items.length;
+    final result = await _fetchItems(newer: items.first.id);
+    if (result != null) {
+      final Set<int> existingIds = items.map((e) => e.id).toSet();
       final List<MediaItem> newItems = result.items
-          .where((item) => !items.any((existing) => existing.id == item.id))
+          .where((item) => !existingIds.contains(item.id))
           .toList();
       items.insertAll(0, newItems);
       items.refresh();
       atStart.value = result.atStart;
-      int newLength = filteredItems.length;
-      return newLength - oldLength;
-    } finally {
-      loading.value = false;
+      return items.length - oldLength;
+    }
+    return 0;
+  }
+
+  Future<void> handleRefresh() async {
+    if (loading.value) return;
+    if (!atStart.value) {
+      await fetchNewer();
+    } else {
+      await fetchInitial();
     }
   }
 
-  void toggleMuted() {
-    muted.value = !muted.value;
-  }
-
-  void setMuted(bool value) {
-    muted.value = value;
-  }
-
-  Future<void> setTransitionType(PageTransition type) async {
-    transitionType.value = type;
-    await saveSettings();
-  }
-
-  Future<void> setCrossAxisCount(int value) async {
-    crossAxisCount.value = value;
-    await saveSettings();
-  }
-
-  Future<void> setDrawerSwipeEnabled(bool enabled) async {
-    drawerSwipeEnabled.value = enabled;
-    await saveSettings();
+  Future<void> handleLoading() async {
+    if (!loading.value && !atEnd.value) {
+      await fetchMore();
+    }
   }
 
   void toggleRandom() {
@@ -157,25 +132,5 @@ class MediaController extends GetxController {
     fetchInitial();
   }
 
-  @override
-  void onInit() async {
-    super.onInit();
-    await loadSettings();
-  }
-
-  Future<void> loadSettings() async {
-    muted.value = await storage.getBoolean('muted') ?? false;
-    crossAxisCount.value = await storage.getInt('crossAxisCount') ?? 0;
-    drawerSwipeEnabled.value =
-        await storage.getBoolean('drawerSwipeEnabled') ?? true;
-    transitionType.value =
-        PageTransition.values[await storage.getInt('transitionType') ?? 0];
-  }
-
-  Future<void> saveSettings() async {
-    await storage.setBoolean('muted', muted.value);
-    await storage.setInt('crossAxisCount', crossAxisCount.value);
-    await storage.setBoolean('drawerSwipeEnabled', drawerSwipeEnabled.value);
-    await storage.setInt('transitionType', transitionType.value.index);
-  }
+  bool get isRandomEnabled => random.value == 1;
 }

lib/controller/settingscontroller.dart

@@ -0,0 +1,81 @@
+import 'package:encrypt_shared_preferences/provider.dart';
+import 'package:get/get.dart';
+
+import 'package:f0ckapp/utils/animatedtransition.dart';
+
+class _StorageKeys {
+  static const String muted = 'muted';
+  static const String crossAxisCount = 'crossAxisCount';
+  static const String drawerSwipeEnabled = 'drawerSwipeEnabled';
+  static const String transitionType = 'transitionType';
+}
+
+class SettingsController extends GetxController {
+  final EncryptedSharedPreferencesAsync storage =
+      EncryptedSharedPreferencesAsync.getInstance();
+
+  RxBool muted = false.obs;
+  Rx<PageTransition> transitionType = PageTransition.opacity.obs;
+  RxBool drawerSwipeEnabled = true.obs;
+  RxInt crossAxisCount = 0.obs;
+
+  RxInt videoControlsTimerNotifier = 0.obs;
+  RxInt hideControlsNotifier = 0.obs;
+
+  @override
+  void onInit() {
+    super.onInit();
+    loadSettings();
+  }
+
+  void toggleMuted() {
+    muted.value = !muted.value;
+    saveSettings();
+  }
+
+  void setMuted(bool value) {
+    muted.value = value;
+    saveSettings();
+  }
+
+  Future<void> setTransitionType(PageTransition type) async {
+    transitionType.value = type;
+    await saveSettings();
+  }
+
+  Future<void> setCrossAxisCount(int value) async {
+    crossAxisCount.value = value;
+    await saveSettings();
+  }
+
+  Future<void> setDrawerSwipeEnabled(bool enabled) async {
+    drawerSwipeEnabled.value = enabled;
+    await saveSettings();
+  }
+
+  void resetVideoControlsTimer() => videoControlsTimerNotifier.value++;
+  void hideVideoControls() => hideControlsNotifier.value++;
+
+  Future<void> loadSettings() async {
+    muted.value = await storage.getBoolean(_StorageKeys.muted) ?? false;
+    crossAxisCount.value =
+        await storage.getInt(_StorageKeys.crossAxisCount) ?? 0;
+    drawerSwipeEnabled.value =
+        await storage.getBoolean(_StorageKeys.drawerSwipeEnabled) ?? true;
+    transitionType.value = PageTransition
+        .values[await storage.getInt(_StorageKeys.transitionType) ?? 0];
+  }
+
+  Future<void> saveSettings() async {
+    await storage.setBoolean(_StorageKeys.muted, muted.value);
+    await storage.setInt(_StorageKeys.crossAxisCount, crossAxisCount.value);
+    await storage.setBoolean(
+      _StorageKeys.drawerSwipeEnabled,
+      drawerSwipeEnabled.value,
+    );
+    await storage.setInt(
+      _StorageKeys.transitionType,
+      transitionType.value.index,
+    );
+  }
+}

lib/controller/themecontroller.dart

@@ -186,7 +186,6 @@ final ThemeData f0ck95Theme = ThemeData(
     backgroundColor: const Color(0xFFE0E0E0),
     foregroundColor: Colors.black,
     elevation: 4,
-    centerTitle: true,
   ),
   textTheme: const TextTheme(
     bodyLarge: TextStyle(color: Colors.black),

lib/main.dart

@@ -3,6 +3,8 @@ import 'package:flutter/material.dart';
 import 'package:encrypt_shared_preferences/provider.dart';
 import 'package:get/get.dart';
 
+import 'package:f0ckapp/services/api.dart';
+import 'package:f0ckapp/controller/settingscontroller.dart';
 import 'package:f0ckapp/controller/authcontroller.dart';
 import 'package:f0ckapp/controller/localizationcontroller.dart';
 import 'package:f0ckapp/controller/themecontroller.dart';
@@ -14,11 +16,18 @@ import 'package:f0ckapp/screens/login.dart';
 
 void main() async {
   WidgetsFlutterBinding.ensureInitialized();
-  await EncryptedSharedPreferencesAsync.initialize('VokTnbAbemBUa2j9');
-  await MyTranslations.loadTranslations();
-  await AppVersion.init();
+
+  await Future.wait([
+    EncryptedSharedPreferencesAsync.initialize('VokTnbAbemBUa2j9'),
+    MyTranslations.loadTranslations(),
+    AppVersion.init(),
+  ]);
+
   Get.put(AuthController());
-  final MediaController mediaController = Get.put(MediaController());
+  Get.put(ApiService());
+  Get.put(SettingsController());
+  Get.put(MediaController());
+
   final ThemeController themeController = Get.put(ThemeController());
   final LocalizationController localizationController = Get.put(
     LocalizationController(),
@@ -41,7 +50,7 @@ void main() async {
           final Uri uri = Uri.parse(settings.name ?? '/');
 
           if (uri.path == '/' || uri.pathSegments.isEmpty) {
-            return MaterialPageRoute(builder: (_) => MediaGrid());
+            return MaterialPageRoute(builder: (_) => const MediaGrid());
           }
 
           if (uri.path == '/login') {
@@ -49,26 +58,17 @@ void main() async {
           }
 
           if (uri.pathSegments.length == 1) {
-            final int id = int.parse(uri.pathSegments.first);
-
-            return MaterialPageRoute(
-              builder: (_) => FutureBuilder(
-                future: mediaController.items.isEmpty
-                    ? mediaController.fetchInitial(id: id)
-                    : Future.value(),
-                builder: (context, snapshot) {
-                  if (snapshot.connectionState == ConnectionState.done) {
-                    return MediaDetailScreen(initialId: id);
-                  }
-                  return const Scaffold(
-                    body: Center(child: CircularProgressIndicator()),
-                  );
-                },
-              ),
-            );
+            try {
+              final int id = int.parse(uri.pathSegments.first);
+              return MaterialPageRoute(
+                builder: (_) => MediaDetailScreen(initialId: id),
+              );
+            } catch (e) {
+              return MaterialPageRoute(builder: (_) => const MediaGrid());
+            }
           }
 
-          return MaterialPageRoute(builder: (_) => MediaGrid());
+          return MaterialPageRoute(builder: (_) => const MediaGrid());
         },
       ),
     ),

lib/models/user.dart

@@ -0,0 +1,17 @@
+class User {
+  final int id;
+  final String username;
+  final String? avatarUrl;
+
+  User({required this.id, required this.username, this.avatarUrl});
+
+  factory User.fromJson(Map<String, dynamic> json) {
+    return User(
+      id: json['userid'],
+      username: json['user'],
+      avatarUrl: json['avatar'] != null
+          ? 'https://f0ck.me/t/${json['avatar']}.webp'
+          : null,
+    );
+  }
+}

lib/screens/fullscreen.dart

@@ -50,7 +50,7 @@ class _FullScreenMediaViewState extends State<FullScreenMediaView> {
                           const Icon(Icons.error),
                     ),
                   )
-                : SizedBox.expand(
+                : Center(
                     child: VideoWidget(
                       details: widget.item,
                       isActive: true,

lib/screens/mediadetail.dart

@@ -5,18 +5,24 @@ import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter_cache_manager/file.dart';
 import 'package:flutter_cache_manager/flutter_cache_manager.dart';
 import 'package:get/get.dart';
+import 'package:pullex/pullex.dart';
 import 'package:share_plus/share_plus.dart';
 
+import 'package:f0ckapp/services/api.dart';
+import 'package:f0ckapp/widgets/tagfooter.dart';
 import 'package:f0ckapp/utils/animatedtransition.dart';
 import 'package:f0ckapp/controller/authcontroller.dart';
-import 'package:f0ckapp/widgets/actiontag.dart';
-import 'package:f0ckapp/widgets/favorite_avatars.dart';
+import 'package:f0ckapp/widgets/favoritesection.dart';
 import 'package:f0ckapp/screens/fullscreen.dart';
 import 'package:f0ckapp/widgets/end_drawer.dart';
+import 'package:f0ckapp/controller/settingscontroller.dart';
 import 'package:f0ckapp/controller/mediacontroller.dart';
 import 'package:f0ckapp/models/item.dart';
+import 'package:f0ckapp/widgets/tagsection.dart';
 import 'package:f0ckapp/widgets/video_widget.dart';
 
+enum ShareAction { media, directLink, postLink }
+
 class MediaDetailScreen extends StatefulWidget {
   final int initialId;
   const MediaDetailScreen({super.key, required this.initialId});
@@ -26,19 +32,72 @@ class MediaDetailScreen extends StatefulWidget {
 }
 
 class _MediaDetailScreenState extends State<MediaDetailScreen> {
-  late PageController _pageController;
+  PageController? _pageController;
   final MediaController mediaController = Get.find<MediaController>();
+  final SettingsController settingsController = Get.find<SettingsController>();
   final AuthController authController = Get.find<AuthController>();
-  int? _currentIndex;
+  final RxInt _currentIndex = 0.obs;
+  final MethodChannel _mediaSaverChannel = const MethodChannel('MediaShit');
+  final Map<int, PullexRefreshController> _refreshControllers = {};
+
+  bool _isLoading = true;
+  bool _itemNotFound = false;
+  final Set<int> _readyItemIds = {};
+
+  final List<PopupMenuEntry<ShareAction>> _shareMenuItems = const [
+    PopupMenuItem(
+      value: ShareAction.media,
+      child: ListTile(leading: Icon(Icons.image), title: Text('Als Datei')),
+    ),
+    PopupMenuItem(
+      value: ShareAction.directLink,
+      child: ListTile(leading: Icon(Icons.link), title: Text('Link zur Datei')),
+    ),
+    PopupMenuItem(
+      value: ShareAction.postLink,
+      child: ListTile(
+        leading: Icon(Icons.article),
+        title: Text('Link zum f0ck'),
+      ),
+    ),
+  ];
 
   @override
   void initState() {
     super.initState();
-    final int idx = mediaController.items.indexWhere(
+    _loadInitialItem();
+  }
+
+  Future<void> _loadInitialItem() async {
+    int initialIndex = mediaController.items.indexWhere(
       (item) => item.id == widget.initialId,
     );
-    _currentIndex = idx >= 0 ? idx : 0;
-    _pageController = PageController(initialPage: _currentIndex!);
+
+    if (initialIndex < 0) {
+      await mediaController.fetchInitial(id: widget.initialId + 20);
+      initialIndex = mediaController.items.indexWhere(
+        (item) => item.id == widget.initialId,
+      );
+    }
+
+    if (initialIndex < 0) {
+      if (mounted) {
+        setState(() {
+          _itemNotFound = true;
+          _isLoading = false;
+        });
+      }
+      return;
+    }
+
+    if (mounted) {
+      _currentIndex.value = initialIndex;
+      _pageController = PageController(initialPage: initialIndex);
+      if (mediaController.items[initialIndex].mime.startsWith('image/')) {
+        _readyItemIds.add(mediaController.items[initialIndex].id);
+      }
+      setState(() => _isLoading = false);
+    }
   }
 
   void _showMsg(String message) {
@@ -48,16 +107,44 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       ..snackbar('hehe', message, snackPosition: SnackPosition.BOTTOM);
   }
 
+  Future<void> _onRefresh(
+    int itemId,
+    PullexRefreshController controller,
+  ) async {
+    if (mediaController.loading.value) {
+      controller.refreshCompleted();
+      return;
+    }
+
+    try {
+      final MediaItem item = await ApiService().fetchItemById(itemId);
+      final int index = mediaController.items.indexWhere(
+        (item) => item.id == itemId,
+      );
+      if (index != -1) {
+        mediaController.items[index] = item;
+        mediaController.items.refresh();
+      }
+      controller.refreshCompleted();
+    } catch (e) {
+      _showMsg('Fehler beim Aktualisieren: $e');
+      controller.refreshFailed();
+    }
+  }
+
   void _onPageChanged(int idx) {
-    if (idx != _currentIndex) {
-      setState(() => _currentIndex = idx);
+    if (idx != _currentIndex.value) {
+      _currentIndex.value = idx;
+      final MediaItem item = mediaController.items[idx];
+      if (item.mime.startsWith('image/') && !_readyItemIds.contains(item.id)) {
+        setState(() => _readyItemIds.add(item.id));
+      }
     }
     if (idx >= mediaController.items.length - 2 &&
         !mediaController.loading.value &&
         !mediaController.atEnd.value) {
       mediaController.fetchMore();
-    }
-    if (idx <= 1 &&
+    } else if (idx <= 1 &&
         !mediaController.loading.value &&
         !mediaController.atStart.value) {
       mediaController.fetchNewer();
@@ -65,22 +152,61 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
   }
 
   Future<void> _downloadMedia(MediaItem item) async {
-    final File file = await DefaultCacheManager().getSingleFile(item.mediaUrl);
-    final MethodChannel methodChannel = const MethodChannel('MediaShit');
+    try {
+      final File file = await DefaultCacheManager().getSingleFile(
+        item.mediaUrl,
+      );
 
-    bool? success = await methodChannel.invokeMethod<bool>('saveFile', {
-      'filePath': file.path,
-      'fileName': item.dest,
-    });
+      final bool? success = await _mediaSaverChannel.invokeMethod<bool>(
+        'saveFile',
+        {'filePath': file.path, 'fileName': item.dest},
+      );
 
-    success == true
-        ? _showMsg('${item.dest} wurde in Downloads/fApp neigespeichert.')
-        : _showMsg('${item.dest} konnte nicht heruntergeladen werden.');
+      success == true
+          ? _showMsg('${item.dest} wurde in Downloads/fApp neigespeichert.')
+          : _showMsg('${item.dest} konnte nicht heruntergeladen werden.');
+    } catch (e) {
+      _showMsg('Fehler beim Download: $e');
+    }
+  }
+
+  Future<void> _handleShareAction(ShareAction value, MediaItem item) async {
+    try {
+      if (value == ShareAction.media) {
+        final File file = await DefaultCacheManager().getSingleFile(
+          item.mediaUrl,
+        );
+        final Uint8List bytes = await file.readAsBytes();
+        final ShareParams params = ShareParams(
+          files: [XFile.fromData(bytes, mimeType: item.mime)],
+        );
+        await SharePlus.instance.share(params);
+        return;
+      }
+
+      final String textToShare;
+      switch (value) {
+        case ShareAction.directLink:
+          textToShare = item.mediaUrl;
+          break;
+        case ShareAction.postLink:
+          textToShare = item.postUrl;
+          break;
+        case ShareAction.media:
+          return;
+      }
+      await SharePlus.instance.share(ShareParams(text: textToShare));
+    } catch (e) {
+      _showMsg('Fehler beim Teilen: $e');
+    }
   }
 
   @override
   void dispose() {
-    _pageController.dispose();
+    _pageController?.dispose();
+    for (PullexRefreshController controller in _refreshControllers.values) {
+      controller.dispose();
+    }
     super.dispose();
   }
 
@@ -93,7 +219,15 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       );
     } else if (item.mime.startsWith('video/') ||
         item.mime.startsWith('audio/')) {
-      return VideoWidget(details: item, isActive: isActive);
+      return VideoWidget(
+        details: item,
+        isActive: isActive,
+        onInitialized: () {
+          if (mounted && !_readyItemIds.contains(item.id)) {
+            setState(() => _readyItemIds.add(item.id));
+          }
+        },
+      );
     } else {
       return const Icon(Icons.help_outline, size: 100);
     }
@@ -101,212 +235,139 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
 
   @override
   Widget build(BuildContext context) {
-    return Obx(
-      () => PageView.builder(
-        controller: _pageController,
-        itemCount: mediaController.items.length,
-        onPageChanged: _onPageChanged,
-        itemBuilder: (context, index) {
-          final MediaItem item = mediaController.items[index];
-          final bool isActive = index == _currentIndex;
-          final bool isFavorite =
-              item.favorites?.any(
-                (f) => f.userId == authController.userId.value,
-              ) ??
-              false;
+    if (_isLoading) {
+      return Scaffold(
+        appBar: AppBar(title: Text('Lade f0ck #${widget.initialId}...')),
+        body: const Center(child: CircularProgressIndicator()),
+      );
+    }
 
-          return Scaffold(
-            endDrawer: EndDrawer(),
-            endDrawerEnableOpenDragGesture:
-                mediaController.drawerSwipeEnabled.value,
-            body: CustomScrollView(
-              slivers: [
-                SliverAppBar(
-                  floating: false,
-                  pinned: true,
-                  title: Text('f0ck #${item.id}'),
-                  actions: [
-                    IconButton(
-                      icon: const Icon(Icons.fullscreen),
-                      onPressed: () {
-                        Get.to(
-                          FullScreenMediaView(item: item),
-                          fullscreenDialog: true,
+    if (_itemNotFound) {
+      return Scaffold(
+        appBar: AppBar(title: const Text('Fehler')),
+        body: const Center(child: Text('f0ck nicht gefunden.')),
+      );
+    }
+
+    return Obx(() {
+      if (mediaController.items.isEmpty ||
+          _currentIndex.value >= mediaController.items.length) {
+        return Scaffold(
+          appBar: AppBar(title: const Text('Fehler')),
+          body: const Center(child: Text('Keine Items zum Anzeigen.')),
+        );
+      }
+      final MediaItem currentItem = mediaController.items[_currentIndex.value];
+      return Scaffold(
+        endDrawer: const EndDrawer(),
+        endDrawerEnableOpenDragGesture:
+            settingsController.drawerSwipeEnabled.value,
+        appBar: AppBar(
+          title: Text('f0ck #${currentItem.id}'),
+          actions: [
+            IconButton(
+              icon: const Icon(Icons.fullscreen),
+              onPressed: () {
+                Get.to(
+                  FullScreenMediaView(item: currentItem),
+                  fullscreenDialog: true,
+                );
+              },
+            ),
+            IconButton(
+              icon: const Icon(Icons.download),
+              onPressed: () async => await _downloadMedia(currentItem),
+            ),
+            PopupMenuButton<ShareAction>(
+              onSelected: (value) => _handleShareAction(value, currentItem),
+              itemBuilder: (context) => _shareMenuItems,
+              icon: const Icon(Icons.share),
+            ),
+            Builder(
+              builder: (context) => IconButton(
+                icon: const Icon(Icons.menu),
+                onPressed: () => Scaffold.of(context).openEndDrawer(),
+              ),
+            ),
+          ],
+        ),
+        body: PageView.builder(
+          controller: _pageController!,
+          itemCount: mediaController.items.length,
+          onPageChanged: _onPageChanged,
+          itemBuilder: (context, index) {
+            final MediaItem item = mediaController.items[index];
+            final bool isReady = _readyItemIds.contains(item.id);
+            final ScrollController scrollController = ScrollController();
+            final PullexRefreshController refreshController =
+                _refreshControllers.putIfAbsent(
+                  item.id,
+                  () => PullexRefreshController(),
+                );
+
+            return PullexRefresh(
+              onRefresh: () => _onRefresh(item.id, refreshController),
+              header: const WaterDropHeader(),
+              controller: refreshController,
+              child: CustomScrollView(
+                controller: scrollController,
+                slivers: [
+                  SliverToBoxAdapter(
+                    child: AnimatedBuilder(
+                      animation: _pageController!,
+                      builder: (context, child) {
+                        return buildAnimatedTransition(
+                          context: context,
+                          pageController: _pageController!,
+                          index: index,
+                          child: child!,
                         );
                       },
-                    ),
-                    IconButton(
-                      icon: const Icon(Icons.download),
-                      onPressed: () async {
-                        await _downloadMedia(item);
-                      },
-                    ),
-                    PopupMenuButton<String>(
-                      onSelected: (value) async {
-                        switch (value) {
-                          case 'media':
-                            File file = await DefaultCacheManager()
-                                .getSingleFile(item.mediaUrl);
-                            Uint8List bytes = await file.readAsBytes();
-                            final params = ShareParams(
-                              files: [
-                                XFile.fromData(bytes, mimeType: item.mime),
-                              ],
-                            );
-                            await SharePlus.instance.share(params);
-                            break;
-                          case 'direct_link':
-                            await SharePlus.instance.share(
-                              ShareParams(text: item.mediaUrl),
-                            );
-                            break;
-                          case 'post_link':
-                            await SharePlus.instance.share(
-                              ShareParams(text: item.postUrl),
-                            );
-                            break;
-                        }
-                      },
-                      itemBuilder: (context) => [
-                        PopupMenuItem(
-                          value: 'media',
-                          child: ListTile(
-                            leading: const Icon(Icons.image),
-                            title: const Text('Als Datei'),
-                          ),
-                        ),
-                        PopupMenuItem(
-                          value: 'direct_link',
-                          child: ListTile(
-                            leading: const Icon(Icons.link),
-                            title: const Text('Link zur Datei'),
-                          ),
-                        ),
-                        PopupMenuItem(
-                          value: 'post_link',
-                          child: ListTile(
-                            leading: const Icon(Icons.article),
-                            title: const Text('Link zum f0ck'),
-                          ),
-                        ),
-                      ],
-                      icon: const Icon(Icons.share),
-                    ),
-                    Builder(
-                      builder: (context) => IconButton(
-                        icon: const Icon(Icons.menu),
-                        onPressed: () {
-                          Scaffold.of(context).openEndDrawer();
-                        },
+                      child: Obx(
+                        () => _buildMedia(item, index == _currentIndex.value),
                       ),
                     ),
-                  ],
-                ),
-                SliverToBoxAdapter(
-                  child: Column(
-                    crossAxisAlignment: CrossAxisAlignment.stretch,
-                    children: [
-                      AnimatedBuilder(
-                        animation: _pageController,
-                        builder: (context, child) {
-                          return buildAnimatedTransition(
-                            context: context,
-                            pageController: _pageController,
-                            index: index,
-                            controller: mediaController,
-                            child: child!,
-                          );
-                        },
-                        child: _buildMedia(item, isActive),
-                      ),
-                      const SizedBox(height: 16),
-                      Padding(
-                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
-                        child: Column(
-                          crossAxisAlignment: CrossAxisAlignment.center,
-                          children: [
-                            Row(
-                              mainAxisAlignment: MainAxisAlignment.center,
-                              children: [
-                                ...item.tags?.map(
-                                  (tag) => Padding(
-                                    padding: const EdgeInsets.only(right: 6),
-                                    child: ActionTag(tag, (onTagTap) {
-                                      if (tag.tag == 'sfw' || tag.tag == 'nsfw') {
-                                        return;
-                                      }
-                                      mediaController.setTag(onTagTap);
-                                      Get.offAllNamed('/');
-                                    }),
-                                  ),
-                                ) ?? [],
-                              ],
-                            ),
-                            if (authController.isLoggedIn) ...[
-                              const SizedBox(height: 20),
-                              Row(
-                                children: [
-                                  Expanded(
-                                    child: SingleChildScrollView(
-                                      scrollDirection: Axis.horizontal,
-                                      child: FavoriteAvatars(
-                                        favorites: item.favorites ?? [],
-                                        brightness: Theme.of(
-                                          context,
-                                        ).brightness,
-                                      ),
+                  ),
+                  if (isReady)
+                    SliverToBoxAdapter(
+                      child: GestureDetector(
+                        onTap: () => settingsController.hideVideoControls(),
+                        behavior: HitTestBehavior.translucent,
+                        child: Padding(
+                          padding: const EdgeInsets.all(16.0),
+                          child: Column(
+                            crossAxisAlignment: CrossAxisAlignment.center,
+                            children: [
+                              TagSection(tags: item.tags ?? []),
+                              Obx(
+                                () => Visibility(
+                                  visible: authController.isLoggedIn,
+                                  child: Padding(
+                                    padding: const EdgeInsets.only(top: 20.0),
+                                    child: FavoriteSection(
+                                      item: item,
+                                      index: index,
                                     ),
                                   ),
-                                  IconButton(
-                                    icon: isFavorite
-                                        ? const Icon(Icons.favorite)
-                                        : const Icon(Icons.favorite_outline),
-                                    color: Colors.red,
-                                    onPressed: () async {
-                                      final List<Favorite>? newFavorites =
-                                          await mediaController.toggleFavorite(
-                                            item,
-                                            isFavorite,
-                                          );
-                                      if (newFavorites != null) {
-                                        mediaController.items[index] = item
-                                            .copyWith(favorites: newFavorites);
-                                        mediaController.items.refresh();
-                                      }
-                                      setState(() {});
-                                    },
-                                  ),
-                                ],
+                                ),
                               ),
                             ],
-                          ],
+                          ),
                         ),
                       ),
-                    ],
-                  ),
-                ),
-              ],
-            ),
-            persistentFooterButtons: [
-              Obx(() {
-                if (mediaController.tag.value != null) {
-                  return Center(
-                    child: InputChip(
-                      label: Text(mediaController.tag.value!),
-                      onDeleted: () {
-                        mediaController.setTag(null);
-                        Get.offAllNamed('/');
-                      },
                     ),
-                  );
-                } else {
-                  return SizedBox.shrink();
-                }
-              }),
-            ],
-          );
-        },
-      ),
-    );
+                  const SliverToBoxAdapter(
+                    child: SafeArea(child: SizedBox.shrink()),
+                  ),
+                ],
+              ),
+            );
+          },
+        ),
+        persistentFooterButtons: mediaController.tag.value != null
+            ? [TagFooter()]
+            : null,
+      );
+    });
   }
 }

lib/screens/mediagrid.dart

@@ -3,11 +3,12 @@ import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:pullex/pullex.dart';
 
+import 'package:f0ckapp/widgets/tagfooter.dart';
 import 'package:f0ckapp/utils/customsearchdelegate.dart';
 import 'package:f0ckapp/widgets/end_drawer.dart';
 import 'package:f0ckapp/widgets/filter_bar.dart';
-import 'package:f0ckapp/screens/mediadetail.dart';
 import 'package:f0ckapp/widgets/media_tile.dart';
+import 'package:f0ckapp/controller/settingscontroller.dart';
 import 'package:f0ckapp/controller/mediacontroller.dart';
 
 class MediaGrid extends StatefulWidget {
@@ -20,155 +21,170 @@ class MediaGrid extends StatefulWidget {
 class _MediaGrid extends State<MediaGrid> {
   final ScrollController _scrollController = ScrollController();
   final MediaController _mediaController = Get.put(MediaController());
+  final SettingsController _settingsController = Get.put(SettingsController());
   final PullexRefreshController _refreshController = PullexRefreshController(
     initialRefresh: false,
   );
 
+  late final _MediaGridAppBar _appBar;
+  late final _MediaGridBody _body;
+
   @override
   void initState() {
     super.initState();
     _mediaController.fetchInitial();
+    _appBar = _MediaGridAppBar(mediaController: _mediaController);
+    _body = _MediaGridBody(
+      refreshController: _refreshController,
+      mediaController: _mediaController,
+      settingsController: _settingsController,
+      scrollController: _scrollController,
+    );
+  }
+
+  @override
+  void dispose() {
+    _scrollController.dispose();
+    _refreshController.dispose();
+    super.dispose();
   }
 
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      endDrawer: EndDrawer(),
-      endDrawerEnableOpenDragGesture: _mediaController.drawerSwipeEnabled.value,
-      bottomNavigationBar: FilterBar(scrollController: _scrollController),
-      body: PullexRefresh(
-        controller: _refreshController,
-        enablePullDown: true,
-        enablePullUp: true,
-        header: MaterialHeader(offset: 140),
-        onRefresh: () async {
-          try {
-            if (_mediaController.loading.value) return;
-            if (!_mediaController.atStart.value) {
-              await _mediaController.fetchNewer();
-            } else {
-              await _mediaController.fetchInitial();
-            }
-          } finally {
-            _refreshController.refreshCompleted();
-          }
-        },
-        onLoading: () async {
-          try {
-            if (!_mediaController.loading.value &&
-                !_mediaController.atEnd.value) {
-              await _mediaController.fetchMore();
-            }
-          } finally {
-            _refreshController.loadComplete();
-          }
-        },
-        child: CustomScrollView(
-          controller: _scrollController,
-          slivers: [
-            SliverAppBar(
-              pinned: false,
-              snap: true,
-              floating: true,
-              title: GestureDetector(
-                child: Row(
-                  children: [
-                    Image.asset(
-                      'assets/images/f0ck_small.webp',
-                      fit: BoxFit.fitHeight,
-                    ),
-                    const SizedBox(width: 10),
-                    const Text('fApp', style: TextStyle(fontSize: 24)),
-                  ],
-                ),
-                onTap: () {
-                  _mediaController.setTag(null);
-                },
-              ),
-              actions: [
-                IconButton(
-                  icon: const Icon(Icons.search),
-                  onPressed: () async {
-                    await showSearch(
-                      context: context,
-                      delegate: CustomSearchDelegate(),
-                    );
-                  },
-                ),
-                Obx(
-                  () => IconButton(
-                    icon: Icon(
-                      _mediaController.random.value == 1
-                          ? Icons.shuffle_on_outlined
-                          : Icons.shuffle,
-                    ),
-                    onPressed: () {
-                      _mediaController.toggleRandom();
-                    },
-                  ),
-                ),
-                Builder(
-                  builder: (context) {
-                    return IconButton(
-                      icon: const Icon(Icons.menu),
-                      onPressed: () {
-                        Scaffold.of(context).openEndDrawer();
-                      },
-                    );
-                  },
-                ),
-              ],
-            ),
-            Obx(
-              () => SliverPadding(
-                padding: const EdgeInsets.all(4),
-                sliver: SliverGrid(
-                  delegate: SliverChildBuilderDelegate((context, index) {
-                    final item = _mediaController.filteredItems[index];
-                    return GestureDetector(
-                      onTap: () {
-                        final item = _mediaController.filteredItems[index];
-                        Get.to(() => MediaDetailScreen(initialId: item.id));
-                      },
-                      child: MediaTile(item: item),
-                    );
-                  }, childCount: _mediaController.filteredItems.length),
-                  gridDelegate: _mediaController.crossAxisCount.value == 0
-                      ? const SliverGridDelegateWithMaxCrossAxisExtent(
-                          maxCrossAxisExtent: 150,
-                          crossAxisSpacing: 5,
-                          mainAxisSpacing: 5,
-                          childAspectRatio: 1,
-                        )
-                      : SliverGridDelegateWithFixedCrossAxisCount(
-                          crossAxisCount: _mediaController.crossAxisCount.value,
-                          crossAxisSpacing: 5,
-                          mainAxisSpacing: 5,
-                          childAspectRatio: 1,
-                        ),
-                ),
-              ),
-            ),
-          ],
-        ),
+    return Obx(
+      () => Scaffold(
+        endDrawer: const EndDrawer(),
+        endDrawerEnableOpenDragGesture:
+            _settingsController.drawerSwipeEnabled.value,
+        bottomNavigationBar: FilterBar(scrollController: _scrollController),
+        appBar: _appBar,
+        body: _body,
+        persistentFooterButtons: _mediaController.tag.value != null
+            ? [TagFooter()]
+            : null,
+      ),
+    );
+  }
+}
+
+class _MediaGridAppBar extends StatelessWidget implements PreferredSizeWidget {
+  const _MediaGridAppBar({required this.mediaController});
+
+  final MediaController mediaController;
+
+  @override
+  Widget build(BuildContext context) {
+    return AppBar(
+      title: InkWell(
+        onTap: () {
+          mediaController.setTag(null);
+        },
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Image.asset('assets/images/f0ck_small.webp', fit: BoxFit.fitHeight),
+            const SizedBox(width: 10),
+            const Text('fApp', style: TextStyle(fontSize: 24)),
+          ],
+        ),
+      ),
+      actions: [
+        IconButton(
+          icon: const Icon(Icons.search),
+          onPressed: () async {
+            await showSearch(
+              context: context,
+              delegate: CustomSearchDelegate(),
+            );
+          },
+        ),
+        Obx(
+          () => IconButton(
+            icon: Icon(
+              mediaController.isRandomEnabled
+                  ? Icons.shuffle_on_outlined
+                  : Icons.shuffle,
+            ),
+            onPressed: mediaController.toggleRandom,
+          ),
+        ),
+        IconButton(
+          icon: const Icon(Icons.menu),
+          onPressed: () => Scaffold.of(context).openEndDrawer(),
+        ),
+      ],
+    );
+  }
+
+  @override
+  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
+}
+
+class _MediaGridBody extends StatelessWidget {
+  const _MediaGridBody({
+    required this.refreshController,
+    required this.mediaController,
+    required this.settingsController,
+    required this.scrollController,
+  });
+
+  final PullexRefreshController refreshController;
+  final MediaController mediaController;
+  final SettingsController settingsController;
+  final ScrollController scrollController;
+
+  @override
+  Widget build(BuildContext context) {
+    return PullexRefresh(
+      controller: refreshController,
+      enablePullDown: true,
+      enablePullUp: true,
+      header: const WaterDropHeader(),
+      onRefresh: () async {
+        try {
+          await mediaController.handleRefresh();
+        } finally {
+          refreshController.refreshCompleted();
+        }
+      },
+      onLoading: () async {
+        try {
+          await mediaController.handleLoading();
+        } finally {
+          refreshController.loadComplete();
+        }
+      },
+      child: Obx(
+        () => GridView.builder(
+          addAutomaticKeepAlives: false,
+          controller: scrollController,
+          physics: const NeverScrollableScrollPhysics(),
+          shrinkWrap: true,
+          padding: const EdgeInsets.all(4),
+          itemCount: mediaController.items.length,
+          gridDelegate: settingsController.crossAxisCount.value == 0
+              ? const SliverGridDelegateWithMaxCrossAxisExtent(
+                  maxCrossAxisExtent: 150,
+                  crossAxisSpacing: 5,
+                  mainAxisSpacing: 5,
+                  childAspectRatio: 1,
+                )
+              : SliverGridDelegateWithFixedCrossAxisCount(
+                  crossAxisCount: settingsController.crossAxisCount.value,
+                  crossAxisSpacing: 5,
+                  mainAxisSpacing: 5,
+                  childAspectRatio: 1,
+                ),
+          itemBuilder: (context, index) {
+            final item = mediaController.items[index];
+            return GestureDetector(
+              key: ValueKey(item.id),
+              onTap: () => Get.toNamed('/${item.id}'),
+              child: MediaTile(item: item),
+            );
+          },
+        ),
       ),
-      persistentFooterButtons: [
-        Obx(() {
-          if (_mediaController.tag.value != null) {
-            return Center(
-              child: InputChip(
-                label: Text(_mediaController.tag.value!),
-                onDeleted: () {
-                  _mediaController.setTag(null);
-                  Get.offAllNamed('/');
-                },
-              ),
-            );
-          } else {
-            return SizedBox.shrink();
-          }
-        }),
-      ],
     );
   }
 }

lib/screens/settings.dart

@@ -4,7 +4,7 @@ import 'package:flutter_cache_manager/flutter_cache_manager.dart';
 import 'package:get/get.dart';
 
 import 'package:f0ckapp/controller/localizationcontroller.dart';
-import 'package:f0ckapp/controller/mediacontroller.dart';
+import 'package:f0ckapp/controller/settingscontroller.dart';
 import 'package:f0ckapp/utils/animatedtransition.dart';
 
 class SettingsPage extends StatefulWidget {
@@ -15,8 +15,8 @@ class SettingsPage extends StatefulWidget {
 }
 
 class _SettingsPageState extends State<SettingsPage> {
-  final MediaController controller = Get.find();
-  final LocalizationController localizationController = Get.find();
+  final SettingsController settingsController = Get.find<SettingsController>();
+  final LocalizationController localizationController = Get.find<LocalizationController>();
 
   @override
   Widget build(BuildContext context) {
@@ -34,7 +34,7 @@ class _SettingsPageState extends State<SettingsPage> {
                 title: Text('settings_numberofcolumns_title'.tr),
                 trailing: Obx(
                   () => DropdownButton<int>(
-                    value: controller.crossAxisCount.value,
+                    value: settingsController.crossAxisCount.value,
                     dropdownColor: const Color.fromARGB(255, 43, 43, 43),
                     iconEnabledColor: Colors.white,
                     items: [0, 3, 4, 5].map((int value) {
@@ -51,8 +51,7 @@ class _SettingsPageState extends State<SettingsPage> {
                     }).toList(),
                     onChanged: (int? newValue) async {
                       if (newValue != null) {
-                        await controller.setCrossAxisCount(newValue);
-                        setState(() {});
+                        await settingsController.setCrossAxisCount(newValue);
                       }
                     },
                   ),
@@ -63,7 +62,7 @@ class _SettingsPageState extends State<SettingsPage> {
                 title: Text('settings_pageanimation_title'.tr),
                 trailing: Obx(
                   () => DropdownButton<PageTransition>(
-                    value: controller.transitionType.value,
+                    value: settingsController.transitionType.value,
                     dropdownColor: const Color.fromARGB(255, 43, 43, 43),
                     iconEnabledColor: Colors.white,
                     items: PageTransition.values.map((PageTransition type) {
@@ -92,8 +91,7 @@ class _SettingsPageState extends State<SettingsPage> {
                     }).toList(),
                     onChanged: (PageTransition? newValue) async {
                       if (newValue != null) {
-                        await controller.setTransitionType(newValue);
-                        setState(() {});
+                        await settingsController.setTransitionType(newValue);
                       }
                     },
                   ),
@@ -104,9 +102,9 @@ class _SettingsPageState extends State<SettingsPage> {
               SwitchListTile(
                 title: Text('settings_drawer_title'.tr),
                 subtitle: Text('settings_drawer_subtitle'.tr),
-                value: controller.drawerSwipeEnabled.value,
+                value: settingsController.drawerSwipeEnabled.value,
                 onChanged: (bool value) async {
-                  await controller.setDrawerSwipeEnabled(value);
+                  await settingsController.setDrawerSwipeEnabled(value);
                   setState(() {});
                 },
               ),

lib/services/api.dart

@@ -1,12 +1,11 @@
-import 'package:encrypt_shared_preferences/provider.dart';
 import 'package:get/get.dart';
 
+import 'package:f0ckapp/controller/authcontroller.dart';
 import 'package:f0ckapp/models/item.dart';
 import 'package:f0ckapp/models/feed.dart';
 
 class ApiService extends GetConnect {
-  final EncryptedSharedPreferencesAsync storage =
-      EncryptedSharedPreferencesAsync.getInstance();
+  final AuthController _authController = Get.find<AuthController>();
 
   Future<Feed> fetchItems({
     int? older,
@@ -16,7 +15,7 @@ class ApiService extends GetConnect {
     int random = 0,
     String? tag,
   }) async {
-    String? token = await storage.getString('token');
+    String? token = _authController.token.value;
     final params = <String, String>{
       'type': type.toString(),
       'mode': mode.toString(),
@@ -42,15 +41,40 @@ class ApiService extends GetConnect {
       feed.items.sort((a, b) => b.id.compareTo(a.id));
       return feed;
     } else {
+      if (!Get.isSnackbarOpen) {
+        Get.snackbar('Fehler', 'Fehler beim Laden der Items');
+      }
       throw Exception('Fehler beim Laden der Items');
     }
   }
 
+  Future<MediaItem> fetchItemById(int itemId) async {
+    String? token = _authController.token.value;
+    final Map<String, String> headers = <String, String>{};
+    if (token != null && token.isNotEmpty) {
+      headers['Authorization'] = 'Bearer $token';
+    }
+
+    final Response<dynamic> response = await get(
+      'https://api.f0ck.me/item/$itemId',
+      headers: headers,
+    );
+
+    if (response.status.code == 200 && response.body is Map<String, dynamic>) {
+      return MediaItem.fromJson(response.body as Map<String, dynamic>);
+    } else {
+      if (!Get.isSnackbarOpen) {
+        Get.snackbar('Fehler', 'Fehler beim Laden des Items');
+      }
+      throw Exception('Fehler beim Laden des Items');
+    }
+  }
+
   Future<List<Favorite>?> toggleFavorite(
     MediaItem item,
     bool isFavorite,
   ) async {
-    String? token = await storage.getString('token');
+    String? token = _authController.token.value;
     if (token == null || token.isEmpty) return null;
 
     final Map<String, String> headers = {

lib/utils/animatedtransition.dart

@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 
-import 'package:f0ckapp/controller/mediacontroller.dart';
+import 'package:get/get.dart';
+
+import 'package:f0ckapp/controller/settingscontroller.dart';
 
 enum PageTransition { opacity, scale, slide, rotate, flip }
 
@@ -9,17 +11,17 @@ Widget buildAnimatedTransition({
   required Widget child,
   required PageController pageController,
   required int index,
-  required MediaController controller,
 }) {
+  final SettingsController settingsController = Get.find<SettingsController>();
   final double value = pageController.position.haveDimensions
       ? pageController.page! - index
       : 0;
 
-  switch (controller.transitionType.value) {
+  switch (settingsController.transitionType.value) {
     case PageTransition.opacity:
       return Opacity(
         opacity: Curves.easeOut.transform(1 - value.abs().clamp(0.0, 1.0)),
-        child: Transform(transform: Matrix4.identity(), child: child),
+        child: child,
       );
     case PageTransition.scale:
       return Transform.scale(
@@ -29,10 +31,7 @@ Widget buildAnimatedTransition({
         child: child,
       );
     case PageTransition.slide:
-      return Transform.translate(
-        offset: Offset(300 * value.abs(), 0),
-        child: child,
-      );
+      return child;
     case PageTransition.rotate:
       return Opacity(
         opacity: (1 - value.abs()).clamp(0.0, 1.0),

lib/utils/smartrefreshindicator.dart

@@ -1,28 +0,0 @@
-import 'package:flutter/material.dart';
-
-class SmartRefreshIndicator extends StatelessWidget {
-  final Future<void> Function() onRefresh;
-  final Widget child;
-
-  const SmartRefreshIndicator({
-    super.key,
-    required this.onRefresh,
-    required this.child,
-  });
-
-  @override
-  Widget build(context) {
-    return LayoutBuilder(
-      builder: (context, constraints) => RefreshIndicator(
-        onRefresh: onRefresh,
-        child: SingleChildScrollView(
-          physics: const AlwaysScrollableScrollPhysics(),
-          child: ConstrainedBox(
-            constraints: BoxConstraints(minHeight: constraints.maxHeight),
-            child: child,
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/widgets/end_drawer.dart

@@ -28,11 +28,11 @@ class EndDrawer extends StatelessWidget {
         children: [
           Obx(() {
             if (authController.token.value != null &&
-                authController.avatarUrl.value != null) {
+                authController.user.value?.avatarUrl != null) {
               return DrawerHeader(
                 decoration: BoxDecoration(
                   image: DecorationImage(
-                    image: NetworkImage(authController.avatarUrl.value!),
+                    image: NetworkImage(authController.user.value!.avatarUrl!),
                     fit: BoxFit.cover,
                     alignment: Alignment.topCenter,
                   ),
@@ -58,11 +58,11 @@ class EndDrawer extends StatelessWidget {
                 padding: const EdgeInsets.all(16.0),
                 child: Column(
                   children: [
-                    if (authController.username.value != null)
+                    if (authController.user.value?.username != null)
                       Padding(
                         padding: const EdgeInsets.symmetric(vertical: 8.0),
                         child: Text(
-                          'Hamlo ${authController.username.value!}',
+                          'Hamlo ${authController.user.value?.username}',
                           style: const TextStyle(fontWeight: FontWeight.bold),
                         ),
                       ),

lib/widgets/favorite_avatars.dart

@@ -1,42 +0,0 @@
-import 'package:flutter/material.dart';
-
-import 'package:cached_network_image/cached_network_image.dart';
-
-class FavoriteAvatars extends StatelessWidget {
-  final List favorites;
-  final Brightness brightness;
-
-  const FavoriteAvatars({
-    super.key,
-    required this.favorites,
-    required this.brightness,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    return Row(
-      crossAxisAlignment: CrossAxisAlignment.center,
-      children: [
-        ...favorites.map((favorite) {
-          return Container(
-            height: 32,
-            width: 32,
-            margin: const EdgeInsets.only(right: 5.0),
-            decoration: BoxDecoration(
-              border: Border.all(
-                color: brightness == Brightness.dark
-                    ? Colors.white
-                    : Colors.black,
-                width: 1.0,
-              ),
-            ),
-            child: CachedNetworkImage(
-              imageUrl: favorite.avatarUrl,
-              fit: BoxFit.cover,
-            ),
-          );
-        }),
-      ],
-    );
-  }
-}

lib/widgets/favoritesection.dart

@@ -0,0 +1,74 @@
+import 'package:flutter/material.dart';
+
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:get/get.dart';
+
+import 'package:f0ckapp/controller/authcontroller.dart';
+import 'package:f0ckapp/controller/mediacontroller.dart';
+import 'package:f0ckapp/models/item.dart';
+
+class FavoriteSection extends StatelessWidget {
+  final MediaItem item;
+  final int index;
+  final MediaController mediaController = Get.find<MediaController>();
+  final AuthController authController = Get.find<AuthController>();
+
+  FavoriteSection({super.key, required this.item, required this.index});
+
+  @override
+  Widget build(BuildContext context) {
+    final bool isFavorite =
+        item.favorites?.any((f) => f.userId == authController.user.value?.id) ??
+        false;
+
+    return Row(
+      children: [
+        Expanded(
+          child: SingleChildScrollView(
+            scrollDirection: Axis.horizontal,
+            child: Row(
+              crossAxisAlignment: CrossAxisAlignment.center,
+              children: [
+                ...(item.favorites ?? []).map((favorite) {
+                  return Container(
+                    height: 32,
+                    width: 32,
+                    margin: const EdgeInsets.only(right: 5.0),
+                    decoration: BoxDecoration(
+                      border: Border.all(
+                        color: Theme.of(context).brightness == Brightness.dark
+                            ? Colors.white
+                            : Colors.black,
+                        width: 1.0,
+                      ),
+                    ),
+                    child: CachedNetworkImage(
+                      imageUrl: favorite.avatarUrl,
+                      fit: BoxFit.cover,
+                    ),
+                  );
+                }),
+              ],
+            ),
+          ),
+        ),
+        IconButton(
+          icon: isFavorite
+              ? const Icon(Icons.favorite)
+              : const Icon(Icons.favorite_outline),
+          color: Colors.red,
+          onPressed: () async {
+            final List<Favorite>? newFavorites = await mediaController
+                .toggleFavorite(item, isFavorite);
+            if (newFavorites != null) {
+              mediaController.items[index] = item.copyWith(
+                favorites: newFavorites,
+              );
+              mediaController.items.refresh();
+            }
+          },
+        ),
+      ],
+    );
+  }
+}

lib/widgets/media_tile.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 
 import 'package:cached_network_image/cached_network_image.dart';
-import 'package:get/get.dart';
 
 import 'package:f0ckapp/models/item.dart';
 
@@ -13,14 +12,11 @@ class MediaTile extends StatelessWidget {
   Widget build(BuildContext context) {
     return RepaintBoundary(
       child: InkWell(
-        onTap: () {
-          Get.toNamed('/${item.id}');
-        },
         child: Stack(
           fit: StackFit.expand,
           children: [
             CachedNetworkImage(
-              imageUrl: 'https://f0ck.me/t/${item.id}.webp',
+              imageUrl: item.thumbnailUrl,
               fit: BoxFit.cover,
               placeholder: (context, url) => Container(color: Colors.grey[900]),
               errorWidget: (context, url, error) =>

lib/widgets/tagfooter.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/material.dart';
+
+import 'package:get/get.dart';
+
+import 'package:f0ckapp/controller/mediacontroller.dart';
+
+class TagFooter extends StatelessWidget {
+  final MediaController mediaController = Get.find<MediaController>();
+
+  TagFooter({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Obx(() {
+      if (mediaController.tag.value != null) {
+        return Center(
+          child: InputChip(
+            label: Text(mediaController.tag.value!),
+            onDeleted: () {
+              mediaController.setTag(null);
+              Get.offAllNamed('/');
+            },
+          ),
+        );
+      } else {
+        return const SizedBox.shrink();
+      }
+    });
+  }
+}

lib/widgets/tagsection.dart

@@ -0,0 +1,62 @@
+import 'package:flutter/material.dart';
+
+import 'package:get/get.dart';
+
+import 'package:f0ckapp/models/item.dart';
+import 'package:f0ckapp/widgets/actiontag.dart';
+import 'package:f0ckapp/controller/mediacontroller.dart';
+
+class TagSection extends StatefulWidget {
+  final List<Tag> tags;
+  const TagSection({super.key, required this.tags});
+
+  @override
+  State<TagSection> createState() => _TagSectionState();
+}
+
+class _TagSectionState extends State<TagSection> {
+  bool _areTagsExpanded = false;
+
+  @override
+  Widget build(BuildContext context) {
+    final MediaController mediaController = Get.find<MediaController>();
+    final bool hasMoreTags = widget.tags.length > 5;
+    final List<Tag> tagsToShow = _areTagsExpanded
+        ? widget.tags
+        : widget.tags.take(5).toList();
+
+    return Column(
+      children: [
+        Wrap(
+          spacing: 6.0,
+          runSpacing: 4.0,
+          alignment: WrapAlignment.center,
+          children: [
+            ...tagsToShow.map(
+              (tag) => ActionTag(
+                tag,
+                (tag.tag == 'sfw' || tag.tag == 'nsfw')
+                    ? (onTagTap) => {}
+                    : (onTagTap) {
+                        mediaController.setTag(onTagTap);
+                        Get.offAllNamed('/');
+                      },
+              ),
+            ),
+          ],
+        ),
+        if (hasMoreTags)
+          TextButton(
+            onPressed: () {
+              setState(() => _areTagsExpanded = !_areTagsExpanded);
+            },
+            child: Text(
+              _areTagsExpanded
+                  ? 'Weniger anzeigen'
+                  : 'Alle ${widget.tags.length} Tags anzeigen',
+            ),
+          ),
+      ],
+    );
+  }
+}

lib/widgets/video_controls_overlay.dart

@@ -1,8 +1,10 @@
+import 'dart:async';
+
 import 'package:flutter/material.dart';
 
 import 'package:cached_video_player_plus/cached_video_player_plus.dart';
 
-class VideoControlsOverlay extends StatelessWidget {
+class VideoControlsOverlay extends StatefulWidget {
   final CachedVideoPlayerPlusController controller;
   final VoidCallback onOverlayTap;
   final bool muted;
@@ -16,101 +18,175 @@ class VideoControlsOverlay extends StatelessWidget {
     required this.onMuteToggle,
   });
 
+  @override
+  State<VideoControlsOverlay> createState() => _VideoControlsOverlayState();
+}
+
+class _VideoControlsOverlayState extends State<VideoControlsOverlay> {
+  bool _showSeekIndicator = false;
+  bool _isRewinding = false;
+  Timer? _hideTimer;
+
+  @override
+  void dispose() {
+    _hideTimer?.cancel();
+    super.dispose();
+  }
+
+  void _handleDoubleTap(TapDownDetails details) {
+    final double screenWidth = MediaQuery.of(context).size.width;
+    final bool isRewind = details.globalPosition.dx < screenWidth / 2;
+    widget.onOverlayTap();
+
+    Future(() {
+      if (isRewind) {
+        final Duration newPosition =
+            widget.controller.value.position - const Duration(seconds: 10);
+        widget.controller.seekTo(
+          newPosition < Duration.zero ? Duration.zero : newPosition,
+        );
+      } else {
+        final Duration newPosition =
+            widget.controller.value.position + const Duration(seconds: 10);
+        final Duration duration = widget.controller.value.duration;
+        widget.controller.seekTo(
+          newPosition > duration ? duration : newPosition,
+        );
+      }
+    });
+
+    _hideTimer?.cancel();
+    setState(() {
+      _showSeekIndicator = true;
+      _isRewinding = isRewind;
+    });
+    _hideTimer = Timer(const Duration(milliseconds: 500), () {
+      setState(() => _showSeekIndicator = false);
+    });
+  }
+
   @override
   Widget build(BuildContext context) {
     return Stack(
       alignment: Alignment.center,
       children: [
-        Row(
-          mainAxisAlignment: MainAxisAlignment.center,
-          children: [
-            _ControlButton(Icons.replay_10, () {
-              onOverlayTap();
-              Duration newPosition =
-                  controller.value.position - const Duration(seconds: 10);
-              if (newPosition < Duration.zero) newPosition = Duration.zero;
-              controller.seekTo(newPosition);
-            }),
-            const SizedBox(width: 40),
-            _ControlButton(
-              controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
-              () {
-                onOverlayTap();
-                controller.value.isPlaying
-                    ? controller.pause()
-                    : controller.play();
-              },
-              size: 64,
+        GestureDetector(
+          onTap: widget.onOverlayTap,
+          onDoubleTapDown: _handleDoubleTap,
+          child: Container(color: Colors.transparent),
+        ),
+        AnimatedOpacity(
+          opacity: _showSeekIndicator ? 1.0 : 0.0,
+          duration: const Duration(milliseconds: 200),
+          child: Align(
+            alignment: _isRewinding
+                ? Alignment.centerLeft
+                : Alignment.centerRight,
+            child: Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 40.0),
+              child: Icon(
+                _isRewinding
+                    ? Icons.fast_rewind_rounded
+                    : Icons.fast_forward_rounded,
+                color: Colors.white70,
+                size: 60,
+              ),
             ),
-            const SizedBox(width: 40),
-            _ControlButton(Icons.forward_10, () {
-              onOverlayTap();
-              Duration newPosition =
-                  controller.value.position + const Duration(seconds: 10);
-              if (newPosition > controller.value.duration) {
-                newPosition = controller.value.duration;
-              }
-              controller.seekTo(newPosition);
-            }),
-          ],
+          ),
+        ),
+        IconButton(
+          icon: Icon(
+            widget.controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
+            size: 64,
+          ),
+          onPressed: () {
+            widget.onOverlayTap();
+            widget.controller.value.isPlaying
+                ? widget.controller.pause()
+                : widget.controller.play();
+          },
         ),
         Positioned(
           right: 12,
           bottom: 12,
-          child: _ControlButton(muted ? Icons.volume_off : Icons.volume_up, () {
-            onOverlayTap();
-            onMuteToggle();
-          }, size: 16),
+          child: IconButton(
+            icon: Icon(
+              widget.muted ? Icons.volume_off : Icons.volume_up,
+              size: 16,
+            ),
+            onPressed: () {
+              widget.onOverlayTap();
+              widget.onMuteToggle();
+            },
+          ),
         ),
         Align(
           alignment: Alignment.bottomCenter,
           child: Padding(
             padding: const EdgeInsets.only(bottom: 0),
-            child: Stack(
-              clipBehavior: Clip.none,
-              children: [
-                Positioned(
-                  left: 10,
-                  bottom: 12,
-                  child: Text(
-                    '${_formatDuration(controller.value.position)} / ${_formatDuration(controller.value.duration)}',
-                    style: const TextStyle(color: Colors.white, fontSize: 12),
-                  ),
-                ),
-                Listener(
-                  onPointerDown: (_) {
-                    onOverlayTap();
-                  },
-                  child: VideoProgressIndicator(
-                    controller,
-                    allowScrubbing: true,
-                    padding: const EdgeInsets.only(top: 25.0),
-                    colors: const VideoProgressColors(
-                      playedColor: Colors.red,
-                      backgroundColor: Colors.grey,
-                      bufferedColor: Colors.white54,
-                    ),
-                  ),
-                ),
-                if (controller.value.duration.inMilliseconds > 0)
-                  Positioned(
-                    left:
-                        (controller.value.position.inMilliseconds /
-                                controller.value.duration.inMilliseconds) *
-                            MediaQuery.of(context).size.width -
-                        6,
-                    bottom: -4,
-                    child: Container(
-                      width: 12,
-                      height: 12,
-                      decoration: BoxDecoration(
-                        shape: BoxShape.circle,
-                        color: Colors.red,
-                        border: Border.all(color: Colors.red, width: 2),
+            child: LayoutBuilder(
+              builder: (context, constraints) {
+                return Stack(
+                  clipBehavior: Clip.none,
+                  children: [
+                    Positioned(
+                      left: 10,
+                      bottom: 12,
+                      child: Text(
+                        '${_formatDuration(widget.controller.value.position)} / ${_formatDuration(widget.controller.value.duration)}',
+                        style: const TextStyle(
+                          color: Colors.white,
+                          fontSize: 12,
+                        ),
                       ),
                     ),
-                  ),
-              ],
+                    Listener(
+                      onPointerDown: (_) {
+                        widget.onOverlayTap();
+                      },
+                      child: VideoProgressIndicator(
+                        widget.controller,
+                        allowScrubbing: true,
+                        padding: const EdgeInsets.only(top: 25.0),
+                        colors: VideoProgressColors(
+                          playedColor: Theme.of(context).colorScheme.primary,
+                          backgroundColor: Theme.of(
+                            context,
+                          ).colorScheme.surface.withValues(alpha: 0.5),
+                          bufferedColor: Theme.of(
+                            context,
+                          ).colorScheme.secondary.withValues(alpha: 0.5),
+                        ),
+                      ),
+                    ),
+                    if (widget.controller.value.duration.inMilliseconds > 0)
+                      Positioned(
+                        left:
+                            (widget.controller.value.position.inMilliseconds /
+                                    widget
+                                        .controller
+                                        .value
+                                        .duration
+                                        .inMilliseconds) *
+                                constraints.maxWidth -
+                            6,
+                        bottom: -4,
+                        child: Container(
+                          width: 12,
+                          height: 12,
+                          decoration: BoxDecoration(
+                            shape: BoxShape.circle,
+                            color: Theme.of(context).colorScheme.primary,
+                            border: Border.all(
+                              color: Theme.of(context).colorScheme.primary,
+                              width: 2,
+                            ),
+                          ),
+                        ),
+                      ),
+                  ],
+                );
+              },
             ),
           ),
         ),
@@ -118,30 +194,9 @@ class VideoControlsOverlay extends StatelessWidget {
     );
   }
 
-  String _formatDuration(Duration duration) {
+  String _formatDuration(Duration? duration) {
+    if (duration == null) return '00:00';
     String twoDigits(int n) => n.toString().padLeft(2, '0');
     return "${twoDigits(duration.inMinutes % 60)}:${twoDigits(duration.inSeconds % 60)}";
   }
 }
-
-class _ControlButton extends StatelessWidget {
-  final IconData icon;
-  final VoidCallback onPressed;
-  final double size;
-
-  const _ControlButton(this.icon, this.onPressed, {this.size = 24});
-
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      decoration: BoxDecoration(
-        shape: BoxShape.circle,
-        color: Colors.black.withValues(alpha: 0.4),
-      ),
-      child: IconButton(
-        icon: Icon(icon, size: size),
-        onPressed: onPressed,
-      ),
-    );
-  }
-}

lib/widgets/video_widget.dart

@@ -8,18 +8,21 @@ import 'package:get/get.dart';
 
 import 'package:f0ckapp/models/item.dart';
 import 'package:f0ckapp/widgets/video_controls_overlay.dart';
+import 'package:f0ckapp/controller/settingscontroller.dart';
 import 'package:f0ckapp/controller/mediacontroller.dart';
 
 class VideoWidget extends StatefulWidget {
   final MediaItem details;
   final bool isActive;
   final bool fullScreen;
+  final VoidCallback? onInitialized;
 
   const VideoWidget({
     super.key,
     required this.details,
     required this.isActive,
     this.fullScreen = false,
+    this.onInitialized,
   });
 
   @override
@@ -27,8 +30,12 @@ class VideoWidget extends StatefulWidget {
 }
 
 class _VideoWidgetState extends State<VideoWidget> {
-  final MediaController controller = Get.find<MediaController>();
-  late CachedVideoPlayerPlusController _controller;
+  final MediaController mediaController = Get.find<MediaController>();
+  final SettingsController settingsController = Get.find<SettingsController>();
+  late CachedVideoPlayerPlusController videoController;
+  late Worker _muteWorker;
+  late Worker _timerResetWorker;
+  late Worker _hideControlsWorker;
   bool _showControls = false;
   Timer? _hideControlsTimer;
 
@@ -36,62 +43,102 @@ class _VideoWidgetState extends State<VideoWidget> {
   void initState() {
     super.initState();
     _initController();
+    _muteWorker = ever(settingsController.muted, (bool muted) {
+      if (videoController.value.isInitialized) {
+        videoController.setVolume(muted ? 0.0 : 1.0);
+      }
+    });
+    _timerResetWorker = ever(settingsController.videoControlsTimerNotifier, (
+      _,
+    ) {
+      if (widget.isActive && mounted) {
+        if (!_showControls) {
+          setState(() => _showControls = true);
+        }
+        _startHideControlsTimer();
+      }
+    });
+    _hideControlsWorker = ever(settingsController.hideControlsNotifier, (_) {
+      if (mounted && _showControls) {
+        setState(() => _showControls = false);
+        _hideControlsTimer?.cancel();
+      }
+    });
   }
 
   Future<void> _initController() async {
-    _controller = CachedVideoPlayerPlusController.networkUrl(
+    videoController = CachedVideoPlayerPlusController.networkUrl(
       Uri.parse(widget.details.mediaUrl),
+      videoPlayerOptions: VideoPlayerOptions(mixWithOthers: true),
     );
-    await _controller.initialize();
-    setState(() {});
-    _controller.addListener(() => setState(() {}));
-    _controller.setLooping(true);
-    _controller.setVolume(controller.muted.value ? 0.0 : 1.0);
+    await videoController.initialize();
+    widget.onInitialized?.call();
+    if (!mounted) return;
+    videoController.setLooping(true);
+    videoController.setVolume(settingsController.muted.value ? 0.0 : 1.0);
 
     if (widget.isActive) {
-      _controller.play();
+      videoController.play();
     }
   }
 
   @override
   void didUpdateWidget(covariant VideoWidget oldWidget) {
     super.didUpdateWidget(oldWidget);
+
+    if (widget.details.mediaUrl != oldWidget.details.mediaUrl) {
+      videoController.dispose();
+      _initController();
+      return;
+    }
+
     if (widget.isActive != oldWidget.isActive) {
       if (widget.isActive) {
-        _controller.play();
+        videoController.play();
       } else {
-        _controller.pause();
+        videoController.pause();
       }
     }
   }
 
   @override
   void dispose() {
-    _controller.dispose();
+    _muteWorker.dispose();
+    _timerResetWorker.dispose();
+    _hideControlsWorker.dispose();
+    videoController.dispose();
     _hideControlsTimer?.cancel();
     super.dispose();
   }
 
-  void _onTap({bool ctrlButton = false}) {
-    if (!ctrlButton) {
-      setState(() => _showControls = !_showControls);
-    }
-    if (_showControls) {
-      _hideControlsTimer?.cancel();
-      _hideControlsTimer = Timer(const Duration(seconds: 2), () {
+  void _startHideControlsTimer() {
+    _hideControlsTimer?.cancel();
+    _hideControlsTimer = Timer(const Duration(seconds: 3), () {
+      if (mounted) {
         setState(() => _showControls = false);
-      });
+      }
+    });
+  }
+
+  void _onTap({bool ctrlButton = false}) {
+    if (ctrlButton) {
+      _startHideControlsTimer();
+      return;
+    }
+
+    final bool newShowState = !_showControls;
+    setState(() => _showControls = newShowState);
+
+    if (newShowState) {
+      _startHideControlsTimer();
+    } else {
+      _hideControlsTimer?.cancel();
     }
   }
 
   @override
   Widget build(BuildContext context) {
-    final bool muted = controller.muted.value;
-    if (_controller.value.isInitialized &&
-        _controller.value.volume != (muted ? 0.0 : 1.0)) {
-      _controller.setVolume(muted ? 0.0 : 1.0);
-    }
-
+    final bool muted = settingsController.muted.value;
     bool isAudio = widget.details.mime.startsWith('audio');
 
     Widget mediaContent;
@@ -106,37 +153,43 @@ class _VideoWidgetState extends State<VideoWidget> {
         ),
       );
     } else {
-      mediaContent = _controller.value.isInitialized
-          ? CachedVideoPlayerPlus(_controller)
+      mediaContent = videoController.value.isInitialized
+          ? CachedVideoPlayerPlus(videoController)
           : const Center(child: CircularProgressIndicator());
     }
 
     return AspectRatio(
-      aspectRatio: _controller.value.isInitialized
-          ? _controller.value.aspectRatio
+      aspectRatio: videoController.value.isInitialized
+          ? videoController.value.aspectRatio
           : (isAudio ? 16 / 9 : 9 / 16),
       child: Stack(
         alignment: Alignment.center,
         children: [
           GestureDetector(onTap: _onTap, child: mediaContent),
-          if (_controller.value.isInitialized && _showControls)
-            Positioned.fill(
-              child: GestureDetector(
-                onTap: _onTap,
-                child: Container(
-                  color: Colors.black.withValues(alpha: 0.5),
-                  child: VideoControlsOverlay(
-                    controller: _controller,
-                    onOverlayTap: () => _onTap(ctrlButton: true),
-                    muted: muted,
-                    onMuteToggle: () {
-                      controller.toggleMuted();
-                      setState(() {});
-                    },
+          AnimatedBuilder(
+            animation: videoController,
+            builder: (context, child) {
+              if (videoController.value.isInitialized && _showControls) {
+                return Positioned.fill(
+                  child: GestureDetector(
+                    onTap: _onTap,
+                    child: Container(
+                      color: Colors.black.withValues(alpha: 0.5),
+                      child: VideoControlsOverlay(
+                        controller: videoController,
+                        onOverlayTap: () => _onTap(ctrlButton: true),
+                        muted: muted,
+                        onMuteToggle: () {
+                          settingsController.toggleMuted();
+                        },
+                      ),
+                    ),
                   ),
-                ),
-              ),
-            ),
+                );
+              }
+              return const SizedBox.shrink();
+            },
+          ),
         ],
       ),
     );

pubspec.yaml

@@ -16,7 +16,7 @@ publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 # https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
 # In Windows, build-name is used as the major, minor, and patch parts
 # of the product and file versions while build-number is used as the build suffix.
-version: 1.4.0+61
+version: 1.4.5+66
 
 environment:
   sdk: ^3.9.0-100.2.beta