v1.4.9+70

lib/screens/mediadetail.dart

@@ -7,6 +7,7 @@ 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:timeago/timeago.dart' as timeago;
 
 import 'package:f0ckapp/services/api.dart';
 import 'package:f0ckapp/widgets/tagfooter.dart';
@@ -43,8 +44,8 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
 
   bool _isLoading = true;
   bool _itemNotFound = false;
-  final Set<int> _readyItemIds = {};
+  final RxSet<int> _readyItemIds = <int>{}.obs;
-  final Map<int, bool> _showFavoriteAnimation = {};
+  final Rxn<int> _animatingFavoriteId = Rxn<int>();
 
   final List<PopupMenuEntry<ShareAction>> _shareMenuItems = const [
     PopupMenuItem(
@@ -67,6 +68,7 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
   @override
   void initState() {
     super.initState();
+    timeago.setLocaleMessages('de', timeago.DeMessages());
     _loadInitialItem();
   }
 
@@ -139,7 +141,7 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       _currentIndex.value = idx;
       final MediaItem item = mediaController.items[idx];
       if (item.mime.startsWith('image/') && !_readyItemIds.contains(item.id)) {
-        setState(() => _readyItemIds.add(item.id));
+        _readyItemIds.add(item.id);
       }
     }
 
@@ -271,17 +273,20 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       mediaController.items.refresh();
     }
 
