Michael/xtremflow
1
0 Fork 0
mirror of https://github.com/R0m1k3/xtremflow.git synced 2026-10-15 11:18:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement IPTV player screen with mpegts.js for web streams

Browse Source
This commit is contained in:
Michael committed 2025-12-06 10:51:30 +01:00
1 parent fd82745b3c
commit 2bef149b5d
2 files changed
+225 -94
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/features/iptv/screens/player_screen.dart
+65 -94
View File
@@ -1,16 +1,15 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:video_player/video_player.dart';
import 'package:chewie/chewie.dart';
import 'dart:html' as html;
import 'dart:ui_web' as ui_web;
import '../providers/xtream_provider.dart';
import '../widgets/epg_overlay.dart';
import '../../../core/models/iptv_models.dart';
import '../../../core/models/playlist_config.dart';
/// Stream type enum for player
enum StreamType { live, vod, series }
/// Video player screen with EPG overlay for live streams
/// Video player screen using HTML5 player with mpegts.js for TS streams
class PlayerScreen extends ConsumerStatefulWidget {
final String streamId;
final String title;
@@ -24,7 +23,7 @@ class PlayerScreen extends ConsumerStatefulWidget {
required this.title,
required this.playlist,
this.streamType = StreamType.live,
this.containerExtension = 'm3u8',
this.containerExtension = 'mp4',
});
@override
@@ -32,18 +31,19 @@ class PlayerScreen extends ConsumerStatefulWidget {
}
class _PlayerScreenState extends ConsumerState<PlayerScreen> {
late VideoPlayerController _videoPlayerController;
ChewieController? _chewieController;
bool _isLoading = true;
String? _streamUrl;
String? _errorMessage;
late String _viewId;
bool _isInitialized = false;
@override
void initState() {
super.initState();
_viewId = 'iptv-player-${widget.streamId}-${DateTime.now().millisecondsSinceEpoch}';
_initializePlayer();
}
Future<void> _initializePlayer() async {
void _initializePlayer() {
try {
// Validate playlist before proceeding
if (widget.playlist.dns.isEmpty ||
@@ -77,116 +77,87 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
break;
}
// Debug: Print stream URL to console
debugPrint('PlayerScreen: Initializing stream URL: $streamUrl');
_videoPlayerController = VideoPlayerController.networkUrl(
Uri.parse(streamUrl),
);
await _videoPlayerController.initialize();
_chewieController = ChewieController(
videoPlayerController: _videoPlayerController,
autoPlay: true,
looping: false,
aspectRatio: 16 / 9,
allowFullScreen: true,
allowMuting: true,
showControls: true,
placeholder: Container(
color: Colors.black,
child: const Center(
child: CircularProgressIndicator(),
),
),
errorBuilder: (context, errorMessage) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.error_outline,
size: 48,
color: Colors.red,
),
const SizedBox(height: 16),
Text(
'Error: $errorMessage',
style: const TextStyle(color: Colors.white),
textAlign: TextAlign.center,
),
],
),
);
// Register the HTML view with an iframe pointing to our player.html
final encodedUrl = Uri.encodeComponent(streamUrl);
final playerUrl = 'player.html?url=$encodedUrl';
// Register platform view factory
// ignore: undefined_prefixed_name
ui_web.platformViewRegistry.registerViewFactory(
_viewId,
(int viewId) {
final iframe = html.IFrameElement()
..src = playerUrl
..style.border = 'none'
..style.width = '100%'
..style.height = '100%'
..allow = 'autoplay; fullscreen'
..allowFullscreen = true;
return iframe;
},
);
setState(() {
_isLoading = false;
_streamUrl = streamUrl;
_isInitialized = true;
});
} catch (e) {
setState(() {
_isLoading = false;
_errorMessage = e.toString();
});
}
}
@override
void dispose() {
_videoPlayerController.dispose();
_chewieController?.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
backgroundColor: Colors.black,
foregroundColor: Colors.white,
),
backgroundColor: Colors.black,
body: _isLoading
? const Center(
child: CircularProgressIndicator(),
)
: _errorMessage != null
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.error_outline,
size: 64,
color: Colors.red,
),
const SizedBox(height: 16),
Text(
'Failed to load stream',
style: const TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 8),
Text(
_errorMessage!,
style: const TextStyle(color: Colors.white70),
textAlign: TextAlign.center,
),
],
body: _errorMessage != null
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.error_outline,
size: 64,
color: Colors.red,
),
const SizedBox(height: 16),
const Text(
'Failed to load stream',
style: TextStyle(
color: Colors.white,
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 8),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 32),
child: Text(
_errorMessage!,
style: const TextStyle(color: Colors.white70),
textAlign: TextAlign.center,
),
),
],
),
)
: !_isInitialized
? const Center(
child: CircularProgressIndicator(),
)
: Stack(
children: [
Center(
child: _chewieController != null
? Chewie(controller: _chewieController!)
: const SizedBox.shrink(),
),
// HTML5 video player via iframe
HtmlElementView(viewType: _viewId),
// EPG overlay for live streams
if (widget.streamType == StreamType.live)
Positioned(