✨ Video player!

2024-05-27 23:07:01 +08:00
parent 6e09414036
commit 9aceabd83c
11 changed files with 300 additions and 46 deletions
--- a/lib/providers/content/attachment.dart
+++ b/lib/providers/content/attachment.dart
@@ -30,6 +30,8 @@ class AttachmentProvider extends GetConnect {
    httpClient.baseUrl = ServiceFinder.services['paperclip'];
  }

+  static Map<String, String> mimetypeOverrides = {'mov': 'video/quicktime'};
+
  Future<Response> getMetadata(int id) => get('/api/attachments/$id/meta');

  Future<Response> createAttachment(File file, String hash, String usage,
@@ -46,7 +48,15 @@ class AttachmentProvider extends GetConnect {
    final fileAlt = basename(file.path).contains('.')
        ? basename(file.path).substring(0, basename(file.path).lastIndexOf('.'))
        : basename(file.path);
+    final fileExt = basename(file.path)
+        .substring(basename(file.path).lastIndexOf('.') + 1)
+        .toLowerCase();

+    // Override for some files cannot be detected mimetype by server-side
+    String? mimetypeOverride;
+    if (mimetypeOverrides.keys.contains(fileExt)) {
+      mimetypeOverride = mimetypeOverrides[fileExt];
+    }
    final resp = await client.post(
      '/api/attachments',
      FormData({
@@ -54,16 +64,17 @@ class AttachmentProvider extends GetConnect {
        'file': filePayload,
        'hash': hash,
        'usage': usage,
+        if (mimetypeOverride != null) 'mimetype': mimetypeOverride,
        'metadata': jsonEncode({
          if (ratio != null) 'ratio': ratio,
        }),
      }),
    );
-    if (resp.statusCode == 200) {
-      return resp;
+    if (resp.statusCode != 200) {
+      throw Exception(resp.bodyString);
    }

-    throw Exception(resp.bodyString);
+    return resp;
  }

  Future<Response> updateAttachment(
@@ -93,7 +104,7 @@ class AttachmentProvider extends GetConnect {
      throw Exception(resp.bodyString);
    }

-    return resp.body;
+    return resp;
  }

  Future<Response> deleteAttachment(int id) async {
--- a/lib/router.dart
+++ b/lib/router.dart
@@ -42,7 +42,7 @@ abstract class AppRouter {
            BasicShell(state: state, child: child),
        routes: [
          GoRoute(
-            path: '/posts/:alias',
+            path: '/posts/view/:alias',
            name: 'postDetail',
            builder: (context, state) => PostDetailScreen(
              alias: state.pathParameters['alias']!,
--- a/lib/translations.dart
+++ b/lib/translations.dart
@@ -21,6 +21,7 @@ class SolianMessages extends Translations {
          'search': 'Search',
          'reply': 'Reply',
          'repost': 'Repost',
+          'openInBrowser': 'Open in browser',
          'notification': 'Notification',
          'errorHappened': 'An error occurred',
          'email': 'Email',
@@ -134,6 +135,7 @@ class SolianMessages extends Translations {
          'search': '搜索',
          'reply': '回复',
          'repost': '转帖',
+          'openInBrowser': '在浏览器中打开',
          'notification': '通知',
          'errorHappened': '发生错误了',
          'email': '邮件地址',
--- a/lib/widgets/attachments/attachment_item.dart
+++ b/lib/widgets/attachments/attachment_item.dart
@@ -1,9 +1,12 @@
+import 'package:chewie/chewie.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:solian/models/attachment.dart';
 import 'package:solian/services.dart';
+import 'package:url_launcher/url_launcher_string.dart';
+import 'package:video_player/video_player.dart';

-class AttachmentItem extends StatelessWidget {
+class AttachmentItem extends StatefulWidget {
  final String parentId;
  final Attachment item;
  final bool showBadge;
@@ -24,45 +27,127 @@ class AttachmentItem extends StatelessWidget {
  });

  @override
-  Widget build(BuildContext context) {
-    return Hero(
-      tag: Key('a${item.uuid}p$parentId'),
-      child: Stack(
-        fit: StackFit.expand,
-        children: [
-          Image.network(
-            '${ServiceFinder.services['paperclip']}/api/attachments/${item.id}',
-            fit: fit,
-          ),
-          if (showBadge && badge != null)
-            Positioned(
-              right: 12,
-              bottom: 8,
-              child: Material(
-                color: Colors.transparent,
-                child: Chip(label: Text(badge!)),
-              ),
-            ),
-          if (showHideButton && item.isMature)
-            Positioned(
-              top: 8,
-              left: 12,
-              child: Material(
-                color: Colors.transparent,
-                child: ActionChip(
-                  visualDensity:
-                      const VisualDensity(vertical: -4, horizontal: -4),
-                  avatar: Icon(Icons.visibility_off,
-                      color: Theme.of(context).colorScheme.onSurfaceVariant),
-                  label: Text('hide'.tr),
-                  onPressed: () {
-                    if (onHide != null) onHide!();
-                  },
-                ),
-              ),
-            ),
-        ],
+  State<AttachmentItem> createState() => _AttachmentItemState();
+}
+
+class _AttachmentItemState extends State<AttachmentItem> {
+  VideoPlayerController? _videoPlayerController;
+  ChewieController? _chewieController;
+
+  void ensureInitVideo() {
+    if (_videoPlayerController != null) return;
+
+    _videoPlayerController = VideoPlayerController.networkUrl(Uri.parse(
+      '${ServiceFinder.services['paperclip']}/api/attachments/${widget.item.id}',
+    ));
+    _videoPlayerController!.initialize();
+    _chewieController = ChewieController(
+      aspectRatio: widget.item.metadata?['ratio'] ?? 16 / 9,
+      videoPlayerController: _videoPlayerController!,
+      customControls: const MaterialControls(showPlayButton: true),
+      materialProgressColors: ChewieProgressColors(
+        playedColor: Theme.of(context).colorScheme.primary,
+        handleColor: Theme.of(context).colorScheme.primary,
      ),
    );
  }
+
+  @override
+  Widget build(BuildContext context) {
+    switch (widget.item.mimetype.split('/').first) {
+      case 'image':
+        return Hero(
+          tag: Key('a${widget.item.uuid}p${widget.parentId}'),
+          child: Stack(
+            fit: StackFit.expand,
+            children: [
+              Image.network(
+                '${ServiceFinder.services['paperclip']}/api/attachments/${widget.item.id}',
+                fit: widget.fit,
+              ),
+              if (widget.showBadge && widget.badge != null)
+                Positioned(
+                  right: 12,
+                  bottom: 8,
+                  child: Material(
+                    color: Colors.transparent,
+                    child: Chip(label: Text(widget.badge!)),
+                  ),
+                ),
+              if (widget.showHideButton && widget.item.isMature)
+                Positioned(
+                  top: 8,
+                  left: 12,
+                  child: Material(
+                    color: Colors.transparent,
+                    child: ActionChip(
+                      visualDensity:
+                          const VisualDensity(vertical: -4, horizontal: -4),
+                      avatar: Icon(Icons.visibility_off,
+                          color:
+                              Theme.of(context).colorScheme.onSurfaceVariant),
+                      label: Text('hide'.tr),
+                      onPressed: () {
+                        if (widget.onHide != null) widget.onHide!();
+                      },
+                    ),
+                  ),
+                ),
+            ],
+          ),
+        );
+      case 'video':
+        ensureInitVideo();
+        return Chewie(controller: _chewieController!);
+      default:
+        return Center(
+          child: Container(
+            constraints: const BoxConstraints(
+              maxWidth: 280,
+            ),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                const Icon(Icons.file_present, size: 32),
+                const SizedBox(height: 6),
+                Text(
+                  widget.item.mimetype,
+                  style: TextStyle(
+                    fontSize: 12,
+                    color: Theme.of(context).colorScheme.onSurfaceVariant,
+                  ),
+                  textAlign: TextAlign.center,
+                ),
+                const SizedBox(height: 2),
+                Text(
+                  widget.item.alt,
+                  style: const TextStyle(fontSize: 13),
+                  textAlign: TextAlign.center,
+                ),
+                const SizedBox(height: 12),
+                TextButton.icon(
+                  icon: const Icon(Icons.launch),
+                  label: Text('openInBrowser'.tr),
+                  style: const ButtonStyle(
+                    visualDensity: VisualDensity(vertical: -2, horizontal: -4),
+                  ),
+                  onPressed: () {
+                    launchUrlString(
+                      '${ServiceFinder.services['paperclip']}/api/attachments/${widget.item.id}',
+                    );
+                  },
+                ),
+              ],
+            ),
+          ),
+        );
+    }
+  }
+
+  @override
+  void dispose() {
+    _videoPlayerController?.dispose();
+    _chewieController?.dispose();
+    super.dispose();
+  }
 }
--- a/lib/widgets/attachments/attachment_list.dart
+++ b/lib/widgets/attachments/attachment_list.dart
@@ -57,7 +57,11 @@ class _AttachmentListState extends State<AttachmentList> {
    int portrait = 0, square = 0, landscape = 0;
    for (var entry in _attachmentsMeta) {
      if (entry!.metadata?['ratio'] != null) {
-        consistentValue ??= entry.metadata?['ratio'];
+        if (entry.metadata?['ratio'] is int) {
+          consistentValue ??= entry.metadata?['ratio'].toDouble();
+        } else {
+          consistentValue ??= entry.metadata?['ratio'];
+        }
        if (isConsistent && entry.metadata?['ratio'] != consistentValue) {
          isConsistent = false;
        }
@@ -180,7 +184,7 @@ class _AttachmentListState extends State<AttachmentList> {
          onTap: () {
            if (!_showMature && _attachmentsMeta.any((e) => e!.isMature)) {
              setState(() => _showMature = true);
-            } else {
+            } else if (['image'].contains(element.mimetype.split('/').first)) {
              Navigator.of(context, rootNavigator: true).push(
                MaterialPageRoute(
                  builder: (context) => AttachmentListFullScreen(