-    if (!mounted) return;
+    _animatingFavoriteId.value = item.id;
-    setState(() => _showFavoriteAnimation[item.id] = true);
     Future.delayed(const Duration(milliseconds: 700), () {
-      if (mounted) {
+      if (_animatingFavoriteId.value == item.id) {
-        setState(() => _showFavoriteAnimation[item.id] = false);
+        _animatingFavoriteId.value = null;
       }
     });
   }
 
   Widget _buildMedia(MediaItem item, bool isActive) {
     Widget mediaWidget;
+    final bool isFavorite =
+        item.favorites?.any((f) => f.userId == authController.user.value?.id) ??
+        false;
+
     if (item.mime.startsWith('image/')) {
       mediaWidget = CachedNetworkImage(
         imageUrl: item.mediaUrl,
@@ -292,7 +297,7 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       );
     } else if (item.mime.startsWith('video/') ||
         item.mime.startsWith('audio/')) {
-      final key = _videoWidgetKeys.putIfAbsent(
+      final GlobalKey<VideoWidgetState> key = _videoWidgetKeys.putIfAbsent(
         item.id,
         () => GlobalKey<VideoWidgetState>(),
       );
@@ -302,7 +307,7 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
         isActive: isActive,
         onInitialized: () {
           if (mounted && !_readyItemIds.contains(item.id)) {
-            setState(() => _readyItemIds.add(item.id));
+            _readyItemIds.add(item.id);
           }
         },
       );
@@ -310,23 +315,22 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
       mediaWidget = const Icon(Icons.help_outline, size: 100);
     }
 
-    final bool isFavorite =
-        item.favorites?.any((f) => f.userId == authController.user.value?.id) ??
-        false;
-
     return Hero(
       tag: 'media_${item.id}',
-      child: GestureDetector(
+      child: Stack(
-        onDoubleTap: () => _handleFavoriteToggle(item, isFavorite),
+        alignment: Alignment.center,
-        child: Stack(
+        children: [
-          alignment: Alignment.center,
+          GestureDetector(
-          children: [
+            onDoubleTap: () => _handleFavoriteToggle(item, isFavorite),
-            mediaWidget,
+            child: mediaWidget,
-            AnimatedOpacity(
+          ),
-              opacity: _showFavoriteAnimation[item.id] ?? false ? 1.0 : 0.0,
+          Obx(() {
+            final showAnimation = _animatingFavoriteId.value == item.id;
+            return AnimatedOpacity(
+              opacity: showAnimation ? 1.0 : 0.0,
               duration: const Duration(milliseconds: 200),
               child: AnimatedScale(
-                scale: _showFavoriteAnimation[item.id] ?? false ? 1.0 : 0.5,
+                scale: showAnimation ? 1.0 : 0.5,
                 duration: const Duration(milliseconds: 400),
                 curve: Curves.easeOutBack,
                 child: Icon(
@@ -335,174 +339,188 @@ class _MediaDetailScreenState extends State<MediaDetailScreen> {
                   size: 100,
                 ),
               ),
-            ),
+            );
-          ],
+          }),
-        ),
+        ],
       ),
     );
   }
 
-  @override
+  PreferredSizeWidget _buildAppBar(BuildContext context) {
-  Widget build(BuildContext context) {
+    return AppBar(
+      title: Obx(() {
+        if (_isLoading) {
+          return Text('Lade f0ck #${widget.initialId}...');
+        }
+        if (_itemNotFound ||
+            mediaController.items.isEmpty ||
+            _currentIndex.value >= mediaController.items.length) {
+          return const Text('Fehler');
+        }
+        final MediaItem currentItem =
+            mediaController.items[_currentIndex.value];
+        return Text('f0ck #${currentItem.id}');
+      }),
+      actions: [
+        Obx(() {
+          final bool showActions =
+              !_isLoading &&
+              !_itemNotFound &&
+              mediaController.items.isNotEmpty &&
+              _currentIndex.value < mediaController.items.length;
+
+          if (!showActions) {
+            return const SizedBox.shrink();
+          }
+          final MediaItem currentItem =
+              mediaController.items[_currentIndex.value];
+          return Row(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              IconButton(
+                icon: const Icon(Icons.fullscreen),
+                onPressed: () => _handleFullScreen(currentItem),
+              ),
+              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(),
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildBody(BuildContext context) {
     if (_isLoading) {
-      return Scaffold(
+      return const Center(child: CircularProgressIndicator());
-        appBar: AppBar(title: Text('Lade f0ck #${widget.initialId}...')),
-        body: const Center(child: CircularProgressIndicator()),
-      );
     }
 
     if (_itemNotFound) {
-      return Scaffold(
+      return const Center(child: Text('f0ck nicht gefunden.'));
-        appBar: AppBar(title: const Text('Fehler')),
-        body: const Center(child: Text('f0ck nicht gefunden.')),
-      );
     }
 
     return Obx(() {
-      if (mediaController.items.isEmpty ||
+      if (mediaController.items.isEmpty) {
-          _currentIndex.value >= mediaController.items.length) {
+        return const Center(child: Text('Keine Items zum Anzeigen.'));
-        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: () => _handleFullScreen(currentItem),
-            ),
-            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: Stack(
-          children: [
-            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 PullexRefreshController refreshController =
-                    _refreshControllers.putIfAbsent(
-                      item.id,
-                      () => PullexRefreshController(),
-                    );
 
-                return PullexRefresh(
+      return PageView.builder(
-                  onRefresh: () => _onRefresh(item.id, refreshController),
+        controller: _pageController!,
-                  header: const WaterDropHeader(),
+        itemCount: mediaController.items.length,
-                  controller: refreshController,
+        onPageChanged: _onPageChanged,
-                  child: CustomScrollView(
+        itemBuilder: (context, index) {
-                    slivers: [
+          if (index >= mediaController.items.length) {
-                      SliverToBoxAdapter(
+            return const SizedBox.shrink();
-                        child: AnimatedBuilder(
+          }
-                          animation: _pageController!,
+          final MediaItem item = mediaController.items[index];
-                          builder: (context, child) {
+          final PullexRefreshController refreshController = _refreshControllers
-                            return buildAnimatedTransition(
+              .putIfAbsent(item.id, () => PullexRefreshController());
-                              context: context,
+
-                              pageController: _pageController!,
+          return Obx(() {
-                              index: index,
+            final bool isReady = _readyItemIds.contains(item.id);
-                              child: child!,
+            return PullexRefresh(
-                            );
+              onRefresh: () => _onRefresh(item.id, refreshController),
-                          },
+              header: const WaterDropHeader(),
-                          child: Obx(
+              controller: refreshController,
-                            () =>
+              child: CustomScrollView(
-                                _buildMedia(item, index == _currentIndex.value),
+                slivers: [
-                          ),
+                  SliverToBoxAdapter(
-                        ),
+                    child: AnimatedBuilder(
+                      animation: _pageController!,
+                      builder: (context, child) {
+                        return buildAnimatedTransition(
+                          context: context,
+                          pageController: _pageController!,
+                          index: index,
+                          child: child!,
+                        );
+                      },
+                      child: Obx(
+                        () => _buildMedia(item, index == _currentIndex.value),
                       ),
-                      if (isReady)
+                    ),
-                        SliverFillRemaining(
-                          hasScrollBody: false,
-                          fillOverscroll: true,
-                          child: Padding(
-                            padding: const EdgeInsets.all(16.0),
-                            child: Column(
-                              crossAxisAlignment: CrossAxisAlignment.center,
-                              children: [TagSection(tags: item.tags ?? [])],
-                            ),
-                          ),
-                        ),
-                      const SliverToBoxAdapter(
-                        child: SafeArea(child: SizedBox.shrink()),
-                      ),
-                    ],
                   ),
-                );
+                  if (isReady)
-              },
+                    SliverToBoxAdapter(
-            ),
+                      child: Padding(
-            Obx(() {
+                        padding: const EdgeInsets.all(16.0),
-              if (!authController.isLoggedIn) {
+                        child: Column(
-                return const SizedBox.shrink();
+                          crossAxisAlignment: CrossAxisAlignment.center,
-              }
+                          children: [
-              final MediaItem currentItem =
+                            TagSection(tags: item.tags ?? []),
-                  mediaController.items[_currentIndex.value];
+                            Obx(() {
-
+                              if (!authController.isLoggedIn) {
-              final bool hasSoftButtons =
+                                return const SizedBox.shrink();
-                  MediaQuery.of(context).padding.bottom > 24.0;
+                              }
-
+                              final TextStyle? infoTextStyle = Theme.of(
-              return DraggableScrollableSheet(
+                                context,
-                initialChildSize: hasSoftButtons ? 0.11 : 0.2,
+                              ).textTheme.bodySmall;
-                minChildSize: hasSoftButtons ? 0.11 : 0.2,
+                              return Padding(
-                maxChildSize: hasSoftButtons ? 0.245 : 0.2,
+                                padding: const EdgeInsets.only(top: 24.0),
-                snap: true,
+                                child: Column(
-                builder: (context, scrollController) => ListView(
+                                  children: [
-                  controller: scrollController,
+                                    FavoriteSection(item: item, index: index),
-                  padding: const EdgeInsets.only(left: 16, right: 16),
+                                    const SizedBox(height: 16),
-                  children: [
+                                    Text(
-                    FavoriteSection(
+                                      "Dateigröße: ${(item.size / 1024).toStringAsFixed(1)} KB",
-                      item: currentItem,
+                                      style: infoTextStyle,
-                      index: _currentIndex.value,
+                                    ),
+                                    Text(
+                                      "Typ: ${item.mime}",
+                                      style: infoTextStyle,
+                                    ),
+                                    Text(
+                                      "ID: ${item.id}",
+                                      style: infoTextStyle,
+                                    ),
+                                    Text(
+                                      "Hochgeladen: ${timeago.format(DateTime.fromMillisecondsSinceEpoch(item.stamp * 1000), locale: 'de')}",
+                                      style: infoTextStyle,
+                                    ),
+                                  ],
+                                ),
+                              );
+                            }),
+                          ],
+                        ),
+                      ),
                     ),
-                    const SizedBox(height: 16),
+                  const SliverToBoxAdapter(
-                    Text(
+                    child: SafeArea(child: SizedBox.shrink()),
-                      "Dateigröße: ${(currentItem.size / 1024).toStringAsFixed(1)} KB",
+                  ),
-                      style: Theme.of(context).textTheme.bodySmall,
+                ],
-                    ),
+              ),
-                    Text(
+            );
-                      "Typ: ${currentItem.mime}",
+          });
-                      style: Theme.of(context).textTheme.bodySmall,
+        },
-                    ),
-                    Text(
-                      "ID: ${currentItem.id}",
-                      style: Theme.of(context).textTheme.bodySmall,
-                    ),
-                    Text(
-                      "Hochgeladen am: ${DateTime.fromMillisecondsSinceEpoch(currentItem.stamp * 1000)}",
-                      style: Theme.of(context).textTheme.bodySmall,
-                    ),
-                  ],
-                ),
-              );
-            }),
-          ],
-        ),
-        persistentFooterButtons: mediaController.tag.value != null
-            ? [TagFooter()]
-            : null,
       );
     });
   }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      endDrawer: const EndDrawer(),
+      endDrawerEnableOpenDragGesture:
+          settingsController.drawerSwipeEnabled.value,
+      appBar: _buildAppBar(context),
+      body: _buildBody(context),
+      persistentFooterButtons: mediaController.tag.value != null
+          ? [TagFooter()]
+          : null,
+    );
+  }
 }

lib/widgets/video_controls_overlay.dart

@@ -1,13 +1,19 @@
 import 'dart:async';
+
 import 'package:flutter/material.dart';
+
 import 'package:cached_video_player_plus/cached_video_player_plus.dart';
 import 'package:get/get.dart';
+
 import 'package:f0ckapp/controller/settingscontroller.dart';
 
 class VideoControlsOverlay extends StatefulWidget {
   final CachedVideoPlayerPlusController controller;
 
-  const VideoControlsOverlay({super.key, required this.controller});
+  const VideoControlsOverlay({
+    super.key,
+    required this.controller,
+  });
 
   @override
   State<VideoControlsOverlay> createState() => _VideoControlsOverlayState();
@@ -116,55 +122,37 @@ class _VideoControlsOverlayState extends State<VideoControlsOverlay> {
 
   @override
   Widget build(BuildContext context) {
-    return GestureDetector(
+    return Stack(
-      behavior: HitTestBehavior.opaque,
+      children: [
-      onTap: _toggleControlsVisibility,
+        Positioned.fill(
-      onHorizontalDragStart: _controlsVisible ? _onHorizontalDragStart : null,
+          child: GestureDetector(
-      onHorizontalDragUpdate: _controlsVisible ? _onHorizontalDragUpdate : null,
+            onTap: _toggleControlsVisibility,
-      onHorizontalDragEnd: _controlsVisible ? _onHorizontalDragEnd : null,
+            onHorizontalDragStart: _controlsVisible ? _onHorizontalDragStart : null,
-      onHorizontalDragCancel: _controlsVisible ? _onHorizontalDragCancel : null,
+            onHorizontalDragUpdate: _controlsVisible ? _onHorizontalDragUpdate : null,
-      child: Stack(
+            onHorizontalDragEnd: _controlsVisible ? _onHorizontalDragEnd : null,
-        alignment: Alignment.center,
+            onHorizontalDragCancel: _controlsVisible ? _onHorizontalDragCancel : null,
-        children: [
+            child: AnimatedContainer(
-          AnimatedContainer(
+              duration: const Duration(milliseconds: 300),
-            duration: const Duration(milliseconds: 300),
+              color: _controlsVisible && !_isScrubbing
-            color: _controlsVisible && !_isScrubbing
+                  ? Colors.black.withValues(alpha: 0.5)
-                ? Colors.black.withValues(alpha: 0.5)
+                  : Colors.transparent,
-                : Colors.transparent,
-          ),
-          AnimatedOpacity(
-            opacity: _isScrubbing ? 1.0 : 0.0,
-            duration: const Duration(milliseconds: 200),
-            child: _buildScrubbingIndicator(),
-          ),
-          AnimatedOpacity(
-            opacity: _controlsVisible && !_isScrubbing ? 1.0 : 0.0,
-            duration: const Duration(milliseconds: 300),
-            child: IgnorePointer(
-              ignoring: !_controlsVisible,
-              child: Stack(
-                alignment: Alignment.center,
-                children: [
-                  IconButton(
-                    icon: Icon(
-                      widget.controller.value.isPlaying
-                          ? Icons.pause
-                          : Icons.play_arrow,
-                      size: 64,
-                      color: Theme.of(context).colorScheme.primary,
-                    ),
-                    onPressed: _handlePlayPause,
-                  ),
-                  Align(
-                    alignment: Alignment.bottomCenter,
-                    child: _buildBottomBar(),
-                  ),
-                ],
-              ),
             ),
           ),
-        ],
+        ),
-      ),
+        AnimatedOpacity(
+          opacity: _isScrubbing ? 1.0 : 0.0,
+          duration: const Duration(milliseconds: 200),
+          child: _buildScrubbingIndicator(),
+        ),
+        AnimatedOpacity(
+          opacity: _controlsVisible && !_isScrubbing ? 1.0 : 0.0,
+          duration: const Duration(milliseconds: 300),
+          child: Align(
+            alignment: Alignment.bottomCenter,
+            child: _buildBottomBar(),
+          ),
+        ),
+      ],
     );
   }
 
@@ -205,9 +193,21 @@ class _VideoControlsOverlayState extends State<VideoControlsOverlay> {
 
   Widget _buildBottomBar() {
     return Padding(
-      padding: const EdgeInsets.fromLTRB(16, 0, 16, 8),
+      padding: const EdgeInsets.fromLTRB(12, 0, 12, 5),
       child: Row(
         children: [
+          IconButton(
+            icon: Icon(
+              widget.controller.value.isPlaying
+                  ? Icons.pause
+                  : Icons.play_arrow,
+              color: Theme.of(context).colorScheme.primary,
+              size: 24,
+            ),
+            onPressed: _handlePlayPause,
+            constraints: const BoxConstraints(),
+            padding: EdgeInsets.zero,
+          ),
           Text(
             _formatDuration(widget.controller.value.position),
             style: TextStyle(
@@ -244,7 +244,7 @@ class _VideoControlsOverlayState extends State<VideoControlsOverlay> {
                     ? Icons.volume_off
                     : Icons.volume_up,
                 color: Theme.of(context).colorScheme.primary,
-                size: 20,
+                size: 24,
               ),
               onPressed: () {
                 _settingsController.toggleMuted();

lib/widgets/video_widget.dart

@@ -100,7 +100,8 @@ class VideoWidgetState extends State<VideoWidget> {
 
   @override
   Widget build(BuildContext context) {
-    bool isAudio = widget.details.mime.startsWith('audio');
+    final bool isInitialized = videoController.value.isInitialized;
+    final bool isAudio = widget.details.mime.startsWith('audio');
 
     Widget mediaContent;
     if (isAudio) {
@@ -114,30 +115,23 @@ class VideoWidgetState extends State<VideoWidget> {
         ),
       );
     } else {
-      mediaContent = videoController.value.isInitialized
+      mediaContent = isInitialized
           ? CachedVideoPlayerPlus(videoController)
           : const Center(child: CircularProgressIndicator());
     }
 
     return AspectRatio(
-      aspectRatio: videoController.value.isInitialized
+      aspectRatio: isInitialized
           ? videoController.value.aspectRatio
           : (isAudio ? 16 / 9 : 9 / 16),
       child: Stack(
         alignment: Alignment.center,
         children: [
           mediaContent,
-          AnimatedBuilder(
+          if (isInitialized)
-            animation: videoController,
+            Positioned.fill(
-            builder: (context, child) {
+              child: VideoControlsOverlay(controller: videoController),
-              if (videoController.value.isInitialized) {
+            ),
-                return Positioned.fill(
-                  child: VideoControlsOverlay(controller: videoController),
-                );
-              }
-              return const SizedBox.shrink();
-            },
-          ),
         ],
       ),
     );

pubspec.lock

@@ -264,6 +264,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.1.2"
+  intl:
+    dependency: transitive
+    description:
+      name: intl
+      sha256: "3df61194eb431efc39c4ceba583b95633a403f46c9fd341e550ce0bfa50e9aa5"
+      url: "https://pub.dev"
+    source: hosted
+    version: "0.20.2"
   js:
     dependency: transitive
     description:
@@ -661,6 +669,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.7.6"
+  timeago:
+    dependency: "direct main"
+    description:
+      name: timeago
+      sha256: b05159406a97e1cbb2b9ee4faa9fb096fe0e2dfcd8b08fcd2a00553450d3422e
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.7.1"
   typed_data:
     dependency: transitive
     description:

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.8+69
+version: 1.4.9+70
 
 environment:
   sdk: ^3.9.0-100.2.beta
@@ -37,6 +37,7 @@ dependencies:
   share_plus: ^11.0.0
   flutter_cache_manager: ^3.4.1
   pullex: ^1.0.0
+  timeago: ^3.7.1
 
 dev_dependencies:
   flutter_test: