Fix download button centering and width, fix audio/video loading by using blob URLs for web
This commit is contained in:
@@ -4,6 +4,7 @@ import 'package:go_router/go_router.dart';
|
||||
import 'package:web/web.dart' as web;
|
||||
import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart';
|
||||
import 'package:video_player/video_player.dart';
|
||||
import 'package:flutter/foundation.dart' show kIsWeb;
|
||||
import '../theme/app_theme.dart';
|
||||
import '../services/api_client.dart';
|
||||
import '../injection.dart';
|
||||
@@ -97,7 +98,24 @@ class _PublicFileViewerState extends State<PublicFileViewer> {
|
||||
Future<void> _initializeVideoPlayer() async {
|
||||
final url = _fileData?['viewUrl'] ?? _fileData?['downloadUrl'];
|
||||
if (url != null) {
|
||||
_videoController = VideoPlayerController.networkUrl(Uri.parse(url));
|
||||
String videoUrl = url;
|
||||
if (kIsWeb) {
|
||||
// For web, fetch bytes and create blob URL to avoid CORS issues
|
||||
try {
|
||||
final apiClient = getIt<ApiClient>();
|
||||
final uri = Uri.parse(url);
|
||||
final path = uri.path + (uri.query.isNotEmpty ? '?${uri.query}' : '');
|
||||
final bytes = await apiClient.getBytes(path);
|
||||
final mimeType =
|
||||
_fileData?['capabilities']?['mimeType'] ?? 'video/mp4';
|
||||
final blob = web.Blob([bytes], mimeType);
|
||||
videoUrl = web.URL.createObjectURL(blob);
|
||||
} catch (e) {
|
||||
// Fallback to direct URL
|
||||
videoUrl = url;
|
||||
}
|
||||
}
|
||||
_videoController = VideoPlayerController.networkUrl(Uri.parse(videoUrl));
|
||||
await _videoController!.initialize();
|
||||
setState(() {});
|
||||
}
|
||||
@@ -192,6 +210,7 @@ class _PublicFileViewerState extends State<PublicFileViewer> {
|
||||
child: AudioPlayerBar(
|
||||
fileName: _fileData!['fileName'] ?? 'Audio',
|
||||
fileUrl: viewUrl,
|
||||
mimeType: _fileData?['capabilities']?['mimeType'],
|
||||
),
|
||||
);
|
||||
} else if (_isDocumentFile()) {
|
||||
@@ -266,10 +285,13 @@ class _PublicFileViewerState extends State<PublicFileViewer> {
|
||||
elevation: 0,
|
||||
leading: _fileData != null
|
||||
? Padding(
|
||||
padding: const EdgeInsets.only(left: 16, top: 4),
|
||||
child: ModernGlassButton(
|
||||
onPressed: _downloadFile,
|
||||
child: const Icon(Icons.download, size: 18),
|
||||
padding: const EdgeInsets.only(left: 16),
|
||||
child: SizedBox(
|
||||
width: 56,
|
||||
child: ModernGlassButton(
|
||||
onPressed: _downloadFile,
|
||||
child: const Icon(Icons.download, size: 18),
|
||||
),
|
||||
),
|
||||
)
|
||||
: null,
|
||||
|
||||
@@ -12,12 +12,14 @@ import 'package:just_audio/just_audio.dart'
|
||||
class AudioPlayerBar extends StatefulWidget {
|
||||
final String fileName;
|
||||
final String fileUrl;
|
||||
final String? mimeType;
|
||||
final VoidCallback? onClose;
|
||||
|
||||
const AudioPlayerBar({
|
||||
super.key,
|
||||
required this.fileName,
|
||||
required this.fileUrl,
|
||||
this.mimeType,
|
||||
this.onClose,
|
||||
});
|
||||
|
||||
@@ -63,10 +65,12 @@ class _AudioPlayerBarState extends State<AudioPlayerBar>
|
||||
String? _errorMsg;
|
||||
Future<void> _initAudio() async {
|
||||
try {
|
||||
await _audioPlayer.setUrl(widget.fileUrl);
|
||||
|
||||
if (kIsWeb) {
|
||||
// Web implementation
|
||||
await (_audioPlayer as dynamic).setUrl(
|
||||
widget.fileUrl,
|
||||
mimeType: widget.mimeType,
|
||||
);
|
||||
_durationSubscription = _audioPlayer.durationStream.listen((d) {
|
||||
if (d != null) {
|
||||
setState(() {
|
||||
@@ -104,6 +108,9 @@ class _AudioPlayerBarState extends State<AudioPlayerBar>
|
||||
await _audioPlayer.play();
|
||||
} else {
|
||||
// Mobile implementation (just_audio)
|
||||
await _audioPlayer.setAudioSource(
|
||||
AudioSource.uri(Uri.parse(widget.fileUrl)),
|
||||
);
|
||||
_audioPlayer.durationStream.firstWhere((d) => d != null).then((
|
||||
d,
|
||||
) async {
|
||||
|
||||
@@ -1,8 +1,11 @@
|
||||
import 'package:web/web.dart' as web;
|
||||
import 'dart:async';
|
||||
import '../services/api_client.dart';
|
||||
import '../injection.dart';
|
||||
|
||||
class AudioPlayer {
|
||||
web.HTMLAudioElement? _audioElement;
|
||||
String? _blobUrl;
|
||||
final StreamController<Duration> _positionController =
|
||||
StreamController<Duration>.broadcast();
|
||||
final StreamController<Duration> _durationController =
|
||||
@@ -41,13 +44,19 @@ class AudioPlayer {
|
||||
_errorSubscription = null;
|
||||
}
|
||||
|
||||
Future<void> setUrl(String url) async {
|
||||
Future<void> setUrl(String url, {String? mimeType}) async {
|
||||
// Clean up any existing subscriptions
|
||||
_disposeSubscriptions();
|
||||
|
||||
try {
|
||||
final apiClient = getIt<ApiClient>();
|
||||
final path = url.replaceFirst(apiClient.baseUrl, '');
|
||||
final bytes = await apiClient.getBytes(path);
|
||||
final blob = web.Blob([bytes], mimeType ?? 'audio/mpeg');
|
||||
final blobUrl = web.URL.createObjectURL(blob);
|
||||
|
||||
_audioElement = web.HTMLAudioElement();
|
||||
_audioElement!.src = url;
|
||||
_audioElement!.src = blobUrl;
|
||||
_audioElement!.crossOrigin = 'anonymous'; // Handle CORS
|
||||
|
||||
// Set up event listeners and store subscriptions
|
||||
@@ -115,6 +124,11 @@ class AudioPlayer {
|
||||
void dispose() {
|
||||
_disposeSubscriptions();
|
||||
_audioElement?.pause();
|
||||
if (_blobUrl != null) {
|
||||
web.URL.revokeObjectURL(_blobUrl!);
|
||||
_blobUrl = null;
|
||||
}
|
||||
}
|
||||
_audioElement = null;
|
||||
_positionController.close();
|
||||
_durationController.close();
|
||||
|
||||
Reference in New Issue
Block a user