1.0.25+25

- preload adjacent media

.gitea/workflows/android.yml

@@ -13,6 +13,13 @@ jobs:
       - name: checkout code
         uses: actions/checkout@v4
       
+      - name: cache pub deps
+        uses: actions/cache@v4
+        with:
+          path: ~/.pub-cache
+          key: ${{ runner.os }}-pub-${{ hashFiles('**/pubspec.yaml') }}
+          restore-keys: ${{ runner.os }}-pub-
+      
       - name: set up jdk
         uses: actions/setup-java@v3
         with:

lib/screens/DetailView.dart

@@ -5,6 +5,7 @@ import 'package:f0ckapp/services/Api.dart';
 import 'package:f0ckapp/widgets/VideoWidget.dart';
 import 'package:f0ckapp/utils/SmartRefreshIndicator.dart';
 import 'package:f0ckapp/utils/PageTransformer.dart';
+import 'package:flutter_cache_manager/flutter_cache_manager.dart';
 
 class DetailView extends StatefulWidget {
   final int initialItemId;
@@ -12,6 +13,7 @@ class DetailView extends StatefulWidget {
   final String type;
   final int mode;
   final bool random;
+  final String? tagname;
 
   const DetailView({
     super.key,
@@ -20,6 +22,7 @@ class DetailView extends StatefulWidget {
     required this.type,
     required this.mode,
     required this.random,
+    required this.tagname,
   });
 
   @override
@@ -29,6 +32,7 @@ class DetailView extends StatefulWidget {
 class _DetailViewState extends State<DetailView> {
   late PageController _pageController;
   late List<MediaItem> mediaItems;
+  String? _tagname;
   int currentItemId = 0;
   bool isLoading = false;
 
@@ -36,24 +40,49 @@ class _DetailViewState extends State<DetailView> {
   void initState() {
     super.initState();
     mediaItems = widget.mediaItems;
+    _tagname = widget.tagname;
     final initialIndex = mediaItems.indexWhere(
       (item) => item.id == widget.initialItemId,
     );
     _pageController = PageController(initialPage: initialIndex);
     currentItemId = mediaItems[initialIndex].id;
 
-    _pageController.addListener(_onPageScroll);
+    int? lastLoadedIndex;
+    _pageController.addListener(() async {
+      final newIndex = _pageController.page?.round();
+      if (newIndex != null &&
+          newIndex < mediaItems.length &&
+          newIndex != lastLoadedIndex) {
+        setState(() => currentItemId = mediaItems[newIndex].id);
+        lastLoadedIndex = newIndex;
+
+        _preloadAdjacentMedia(newIndex);
+      }
+
+      if (_pageController.position.pixels >=
+          _pageController.position.maxScrollExtent - 100) {
+        _loadMoreMedia();
+      }
+    });
+
+    _preloadAdjacentMedia(initialIndex);
   }
 
-  void _onPageScroll() {
-    final newIndex = _pageController.page?.round();
-    if (newIndex != null && newIndex < mediaItems.length) {
-      setState(() => currentItemId = mediaItems[newIndex].id);
+  void _preloadAdjacentMedia(int index) async {
+    if (index + 1 < mediaItems.length) {
+      final nextUrl = mediaItems[index + 1].mediaUrl;
+      if (await DefaultCacheManager().getFileFromCache(nextUrl) == null) {
+        await DefaultCacheManager().downloadFile(nextUrl);
+        print('preload ${mediaItems[index + 1].id}');
+      }
     }
 
-    if (_pageController.position.pixels >=
-        _pageController.position.maxScrollExtent - 100) {
-      _loadMoreMedia();
+    if (index - 1 >= 0) {
+      final prevUrl = mediaItems[index - 1].mediaUrl;
+      if (await DefaultCacheManager().getFileFromCache(prevUrl) == null) {
+        await DefaultCacheManager().downloadFile(prevUrl);
+        print('preload ${mediaItems[index - 1].id}');
+      }
     }
   }
 
@@ -67,6 +96,7 @@ class _DetailViewState extends State<DetailView> {
         type: widget.type,
         mode: widget.mode,
         random: widget.random,
+        tag: _tagname,
       );
       if (mounted && newMedia.isNotEmpty) {
         setState(() => mediaItems.addAll(newMedia));
@@ -110,23 +140,62 @@ class _DetailViewState extends State<DetailView> {
         title: Text('f0ck #$currentItemId (${widget.type})'),
         centerTitle: true,
       ),
-      body: PageTransformer(
-        controller: _pageController,
-        pages: mediaItems.map((item) {
-          return Scaffold(
-            body: SafeArea(
-              child: SmartRefreshIndicator(
-                onRefresh: _refreshMediaItem,
-                child: _buildMediaItem(item),
+      body: Stack(
+        children: [
+          PageTransformer(
+            controller: _pageController,
+            pages: mediaItems.map((item) {
+              final isActive = item.id == currentItemId;
+              return Scaffold(
+                body: SafeArea(
+                  child: SmartRefreshIndicator(
+                    onRefresh: _refreshMediaItem,
+                    child: _buildMediaItem(item, isActive),
+                  ),
+                ),
+              );
+            }).toList(),
+          ),
+          if (_tagname != null)
+            Positioned(
+              bottom: 60,
+              left: MediaQuery.of(context).size.width * 0.2,
+              right: MediaQuery.of(context).size.width * 0.2,
+              child: Container(
+                padding: const EdgeInsets.symmetric(
+                  vertical: 10,
+                  horizontal: 20,
+                ),
+                decoration: BoxDecoration(
+                  color: Colors.black.withValues(alpha: 0.8),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Text(
+                      'Tag: $_tagname',
+                      style: const TextStyle(color: Colors.white),
+                    ),
+                    IconButton(
+                      icon: const Icon(Icons.close, color: Colors.white),
+                      onPressed: () {
+                        setState(() {
+                          _tagname = '___empty___';
+                          Navigator.pop(context, _tagname);
+                        });
+                      },
+                    ),
+                  ],
+                ),
               ),
             ),
-          );
-        }).toList(),
+        ],
       ),
     );
   }
 
-  Widget _buildMediaItem(MediaItem item) {
+  Widget _buildMediaItem(MediaItem item, bool isActive) {
     return SingleChildScrollView(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
@@ -139,7 +208,7 @@ class _DetailViewState extends State<DetailView> {
               errorWidget: (context, url, error) => Icon(Icons.error),
             )
           else
-            VideoWidget(details: item),
+            VideoWidget(details: item, isActive: isActive),
           const SizedBox(height: 20),
           Text(
             item.mime,
@@ -150,14 +219,23 @@ class _DetailViewState extends State<DetailView> {
             alignment: WrapAlignment.center,
             spacing: 5.0,
             children: item.tags.map((tag) {
-              return Chip(
-                label: Text(tag.tag),
-                backgroundColor: switch (tag.id) {
-                  1 => Colors.green,
-                  2 => Colors.red,
-                  _ => const Color(0xFF090909),
+              return GestureDetector(
+                onTap: () {
+                  if (tag.tag == 'sfw' || tag.tag == 'nsfw') return;
+                  setState(() {
+                    _tagname = tag.tag;
+                    Navigator.pop(context, _tagname);
+                  });
                 },
-                labelStyle: const TextStyle(color: Colors.white),
+                child: Chip(
+                  label: Text(tag.tag),
+                  backgroundColor: switch (tag.id) {
+                    1 => Colors.green,
+                    2 => Colors.red,
+                    _ => const Color(0xFF090909),
+                  },
+                  labelStyle: const TextStyle(color: Colors.white),
+                ),
               );
             }).toList(),
           ),

lib/screens/MediaGrid.dart

@@ -14,7 +14,7 @@ class MediaGrid extends StatefulWidget {
 
 class _MediaGridState extends State<MediaGrid> {
   final ScrollController _scrollController = ScrollController();
-  final String _version = '1.0.22+22';
+  final String _version = '1.0.25+25';
   List<MediaItem> mediaItems = [];
   bool isLoading = false;
   Timer? _debounceTimer;
@@ -24,6 +24,7 @@ class _MediaGridState extends State<MediaGrid> {
   int _selectedMode = 0;
   bool _random = false;
   final List<String> _modes = ["sfw", "nsfw", "untagged", "all"];
+  String? _selectedTag;
 
   @override
   void initState() {
@@ -63,6 +64,7 @@ class _MediaGridState extends State<MediaGrid> {
         type: _selectedType,
         mode: _selectedMode,
         random: _random,
+        tag: _selectedTag,
       );
       if (mounted) {
         setState(() => mediaItems.addAll(newMedia));
@@ -86,6 +88,7 @@ class _MediaGridState extends State<MediaGrid> {
         type: _selectedType,
         mode: _selectedMode,
         random: _random,
+        tag: _selectedTag,
       );
       if (mounted) {
         setState(() {
@@ -110,7 +113,7 @@ class _MediaGridState extends State<MediaGrid> {
     _navigationCompleter = Completer();
     try {
       if (mounted) {
-        await Navigator.push(
+        final String? newTag = await Navigator.push(
           context,
           MaterialPageRoute(
             builder: (context) => DetailView(
@@ -119,9 +122,22 @@ class _MediaGridState extends State<MediaGrid> {
               type: _selectedType,
               mode: _selectedMode,
               random: _random,
+              tagname: _selectedTag,
             ),
           ),
         );
+
+        if (newTag != null) {
+          setState(() {
+            if (newTag == '___empty___') {
+              _selectedTag = null;
+            }
+            else {
+              _selectedTag = newTag;
+            }
+            _refreshMedia();
+          });
+        }
       }
     } catch (e) {
       if (mounted) {
@@ -153,9 +169,9 @@ class _MediaGridState extends State<MediaGrid> {
                   _refreshMedia();
                 });
               },
-            )
-          ]
-        )
+            ),
+          ],
+        ),
       ),
       bottomNavigationBar: BottomAppBar(
         color: const Color.fromARGB(255, 43, 43, 43),
@@ -228,51 +244,105 @@ class _MediaGridState extends State<MediaGrid> {
           ),
         ),
       ),
-      body: RefreshIndicator(
-        onRefresh: _refreshMedia,
-        child: GridView.builder(
-          controller: _scrollController,
-          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-            crossAxisCount: _calculateCrossAxisCount(context),
-            crossAxisSpacing: 5.0,
-            mainAxisSpacing: 5.0,
-          ),
-          itemCount: mediaItems.length + (isLoading ? 1 : 0),
-          itemBuilder: (context, index) {
-            if (index >= mediaItems.length) {
-              return const Center(child: CircularProgressIndicator());
-            }
-            final item = mediaItems[index];
-
-            return InkWell(
-              onTap: () => _navigateToDetail(item),
-              child: Stack(
-                fit: StackFit.expand,
-                children: <Widget>[
-                  CachedNetworkImage(
-                    imageUrl: item.thumbnailUrl,
-                    fit: BoxFit.cover,
-                    placeholder: (context, url) => SizedBox.shrink(),
-                    errorWidget: (context, url, error) => Icon(Icons.error),
-                  ),
-                  Align(
-                    alignment: FractionalOffset.bottomRight,
-                    child: Icon(
-                      Icons.square,
-                      color: switch (item.mode) {
-                        1 => Colors.green,
-                        2 => Colors.red,
-                        _ => Colors.yellow
-                      },
-                      size: 15.0
-                    ),
-                  ),
-                ],
+      body: Stack(
+        children: [
+          RefreshIndicator(
+            onRefresh: _refreshMedia,
+            child: GridView.builder(
+              controller: _scrollController,
+              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                crossAxisCount: _calculateCrossAxisCount(context),
+                crossAxisSpacing: 5.0,
+                mainAxisSpacing: 5.0,
               ),
-            );
-          },
-        ),
+              itemCount: mediaItems.length + (isLoading ? 1 : 0),
+              itemBuilder: (context, index) {
+                if (index >= mediaItems.length) {
+                  return const Center(child: CircularProgressIndicator());
+                }
+                final item = mediaItems[index];
+
+                return InkWell(
+                  onTap: () => _navigateToDetail(item),
+                  child: Stack(
+                    fit: StackFit.expand,
+                    children: <Widget>[
+                      CachedNetworkImage(
+                        imageUrl: item.thumbnailUrl,
+                        fit: BoxFit.cover,
+                        placeholder: (context, url) => SizedBox.shrink(),
+                        errorWidget: (context, url, error) => Icon(Icons.error),
+                      ),
+                      Align(
+                        alignment: FractionalOffset.bottomRight,
+                        child: Icon(
+                          Icons.square,
+                          color: switch (item.mode) {
+                            1 => Colors.green,
+                            2 => Colors.red,
+                            _ => Colors.yellow,
+                          },
+                          size: 15.0,
+                        ),
+                      ),
+                    ],
+                  ),
+                );
+              },
+            ),
+          ),
+          if (_selectedTag != null)
+            Positioned(
+              bottom: 20,
+              left: MediaQuery.of(context).size.width * 0.2,
+              right: MediaQuery.of(context).size.width * 0.2,
+              child: Container(
+                padding: const EdgeInsets.symmetric(
+                  vertical: 10,
+                  horizontal: 20,
+                ),
+                decoration: BoxDecoration(
+                  color: Colors.black.withValues(alpha: 0.8),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Text(
+                      'Tag: $_selectedTag',
+                      style: const TextStyle(color: Colors.white),
+                    ),
+                    IconButton(
+                      icon: const Icon(Icons.close, color: Colors.white),
+                      onPressed: () {
+                        setState(() {
+                          _selectedTag = null;
+                          _refreshMedia();
+                        });
+                        _scrollController.animateTo(
+                          0.0,
+                          duration: const Duration(milliseconds: 500),
+                          curve: Curves.easeOut,
+                        );
+                      },
+                    ),
+                  ],
+                ),
+              ),
+            ),
+        ],
       ),
+      /*floatingActionButton: FloatingActionButton(
+        backgroundColor: Colors.black.withValues(alpha: 0.8),
+        child: const Icon(Icons.arrow_upward, color: Colors.white),
+        onPressed: () {
+          _scrollController.animateTo(
+            0.0,
+            duration: const Duration(milliseconds: 500),
+            curve: Curves.easeOut,
+          );
+        },
+      ),*/
     );
   }
 

lib/services/Api.dart

@@ -8,12 +8,14 @@ Future<List<MediaItem>> fetchMedia({
   String? type,
   int? mode,
   bool? random,
+  String? tag,
 }) async {
   final Uri url = Uri.parse('https://api.f0ck.me/items/get').replace(
     queryParameters: {
       'type': type ?? 'image',
       'mode': (mode ?? 0).toString(),
       'random': (random! ? 1 : 0).toString(),
+      if (tag != null) 'tag': tag,
       if (older != null) 'older': older,
     },
   );

lib/widgets/VideoOverlay.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
-import 'package:video_player/video_player.dart';
+import 'package:cached_video_player_plus/cached_video_player_plus.dart';
 
 class VideoControlsOverlay extends StatelessWidget {
-  final VideoPlayerController controller;
+  final CachedVideoPlayerPlusController controller;
   final VoidCallback button;
 
   const VideoControlsOverlay({
@@ -76,7 +76,7 @@ class _ControlButton extends StatelessWidget {
 }
 
 class _ProgressIndicator extends StatelessWidget {
-  final VideoPlayerController controller;
+  final CachedVideoPlayerPlusController controller;
 
   const _ProgressIndicator({required this.controller});
 

lib/widgets/VideoWidget.dart

@@ -1,21 +1,22 @@
-import 'dart:async';
-
 import 'package:flutter/material.dart';
-import 'package:video_player/video_player.dart';
+import 'package:cached_video_player_plus/cached_video_player_plus.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:f0ckapp/models/MediaItem.dart';
 import 'package:f0ckapp/widgets/VideoOverlay.dart';
+import 'dart:async';
 
 class VideoWidget extends StatefulWidget {
   final MediaItem details;
-  const VideoWidget({super.key, required this.details});
+  final bool isActive;
+
+  const VideoWidget({super.key, required this.details, required this.isActive});
 
   @override
   State createState() => _VideoWidgetState();
 }
 
 class _VideoWidgetState extends State<VideoWidget> {
-  late VideoPlayerController _controller;
+  late CachedVideoPlayerPlusController _controller;
   bool _showControls = false;
   Timer? _hideControlsTimer;
 
@@ -26,14 +27,16 @@ class _VideoWidgetState extends State<VideoWidget> {
   }
 
   Future<void> _initController() async {
-    _controller = VideoPlayerController.networkUrl(
+    _controller = CachedVideoPlayerPlusController.networkUrl(
       Uri.parse(widget.details.mediaUrl),
     );
     await _controller.initialize();
     setState(() {});
 
     _controller.addListener(() => setState(() {}));
-    _controller.play();
+    if (widget.isActive) {
+      _controller.play();
+    }
     _controller.setLooping(true);
   }
 
@@ -44,6 +47,16 @@ class _VideoWidgetState extends State<VideoWidget> {
     super.dispose();
   }
 
+  @override
+  void didUpdateWidget(VideoWidget oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.isActive) {
+      _controller.play();
+    } else {
+      _controller.pause();
+    }
+  }
+
   void _onTap({bool ctrlButton = false}) {
     if (!ctrlButton) {
       setState(() => _showControls = !_showControls);
@@ -69,7 +82,7 @@ class _VideoWidgetState extends State<VideoWidget> {
               ? _controller.value.aspectRatio
               : 9 / 16,
           child: Stack(
-            alignment: Alignment.center,
+            alignment: Alignment.topCenter,
             children: [
               GestureDetector(
                 onTap: _onTap,
@@ -79,17 +92,29 @@ class _VideoWidgetState extends State<VideoWidget> {
                         fit: BoxFit.cover,
                         placeholder: (context, url) =>
                             CircularProgressIndicator(),
-                        errorWidget: (context, url, error) => Image.network(
-                          "https://f0ck.me/s/img/music.webp",
+                        errorWidget: (context, url, error) => Image.asset(
+                          'assets/images/music.webp',
                           fit: BoxFit.contain,
+                          width: double.infinity,
                         ),
                       )
                     : _controller.value.isInitialized
-                    ? VideoPlayer(_controller)
+                    ? CachedVideoPlayerPlus(_controller)
                     : Center(child: CircularProgressIndicator()),
               ),
               if (_controller.value.isInitialized && _showControls) ...[
-                VideoControlsOverlay(controller: _controller, button: () => _onTap(ctrlButton: true)),
+                IgnorePointer(
+                  ignoring: true,
+                  child: Container(
+                    color: Colors.black.withValues(alpha: 0.5),
+                    width: double.infinity,
+                    height: double.infinity,
+                  ),
+                ),
+                VideoControlsOverlay(
+                  controller: _controller,
+                  button: () => _onTap(ctrlButton: true),
+                ),
               ],
             ],
           ),

pubspec.lock

@@ -41,6 +41,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.3.1"
+  cached_video_player_plus:
+    dependency: "direct main"
+    description:
+      name: cached_video_player_plus
+      sha256: "451ee48bdbd28fac3d49b4389929c44d259b1def5be6dab0c5bfd3ae1f05e8b5"
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.0.3"
   characters:
     dependency: transitive
     description:
@@ -152,6 +160,22 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  get:
+    dependency: transitive
+    description:
+      name: get
+      sha256: c79eeb4339f1f3deffd9ec912f8a923834bec55f7b49c9e882b8fef2c139d425
+      url: "https://pub.dev"
+    source: hosted
+    version: "4.7.2"
+  get_storage:
+    dependency: transitive
+    description:
+      name: get_storage
+      sha256: "39db1fffe779d0c22b3a744376e86febe4ade43bf65e06eab5af707dc84185a2"
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.1.1"
   html:
     dependency: transitive
     description:
@@ -453,14 +477,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.2.0"
-  video_player:
-    dependency: "direct main"
-    description:
-      name: video_player
-      sha256: "7d78f0cfaddc8c19d4cb2d3bebe1bfef11f2103b0a03e5398b303a1bf65eeb14"
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.9.5"
   video_player_android:
     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.0.22+22
+version: 1.0.25+25
 
 environment:
   sdk: ^3.9.0-100.2.beta
@@ -31,12 +31,12 @@ dependencies:
   flutter:
     sdk: flutter
   http: ^1.4.0
-  video_player: ^2.2.10
 
   # The following adds the Cupertino Icons font to your application.
   # Use with the CupertinoIcons class for iOS style icons.
   cupertino_icons: ^1.0.8
   cached_network_image: ^3.4.1
+  cached_video_player_plus: ^3.0.3
 
 dev_dependencies:
   flutter_test:
@@ -61,7 +61,8 @@ flutter:
   uses-material-design: true
 
   # To add assets to your application, add an assets section, like this:
-  # assets:
+  assets:
+    - assets/images/
   #   - images/a_dot_burr.jpeg
   #   - images/a_dot_ham.jpeg