mirror of
https://github.com/R0m1k3/xtremflow.git
synced 2026-10-20 21:48:06 +02:00
Merge remote-tracking branch 'origin/main' into main
Resolved conflicts by keeping remote functional features (RecordingScheduler, FFmpeg HLS transcoding, mobile player, channel cards) and restoring local Stitch theme foundation (app_colors, app_theme, glass_container, mobile_theme). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
commit
2ba16caf55
68 files changed
+18812
-1794
No files matched your search
@@ -1,62 +1,67 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:cached_network_image/cached_network_image.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../../core/theme/app_colors.dart';
|
||||
import '../../../core/theme/app_theme.dart';
|
||||
import '../providers/favorites_provider.dart';
|
||||
import '../../../core/models/playlist_config.dart';
|
||||
import '../../iptv/providers/xtream_provider.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import '../theme/app_colors.dart';
|
||||
import '../theme/app_theme.dart';
|
||||
|
||||
class ChannelCard extends ConsumerStatefulWidget {
|
||||
final String streamId;
|
||||
final String name;
|
||||
final String? iconUrl;
|
||||
class ChannelCard extends StatefulWidget {
|
||||
final String channelNumber;
|
||||
final String channelName;
|
||||
final String? channelLogo;
|
||||
final String? currentProgram;
|
||||
final bool isLive;
|
||||
final String? programTime;
|
||||
final bool isFavorite;
|
||||
final VoidCallback? onTap;
|
||||
final double? width;
|
||||
final double? height;
|
||||
final PlaylistConfig playlist;
|
||||
final VoidCallback? onFavoriteTap;
|
||||
final bool isActive;
|
||||
|
||||
const ChannelCard({
|
||||
super.key,
|
||||
required this.streamId,
|
||||
required this.name,
|
||||
required this.playlist,
|
||||
this.iconUrl,
|
||||
required this.channelNumber,
|
||||
required this.channelName,
|
||||
this.channelLogo,
|
||||
this.currentProgram,
|
||||
this.isLive = true,
|
||||
this.programTime,
|
||||
this.isFavorite = false,
|
||||
this.onTap,
|
||||
this.width,
|
||||
this.height,
|
||||
this.onFavoriteTap,
|
||||
this.isActive = false,
|
||||
});
|
||||
|
||||
@override
|
||||
ConsumerState<ChannelCard> createState() => _ChannelCardState();
|
||||
State<ChannelCard> createState() => _ChannelCardState();
|
||||
}
|
||||
|
||||
class _ChannelCardState extends ConsumerState<ChannelCard>
|
||||
class _ChannelCardState extends State<ChannelCard>
|
||||
with SingleTickerProviderStateMixin {
|
||||
bool _isHovered = false;
|
||||
late AnimationController _pulseController;
|
||||
|
||||
// EPG State
|
||||
String? _epgNow;
|
||||
bool _epgLoaded = false;
|
||||
|
||||
late Animation<double> _pulseAnimation;
|
||||
bool _isHovered = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_pulseController = AnimationController(
|
||||
vsync: this,
|
||||
duration: const Duration(milliseconds: 1000),
|
||||
vsync: this,
|
||||
duration: AppTheme.durationMd,
|
||||
)..repeat(reverse: true);
|
||||
|
||||
// Fetch EPG immediately when card is built
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
_fetchEpg();
|
||||
});
|
||||
|
||||
_pulseAnimation = Tween<double>(begin: 1.0, end: 1.05).animate(
|
||||
CurvedAnimation(parent: _pulseController, curve: AppTheme.curveSmooth),
|
||||
);
|
||||
|
||||
if (widget.isActive) {
|
||||
_pulseController.forward();
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void didUpdateWidget(ChannelCard oldWidget) {
|
||||
super.didUpdateWidget(oldWidget);
|
||||
if (widget.isActive && !oldWidget.isActive) {
|
||||
_pulseController.forward();
|
||||
} else if (!widget.isActive && oldWidget.isActive) {
|
||||
_pulseController.reverse();
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
@@ -65,218 +70,158 @@ class _ChannelCardState extends ConsumerState<ChannelCard>
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _fetchEpg() async {
|
||||
if (_epgLoaded) return;
|
||||
|
||||
try {
|
||||
// Don't modify state if unmounted
|
||||
if (!mounted) return;
|
||||
|
||||
final service = ref.read(xtreamServiceProvider(widget.playlist));
|
||||
// We use the short EPG endpoint for quick access
|
||||
final entries = await service.getShortEpg(widget.streamId);
|
||||
|
||||
if (mounted && entries.isNotEmpty) {
|
||||
final now = DateTime.now();
|
||||
// Find current program
|
||||
final current = entries.firstWhere(
|
||||
(e) {
|
||||
try {
|
||||
final start = DateTime.parse(e.start);
|
||||
final end = DateTime.parse(e.end);
|
||||
return now.isAfter(start) && now.isBefore(end);
|
||||
} catch (_) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
orElse: () => entries.first,
|
||||
);
|
||||
|
||||
setState(() {
|
||||
_epgNow = current.title;
|
||||
_epgLoaded = true;
|
||||
});
|
||||
}
|
||||
} catch (_) {
|
||||
// Fail silently
|
||||
if (mounted) setState(() => _epgLoaded = true);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final favorites = ref.watch(favoritesProvider);
|
||||
final isFavorite = favorites.contains(widget.streamId);
|
||||
|
||||
// Dynamic sizing based on hover
|
||||
return MouseRegion(
|
||||
onEnter: (_) {
|
||||
setState(() => _isHovered = true);
|
||||
},
|
||||
onExit: (_) => setState(() => _isHovered = false),
|
||||
cursor: SystemMouseCursors.click,
|
||||
onEnter: (_) => setState(() => _isHovered = true),
|
||||
onExit: (_) => setState(() => _isHovered = false),
|
||||
child: GestureDetector(
|
||||
onTap: widget.onTap,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// The Image Card (Scales)
|
||||
AnimatedScale(
|
||||
scale: _isHovered ? 1.05 : 1.0,
|
||||
duration: AppTheme.durationFast,
|
||||
curve: AppTheme.curveDefault,
|
||||
child: AnimatedContainer(
|
||||
duration: AppTheme.durationFast,
|
||||
width: widget.width ?? 180,
|
||||
height: widget.height ?? 110,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusMd),
|
||||
color: AppColors.surface, // Fallback color
|
||||
// Thick white border on focus (tvOS style)
|
||||
border: Border.all(
|
||||
color: _isHovered ? AppColors.primaryContainer : Colors.transparent,
|
||||
width: _isHovered ? 3 : 0,
|
||||
child: ScaleTransition(
|
||||
scale: widget.isActive
|
||||
? _pulseAnimation
|
||||
: const AlwaysStoppedAnimation(1.0),
|
||||
child: AnimatedContainer(
|
||||
duration: AppTheme.durationMd,
|
||||
curve: AppTheme.curveDefault,
|
||||
decoration: BoxDecoration(
|
||||
color: widget.isActive
|
||||
? AppColors.primary.withOpacity(0.15)
|
||||
: AppColors.surface,
|
||||
border: Border.all(
|
||||
color: widget.isActive
|
||||
? AppColors.primary
|
||||
: (_isHovered
|
||||
? AppColors.border
|
||||
: AppColors.border.withOpacity(0.5)),
|
||||
width: widget.isActive ? 2.5 : 1.5,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusMd),
|
||||
boxShadow: [
|
||||
if (_isHovered || widget.isActive)
|
||||
BoxShadow(
|
||||
color: widget.isActive
|
||||
? AppColors.primary.withOpacity(0.25)
|
||||
: AppColors.primary.withOpacity(0.1),
|
||||
blurRadius: 12,
|
||||
offset: const Offset(0, 4),
|
||||
spreadRadius: 1,
|
||||
),
|
||||
// Deep shadow on focus
|
||||
boxShadow: _isHovered
|
||||
? [
|
||||
BoxShadow(
|
||||
color: AppColors.background.withOpacity(0.5),
|
||||
blurRadius: 30,
|
||||
offset: const Offset(0, 15),
|
||||
spreadRadius: 2,
|
||||
),
|
||||
]
|
||||
: [
|
||||
BoxShadow(
|
||||
color: AppColors.background.withOpacity(0.2),
|
||||
blurRadius: 4,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(AppTheme.radiusMd - (_isHovered ? 2 : 0)), // Adjust inner radius
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
],
|
||||
),
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
Padding(
|
||||
padding: EdgeInsets.all(AppTheme.spacingMd),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// 1. Background Image / Logo - EDGE TO EDGE
|
||||
_buildChannelImage(),
|
||||
|
||||
// 2. Gradient Overlay (Subtle)
|
||||
if (_isHovered)
|
||||
Positioned.fill(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [Colors.transparent, AppColors.background.withOpacity(0.4)],
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
widget.channelNumber,
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.textSecondary,
|
||||
letterSpacing: 0.5,
|
||||
),
|
||||
),
|
||||
SizedBox(height: AppTheme.spacingXs),
|
||||
Text(
|
||||
widget.channelName,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: GoogleFonts.outfit(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.textPrimary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
GestureDetector(
|
||||
onTap: widget.onFavoriteTap,
|
||||
child: AnimatedScale(
|
||||
scale: widget.isFavorite ? 1.1 : 1.0,
|
||||
duration: AppTheme.durationXs,
|
||||
child: Icon(
|
||||
widget.isFavorite
|
||||
? Icons.favorite
|
||||
: Icons.favorite_border,
|
||||
color: widget.isFavorite
|
||||
? AppColors.secondary
|
||||
: AppColors.textSecondary,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// 3. Live Badge (Top Right)
|
||||
if (widget.isLive)
|
||||
Positioned(
|
||||
top: 8,
|
||||
right: 8,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.live,
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
],
|
||||
),
|
||||
SizedBox(height: AppTheme.spacingSm),
|
||||
if (widget.currentProgram != null)
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
widget.currentProgram!,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppColors.textSecondary,
|
||||
),
|
||||
),
|
||||
child: const Text('LIVE', style: TextStyle(color: AppColors.onSurface, fontSize: 9, fontWeight: FontWeight.bold)),
|
||||
),
|
||||
),
|
||||
|
||||
// 4. Favorite Icon (Top Left)
|
||||
if (_isHovered || isFavorite)
|
||||
Positioned(
|
||||
top: 5,
|
||||
left: 5,
|
||||
child: GestureDetector(
|
||||
onTap: () => ref.read(favoritesProvider.notifier).toggleFavorite(widget.streamId),
|
||||
child: Icon(
|
||||
isFavorite ? Icons.favorite : Icons.favorite_border,
|
||||
color: isFavorite ? AppColors.live : AppColors.onSurface.withOpacity(0.7),
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
if (widget.programTime != null) ...[
|
||||
SizedBox(height: AppTheme.spacingXs),
|
||||
Text(
|
||||
widget.programTime!,
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w400,
|
||||
color: AppColors.textTertiary,
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// Text separates from card (Classic tvOS look)
|
||||
SizedBox(
|
||||
width: widget.width ?? 180,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
widget.name,
|
||||
textAlign: TextAlign.center,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: _isHovered ? AppColors.primaryContainer : AppColors.onSurfaceVariant,
|
||||
fontWeight: _isHovered ? FontWeight.bold : FontWeight.w500,
|
||||
fontSize: 13,
|
||||
),
|
||||
),
|
||||
if ((widget.currentProgram != null || _epgNow != null)) ...[
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
_epgNow ?? widget.currentProgram ?? '',
|
||||
textAlign: TextAlign.center,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: AppColors.textTertiary,
|
||||
fontSize: 11,
|
||||
if (widget.isActive)
|
||||
Positioned(
|
||||
top: AppTheme.spacingSm,
|
||||
right: AppTheme.spacingSm,
|
||||
child: Container(
|
||||
width: 8,
|
||||
height: 8,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.primary,
|
||||
shape: BoxShape.circle,
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColors.primary.withOpacity(0.6),
|
||||
blurRadius: 8,
|
||||
spreadRadius: 2,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildChannelImage() {
|
||||
if (widget.iconUrl != null && widget.iconUrl!.isNotEmpty) {
|
||||
return Container(
|
||||
color: Colors.white, // Logos usually look best on white/light grey
|
||||
child: CachedNetworkImage(
|
||||
imageUrl: widget.iconUrl!,
|
||||
fit: BoxFit.contain,
|
||||
width: double.infinity,
|
||||
height: double.infinity,
|
||||
placeholder: (context, url) => _buildPlaceholder(),
|
||||
errorWidget: (context, url, error) => _buildPlaceholder(),
|
||||
),
|
||||
);
|
||||
}
|
||||
return _buildPlaceholder();
|
||||
}
|
||||
|
||||
Widget _buildPlaceholder() {
|
||||
return Container(
|
||||
color: AppColors.surface,
|
||||
child: const Center(
|
||||
child: Icon(Icons.tv, color: AppColors.textTertiary),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,543 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:cached_network_image/cached_network_image.dart';
|
||||
import '../providers/recommendations_provider.dart';
|
||||
import '../../../core/models/playlist_config.dart';
|
||||
import '../models/playlist.dart';
|
||||
|
||||
/// Widget showing "Continue Watching" section
|
||||
class ContinueWatchingWidget extends ConsumerStatefulWidget {
|
||||
final Playlist playlist;
|
||||
final List<Playlist> content;
|
||||
final VoidCallback? onItemTap;
|
||||
|
||||
const ContinueWatchingWidget({
|
||||
super.key,
|
||||
required this.playlist,
|
||||
required this.content,
|
||||
this.onItemTap,
|
||||
});
|
||||
|
||||
@override
|
||||
ConsumerState<ContinueWatchingWidget> createState() =>
|
||||
_ContinueWatchingWidgetState();
|
||||
}
|
||||
|
||||
class _ContinueWatchingWidgetState
|
||||
extends ConsumerState<ContinueWatchingWidget> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final watchHistory = ref.watch(watchHistoryProvider);
|
||||
final continueWatching =
|
||||
RecommendationService.getContinueWatching(watchHistory, widget.content);
|
||||
|
||||
if (continueWatching.isEmpty) {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(vertical: 12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
'Continue Watching',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () {
|
||||
// Navigate to full continue watching list
|
||||
},
|
||||
child: const Text('View All'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: [
|
||||
const SizedBox(width: 16),
|
||||
...continueWatching.take(5).map((rec) {
|
||||
final item = rec.item;
|
||||
final percentage =
|
||||
watchHistory[item.streamId.toString()] is Map
|
||||
? (watchHistory[item.streamId.toString()]
|
||||
as Map)['percentage'] as double? ??
|
||||
0.0
|
||||
: 0.0;
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(right: 12),
|
||||
child: _ContinueWatchingCard(
|
||||
item: item,
|
||||
progress: percentage,
|
||||
onTap: widget.onItemTap,
|
||||
),
|
||||
);
|
||||
}),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ContinueWatchingCard extends StatelessWidget {
|
||||
final Playlist item;
|
||||
final double progress;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const _ContinueWatchingCard({
|
||||
required this.item,
|
||||
required this.progress,
|
||||
this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Poster with progress bar
|
||||
Container(
|
||||
width: 160,
|
||||
height: 240,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
// Poster image
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
child: CachedNetworkImage(
|
||||
imageUrl: item.cover ?? '',
|
||||
fit: BoxFit.cover,
|
||||
placeholder: (context, url) => Container(
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
errorWidget: (context, url, error) => Icon(
|
||||
Icons.image_not_supported,
|
||||
color: Colors.grey[600],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Dark overlay at bottom
|
||||
Positioned(
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
Colors.transparent,
|
||||
Colors.black.withOpacity(0.8),
|
||||
],
|
||||
),
|
||||
),
|
||||
padding: const EdgeInsets.all(8),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// Progress bar
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
child: LinearProgressIndicator(
|
||||
value: progress / 100.0,
|
||||
minHeight: 3,
|
||||
backgroundColor: Colors.white30,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(
|
||||
_getProgressColor(progress),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'${progress.toStringAsFixed(0)}% watched',
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 11,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Play button overlay on hover
|
||||
Positioned(
|
||||
top: 0,
|
||||
right: 0,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.blue.withOpacity(0.7),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
padding: const EdgeInsets.all(8),
|
||||
margin: const EdgeInsets.all(8),
|
||||
child: const Icon(
|
||||
Icons.play_arrow,
|
||||
color: Colors.white,
|
||||
size: 24,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// Title
|
||||
SizedBox(
|
||||
width: 160,
|
||||
child: Text(
|
||||
item.name ?? 'Unknown',
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Color _getProgressColor(double progress) {
|
||||
if (progress < 30) return Colors.red;
|
||||
if (progress < 70) return Colors.orange;
|
||||
return Colors.green;
|
||||
}
|
||||
}
|
||||
|
||||
/// Widget showing trending/popular content
|
||||
class TrendingWidget extends ConsumerWidget {
|
||||
final Playlist playlist;
|
||||
final List<Playlist> content;
|
||||
final VoidCallback? onItemTap;
|
||||
|
||||
const TrendingWidget({
|
||||
super.key,
|
||||
required this.playlist,
|
||||
required this.content,
|
||||
this.onItemTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final trending = ref.watch(trendingProvider);
|
||||
final trendingContent =
|
||||
RecommendationService.getTrending(trending, content);
|
||||
|
||||
if (trendingContent.isEmpty) {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(vertical: 12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.local_fire_department,
|
||||
color: Colors.red,
|
||||
size: 24,
|
||||
),
|
||||
SizedBox(width: 8),
|
||||
Text(
|
||||
'Trending Now',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: const Text('View All'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: [
|
||||
const SizedBox(width: 16),
|
||||
...trendingContent.take(5).map((rec) {
|
||||
final item = rec.item;
|
||||
final rank = trendingContent.indexOf(rec) + 1;
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(right: 12),
|
||||
child: _TrendingCard(
|
||||
item: item,
|
||||
rank: rank,
|
||||
onTap: onItemTap,
|
||||
),
|
||||
);
|
||||
}),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _TrendingCard extends StatelessWidget {
|
||||
final Playlist item;
|
||||
final int rank;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const _TrendingCard({
|
||||
required this.item,
|
||||
required this.rank,
|
||||
this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Stack(
|
||||
children: [
|
||||
// Card
|
||||
Container(
|
||||
width: 180,
|
||||
height: 260,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
// Image
|
||||
Expanded(
|
||||
child: ClipRRect(
|
||||
borderRadius: const BorderRadius.only(
|
||||
topLeft: Radius.circular(12),
|
||||
topRight: Radius.circular(12),
|
||||
),
|
||||
child: CachedNetworkImage(
|
||||
imageUrl: item.cover ?? '',
|
||||
fit: BoxFit.cover,
|
||||
placeholder: (context, url) => Container(
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
errorWidget: (context, url, error) => Icon(
|
||||
Icons.image_not_supported,
|
||||
color: Colors.grey[600],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Info
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(8),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
item.name ?? 'Unknown',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
if (item.rating != null)
|
||||
Row(
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.star,
|
||||
color: Colors.amber,
|
||||
size: 12,
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
item.rating ?? '0',
|
||||
style: const TextStyle(fontSize: 11),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Rank badge
|
||||
Positioned(
|
||||
top: 8,
|
||||
left: 8,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: _getRankColor(rank),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
width: 40,
|
||||
height: 40,
|
||||
child: Center(
|
||||
child: Text(
|
||||
'#$rank',
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 14,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Color _getRankColor(int rank) {
|
||||
switch (rank) {
|
||||
case 1:
|
||||
return Colors.amber.shade700;
|
||||
case 2:
|
||||
return Colors.grey.shade600;
|
||||
case 3:
|
||||
return Colors.orange.shade700;
|
||||
default:
|
||||
return Colors.blue.shade700;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Widget showing recently added content
|
||||
class RecentlyAddedWidget extends ConsumerWidget {
|
||||
final Playlist playlist;
|
||||
final List<Playlist> content;
|
||||
final VoidCallback? onItemTap;
|
||||
|
||||
const RecentlyAddedWidget({
|
||||
super.key,
|
||||
required this.playlist,
|
||||
required this.content,
|
||||
this.onItemTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final recent = RecommendationService.getRecentlyAdded(content);
|
||||
|
||||
if (recent.isEmpty) {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(vertical: 12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: Text(
|
||||
'Recently Added',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
),
|
||||
SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: [
|
||||
const SizedBox(width: 16),
|
||||
...recent.take(5).map((rec) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(right: 12),
|
||||
child: _RecentCard(
|
||||
item: rec.item,
|
||||
onTap: onItemTap,
|
||||
),
|
||||
);
|
||||
}),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _RecentCard extends StatelessWidget {
|
||||
final Playlist item;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const _RecentCard({
|
||||
required this.item,
|
||||
this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
width: 140,
|
||||
height: 200,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
child: CachedNetworkImage(
|
||||
imageUrl: item.cover ?? '',
|
||||
fit: BoxFit.cover,
|
||||
placeholder: (context, url) => Container(
|
||||
color: Colors.grey[800],
|
||||
),
|
||||
errorWidget: (context, url, error) =>
|
||||
Icon(Icons.image_not_supported, color: Colors.grey[600]),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -64,10 +64,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
body: channelsAsync.when(
|
||||
loading: () => const ThemedLoading(),
|
||||
error: (e, s) => Center(
|
||||
child: Text(
|
||||
'Error: $e',
|
||||
style: GoogleFonts.inter(color: AppColors.onSurface),
|
||||
),
|
||||
child: Text('Error: $e', style: const TextStyle(color: Colors.white)),
|
||||
),
|
||||
data: (groupedChannels) {
|
||||
var categories = groupedChannels.keys.toList();
|
||||
@@ -76,6 +73,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
.where((cat) => settings.matchesLiveTvFilter(cat))
|
||||
.toList();
|
||||
}
|
||||
// REMOVED: categories.sort(); - Respect API/Settings order
|
||||
|
||||
List<Channel> displayedChannels = [];
|
||||
bool showingCategoryGrid = false;
|
||||
@@ -98,11 +96,12 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
|
||||
return Column(
|
||||
children: [
|
||||
// HEADER (Glass Level 1)
|
||||
// HEADER (Glass)
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(24, 16, 24, 16),
|
||||
child: GlassContainer.glass(
|
||||
child: GlassContainer(
|
||||
borderRadius: 16,
|
||||
opacity: 0.6,
|
||||
padding:
|
||||
const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
|
||||
child: Row(
|
||||
@@ -121,13 +120,12 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surfaceContainerHigh
|
||||
.withOpacity(0.5),
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
child: const Icon(
|
||||
Icons.arrow_back,
|
||||
color: AppColors.onSurface,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -141,10 +139,10 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
: _showFavoritesOnly
|
||||
? 'Favorites'
|
||||
: _selectedCategory ?? 'Live TV',
|
||||
style: GoogleFonts.spaceGrotesk(
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColors.onSurface,
|
||||
color: Colors.white,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
@@ -156,22 +154,17 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
width: 250,
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surfaceContainerLow,
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: AppColors.outlineVariant,
|
||||
width: 1,
|
||||
),
|
||||
),
|
||||
child: TextField(
|
||||
controller: _searchController,
|
||||
style: GoogleFonts.inter(color: AppColors.onSurface),
|
||||
style: GoogleFonts.inter(color: Colors.white),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search channels...',
|
||||
hintStyle:
|
||||
GoogleFonts.inter(color: AppColors.outline),
|
||||
hintStyle: GoogleFonts.inter(color: Colors.white54),
|
||||
prefixIcon:
|
||||
Icon(Icons.search, color: AppColors.outline),
|
||||
const Icon(Icons.search, color: Colors.white54),
|
||||
border: InputBorder.none,
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 16,
|
||||
@@ -179,9 +172,9 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
),
|
||||
suffixIcon: _searchQuery.isNotEmpty
|
||||
? IconButton(
|
||||
icon: Icon(
|
||||
icon: const Icon(
|
||||
Icons.clear,
|
||||
color: AppColors.onSurface,
|
||||
color: Colors.white,
|
||||
),
|
||||
onPressed: _searchController.clear,
|
||||
)
|
||||
@@ -206,8 +199,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
decoration: BoxDecoration(
|
||||
color: _showFavoritesOnly
|
||||
? AppColors.live.withOpacity(0.2)
|
||||
: AppColors.surfaceContainerHigh
|
||||
.withOpacity(0.5),
|
||||
: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: _showFavoritesOnly
|
||||
? Border.all(color: AppColors.live)
|
||||
@@ -219,7 +211,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
: Icons.favorite_border,
|
||||
color: _showFavoritesOnly
|
||||
? AppColors.live
|
||||
: AppColors.onSurfaceVariant,
|
||||
: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -240,19 +232,20 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
Icon(
|
||||
Icons.tv_off,
|
||||
size: 64,
|
||||
color: AppColors.outline,
|
||||
color: Colors.white.withOpacity(0.3),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'No channels found',
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.onSurfaceVariant,
|
||||
color: Colors.white54,
|
||||
fontSize: 18,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
// Use raw grid for now, but wrapped in focusable cards
|
||||
: _buildChannelGrid(displayedChannels),
|
||||
),
|
||||
],
|
||||
@@ -295,20 +288,21 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
});
|
||||
},
|
||||
borderRadius: 16,
|
||||
child: GlassContainer.glass(
|
||||
child: GlassContainer(
|
||||
borderRadius: 16,
|
||||
padding: EdgeInsets.zero,
|
||||
opacity: 0.2, // Darker glass
|
||||
padding: const EdgeInsets.all(0),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Background Gradient
|
||||
// Background Gradient - Apple TV Style
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [
|
||||
AppColors.surfaceContainerLow.withOpacity(0.5),
|
||||
AppColors.primary.withOpacity(0.03),
|
||||
AppColors.primary.withOpacity(0.15),
|
||||
AppColors.primary.withOpacity(0.05),
|
||||
],
|
||||
),
|
||||
),
|
||||
@@ -319,7 +313,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
children: [
|
||||
Icon(
|
||||
Icons.folder_copy_outlined,
|
||||
color: AppColors.onSurfaceVariant,
|
||||
color: Colors.white.withOpacity(0.9),
|
||||
size: 32,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
@@ -331,7 +325,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.onSurface,
|
||||
color: Colors.white,
|
||||
),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
@@ -342,7 +336,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
'$count Channels',
|
||||
style: GoogleFonts.inter(
|
||||
fontSize: 13,
|
||||
color: AppColors.outline,
|
||||
color: Colors.white54,
|
||||
),
|
||||
),
|
||||
],
|
||||
@@ -371,7 +365,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
crossAxisCount: columns,
|
||||
mainAxisSpacing: 16,
|
||||
crossAxisSpacing: 16,
|
||||
childAspectRatio: 1.0,
|
||||
childAspectRatio: 1.0, // Square-ish cards
|
||||
),
|
||||
itemCount: channels.length,
|
||||
itemBuilder: (context, index) {
|
||||
@@ -381,7 +375,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
borderRadius: 12,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surfaceContainerLow,
|
||||
color: AppColors.surfaceVariant,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Stack(
|
||||
@@ -394,10 +388,12 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
Expanded(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surfaceContainer
|
||||
.withOpacity(0.5),
|
||||
color: Colors.white.withOpacity(
|
||||
0.05,
|
||||
), // Subtle transparent background
|
||||
borderRadius: const BorderRadius.vertical(
|
||||
top: Radius.circular(12)),
|
||||
top: Radius.circular(12),
|
||||
),
|
||||
),
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Center(
|
||||
@@ -406,16 +402,16 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
_getProxiedIconUrl(channel.streamIcon)!,
|
||||
errorBuilder: (_, __, ___) => Icon(
|
||||
Icons.tv,
|
||||
color: AppColors.outline,
|
||||
color: Colors.white.withOpacity(0.3),
|
||||
size: 40,
|
||||
),
|
||||
)
|
||||
: Text(
|
||||
channel.name.characters.first.toUpperCase(),
|
||||
style: GoogleFonts.spaceGrotesk(
|
||||
style: GoogleFonts.outfit(
|
||||
fontSize: 40,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColors.outlineVariant,
|
||||
color: Colors.white24,
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -424,19 +420,17 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
// Footer
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 12, vertical: 8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.surfaceContainerHigh.withOpacity(0.9),
|
||||
borderRadius: const BorderRadius.vertical(
|
||||
bottom: Radius.circular(12)),
|
||||
horizontal: 12,
|
||||
vertical: 8,
|
||||
),
|
||||
color: Colors.black54,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
channel.name,
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.onSurface,
|
||||
color: Colors.white,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
@@ -461,7 +455,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
return Text(
|
||||
'No Info',
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.outline,
|
||||
color: Colors.white54,
|
||||
fontSize: 10,
|
||||
),
|
||||
);
|
||||
@@ -474,8 +468,9 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
EpgEntry.parseDateTime(entry.start);
|
||||
final end =
|
||||
EpgEntry.parseDateTime(entry.end);
|
||||
if (start == null || end == null)
|
||||
if (start == null || end == null) {
|
||||
return false;
|
||||
}
|
||||
return now.isAfter(start) &&
|
||||
now.isBefore(end);
|
||||
} catch (e) {
|
||||
@@ -488,7 +483,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
return Text(
|
||||
currentProgram.title,
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.ratingGold,
|
||||
color: const Color(0xFFFFD700),
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
@@ -499,14 +494,14 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
loading: () => Text(
|
||||
'...',
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.outlineVariant,
|
||||
color: Colors.white24,
|
||||
fontSize: 10,
|
||||
),
|
||||
),
|
||||
error: (_, __) => Text(
|
||||
'Err',
|
||||
style: GoogleFonts.inter(
|
||||
color: AppColors.error,
|
||||
color: Colors.red,
|
||||
fontSize: 10,
|
||||
),
|
||||
),
|
||||
@@ -518,7 +513,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
),
|
||||
],
|
||||
),
|
||||
// Record Button Icon Overlay
|
||||
// Record Button Icon Overlay (Positioned top right)
|
||||
Positioned(
|
||||
top: 8,
|
||||
right: 8,
|
||||
@@ -531,12 +526,12 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(6),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.background.withOpacity(0.5),
|
||||
color: Colors.black.withOpacity(0.5),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.fiber_manual_record,
|
||||
color: AppColors.error,
|
||||
color: Colors.redAccent,
|
||||
size: 16,
|
||||
),
|
||||
),
|
||||
|
||||
@@ -0,0 +1,253 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../core/services/adaptive_bitrate_service.dart';
|
||||
|
||||
/// Widget for displaying and selecting video quality during playback
|
||||
class QualitySelectorWidget extends ConsumerStatefulWidget {
|
||||
final QualitySelector qualitySelector;
|
||||
final VoidCallback onClose;
|
||||
|
||||
const QualitySelectorWidget({
|
||||
super.key,
|
||||
required this.qualitySelector,
|
||||
required this.onClose,
|
||||
});
|
||||
|
||||
@override
|
||||
ConsumerState<QualitySelectorWidget> createState() =>
|
||||
_QualitySelectorWidgetState();
|
||||
}
|
||||
|
||||
class _QualitySelectorWidgetState extends ConsumerState<QualitySelectorWidget> {
|
||||
late List<QualityLevel> _availableQualities;
|
||||
late QualityLevel _selectedQuality;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_availableQualities = QualityProfiles.getBalancedProfiles();
|
||||
_selectedQuality = widget.qualitySelector.currentQuality;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final currentQuality = widget.qualitySelector.currentQuality;
|
||||
final bandwidthMbps = widget.qualitySelector.getEstimatedBandwidthMbps();
|
||||
|
||||
return Dialog(
|
||||
backgroundColor: Colors.black87,
|
||||
insetPadding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// Header
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(
|
||||
bottom: BorderSide(color: Colors.white24),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
'Video Quality',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.close, color: Colors.white),
|
||||
onPressed: widget.onClose,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Network Info
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white10,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text(
|
||||
'Current Bandwidth:',
|
||||
style: TextStyle(color: Colors.white70, fontSize: 14),
|
||||
),
|
||||
Text(
|
||||
'${bandwidthMbps.toStringAsFixed(1)} Mbps',
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Quality Options
|
||||
ListView.builder(
|
||||
shrinkWrap: true,
|
||||
itemCount: _availableQualities.length,
|
||||
itemBuilder: (context, index) {
|
||||
final quality = _availableQualities[index];
|
||||
final isSelected = quality == currentQuality;
|
||||
|
||||
return ListTile(
|
||||
contentPadding:
|
||||
const EdgeInsets.symmetric(horizontal: 24, vertical: 8),
|
||||
leading: isSelected
|
||||
? const Icon(Icons.check_circle, color: Colors.blue)
|
||||
: const Icon(
|
||||
Icons.radio_button_unchecked,
|
||||
color: Colors.white30,
|
||||
),
|
||||
title: Text(
|
||||
quality.label,
|
||||
style: TextStyle(
|
||||
color: isSelected ? Colors.blue : Colors.white,
|
||||
fontWeight:
|
||||
isSelected ? FontWeight.bold : FontWeight.normal,
|
||||
),
|
||||
),
|
||||
subtitle: Text(
|
||||
'${quality.bitrateBps ~/ 1000000} Mbps',
|
||||
style: const TextStyle(color: Colors.white70, fontSize: 12),
|
||||
),
|
||||
onTap: () {
|
||||
widget.qualitySelector.setQuality(quality);
|
||||
setState(() {
|
||||
_selectedQuality = quality;
|
||||
});
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
// Auto Quality Option
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
child: Container(
|
||||
decoration: const BoxDecoration(
|
||||
border: Border(
|
||||
top: BorderSide(color: Colors.white24),
|
||||
),
|
||||
),
|
||||
child: ListTile(
|
||||
contentPadding:
|
||||
const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
|
||||
leading: const Icon(Icons.auto_awesome, color: Colors.amber),
|
||||
title: const Text(
|
||||
'Auto Quality',
|
||||
style: TextStyle(
|
||||
color: Colors.amber,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
subtitle: const Text(
|
||||
'Adjusts based on network speed',
|
||||
style: TextStyle(color: Colors.white70, fontSize: 12),
|
||||
),
|
||||
onTap: () {
|
||||
// Auto mode would be handled by the player
|
||||
widget.onClose();
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 8),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Floating quality indicator (minimal UI during playback)
|
||||
class QualityIndicator extends ConsumerWidget {
|
||||
final QualitySelector qualitySelector;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const QualityIndicator({
|
||||
super.key,
|
||||
required this.qualitySelector,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final quality = qualitySelector.currentQuality;
|
||||
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.black54,
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.high_quality, color: Colors.white, size: 16),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
quality.resolution.split('x')[1], // Show just the height
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Bandwidth monitor widget (for debugging/info)
|
||||
class BandwidthMonitor extends ConsumerWidget {
|
||||
final QualitySelector qualitySelector;
|
||||
|
||||
const BandwidthMonitor({
|
||||
super.key,
|
||||
required this.qualitySelector,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.black54,
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.speed, color: Colors.green, size: 14),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
'${qualitySelector.getEstimatedBandwidthMbps().toStringAsFixed(1)} Mbps',
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 11,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,329 @@
|
||||
import 'dart:convert';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:http/http.dart' as http;
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import '../../../core/models/iptv_models.dart';
|
||||
import '../../../core/theme/app_colors.dart';
|
||||
import '../../../core/widgets/glass_container.dart';
|
||||
|
||||
class SimpleRecordingWidget extends StatefulWidget {
|
||||
final Channel channel;
|
||||
final String streamUrl;
|
||||
|
||||
const SimpleRecordingWidget({
|
||||
super.key,
|
||||
required this.channel,
|
||||
required this.streamUrl,
|
||||
});
|
||||
|
||||
@override
|
||||
State<SimpleRecordingWidget> createState() => _SimpleRecordingWidgetState();
|
||||
}
|
||||
|
||||
class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
|
||||
bool _isRecording = false;
|
||||
String _status = '';
|
||||
int _durationMinutes = 60;
|
||||
DateTime _startTime = DateTime.now();
|
||||
|
||||
/// 🟢 Record NOW for X minutes
|
||||
Future<void> _recordNow(int minutes) async {
|
||||
setState(() => _status = 'Starting...');
|
||||
|
||||
try {
|
||||
final response = await http.post(
|
||||
Uri.parse('/api/record/now'),
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: jsonEncode({
|
||||
'channel_id': widget.channel.streamId,
|
||||
'stream_url': widget.streamUrl,
|
||||
'title': widget.channel.name,
|
||||
'duration_minutes': minutes,
|
||||
}),
|
||||
);
|
||||
|
||||
if (response.statusCode == 200) {
|
||||
setState(() {
|
||||
_isRecording = true;
|
||||
_status = '🔴 Recording for $minutes min';
|
||||
});
|
||||
|
||||
if (mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('✅ Recording started!')),
|
||||
);
|
||||
}
|
||||
} else {
|
||||
throw Exception('API error');
|
||||
}
|
||||
} catch (e) {
|
||||
setState(() => _status = '❌ Error: $e');
|
||||
}
|
||||
}
|
||||
|
||||
/// 🔵 Schedule for later
|
||||
Future<void> _scheduleRecording() async {
|
||||
final endTime = _startTime.add(Duration(minutes: _durationMinutes));
|
||||
|
||||
try {
|
||||
final response = await http.post(
|
||||
Uri.parse('/api/record/schedule'),
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
body: jsonEncode({
|
||||
'channel_id': widget.channel.streamId,
|
||||
'stream_url': widget.streamUrl,
|
||||
'title': widget.channel.name,
|
||||
'start_time': _startTime.toIso8601String(),
|
||||
'end_time': endTime.toIso8601String(),
|
||||
}),
|
||||
);
|
||||
|
||||
if (response.statusCode == 200) {
|
||||
setState(() => _status = '⏰ Scheduled for ${_startTime.toLocal()}');
|
||||
|
||||
if (mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('✅ Recording scheduled!')),
|
||||
);
|
||||
Navigator.pop(context);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
setState(() => _status = '❌ Error: $e');
|
||||
}
|
||||
}
|
||||
|
||||
/// 🔴 Stop recording
|
||||
Future<void> _stopRecording() async {
|
||||
try {
|
||||
await http.post(
|
||||
Uri.parse('/api/record/stop/${widget.channel.streamId}'),
|
||||
headers: {'Content-Type': 'application/json'},
|
||||
);
|
||||
|
||||
setState(() {
|
||||
_isRecording = false;
|
||||
_status = 'Stopped';
|
||||
});
|
||||
|
||||
if (mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('✅ Recording stopped!')),
|
||||
);
|
||||
}
|
||||
} catch (e) {
|
||||
setState(() => _status = '❌ Error: $e');
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Dialog(
|
||||
backgroundColor: Colors.transparent,
|
||||
insetPadding: const EdgeInsets.all(20),
|
||||
child: GlassContainer(
|
||||
child: Container(
|
||||
width: 500,
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
// Title
|
||||
Text(
|
||||
'🎬 Record "${widget.channel.name}"',
|
||||
style: GoogleFonts.poppins(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Status
|
||||
if (_status.isNotEmpty)
|
||||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.primary.withOpacity(0.2),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Text(
|
||||
_status,
|
||||
style: GoogleFonts.poppins(
|
||||
fontSize: 14,
|
||||
color: Colors.white70,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// 🟢 Quick record buttons
|
||||
if (!_isRecording) ...[
|
||||
Text(
|
||||
'⚡ Quick Record',
|
||||
style: GoogleFonts.poppins(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: [
|
||||
_QuickButton(
|
||||
label: '30 min',
|
||||
onTap: () => _recordNow(30),
|
||||
),
|
||||
_QuickButton(
|
||||
label: '1 hour',
|
||||
onTap: () => _recordNow(60),
|
||||
),
|
||||
_QuickButton(
|
||||
label: '2 hours',
|
||||
onTap: () => _recordNow(120),
|
||||
),
|
||||
_QuickButton(
|
||||
label: '4 hours',
|
||||
onTap: () => _recordNow(240),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 28),
|
||||
],
|
||||
|
||||
// 🔴 Stop if recording
|
||||
if (_isRecording)
|
||||
ElevatedButton.icon(
|
||||
onPressed: _stopRecording,
|
||||
icon: const Icon(Icons.stop),
|
||||
label: const Text('STOP RECORDING'),
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: Colors.red,
|
||||
foregroundColor: Colors.white,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
),
|
||||
),
|
||||
|
||||
if (!_isRecording) ...[
|
||||
// 🔵 Schedule section
|
||||
ExpansionTile(
|
||||
title: Text(
|
||||
'🔵 Schedule for Later',
|
||||
style: GoogleFonts.poppins(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
children: [
|
||||
// Start time picker
|
||||
ListTile(
|
||||
title: const Text('Start'),
|
||||
trailing: Text(
|
||||
'${_startTime.toLocal().hour}:${_startTime.toLocal().minute.toString().padLeft(2, '0')}',
|
||||
style: const TextStyle(color: Colors.grey),
|
||||
),
|
||||
onTap: () async {
|
||||
final time = await showTimePicker(
|
||||
context: context,
|
||||
initialTime: TimeOfDay.fromDateTime(_startTime),
|
||||
);
|
||||
if (time != null) {
|
||||
setState(() {
|
||||
_startTime = _startTime.copyWith(
|
||||
hour: time.hour,
|
||||
minute: time.minute,
|
||||
);
|
||||
});
|
||||
}
|
||||
},
|
||||
),
|
||||
|
||||
// Duration selector
|
||||
ListTile(
|
||||
title: const Text('Duration'),
|
||||
trailing: DropdownButton<int>(
|
||||
value: _durationMinutes,
|
||||
dropdownColor: Colors.grey[800],
|
||||
items: [30, 60, 120, 240, 480]
|
||||
.map(
|
||||
(m) => DropdownMenuItem(
|
||||
value: m,
|
||||
child: Text('$m min'),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
onChanged: (v) {
|
||||
if (v != null) {
|
||||
setState(() => _durationMinutes = v);
|
||||
}
|
||||
},
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Schedule button
|
||||
ElevatedButton.icon(
|
||||
onPressed: _scheduleRecording,
|
||||
icon: const Icon(Icons.schedule),
|
||||
label: const Text('SCHEDULE'),
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: AppColors.primary,
|
||||
minimumSize: const Size.fromHeight(48),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Close button
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(context),
|
||||
child: const Text('Close'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Quick button component
|
||||
class _QuickButton extends StatelessWidget {
|
||||
final String label;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const _QuickButton({
|
||||
required this.label,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ElevatedButton(
|
||||
onPressed: onTap,
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: AppColors.primary.withOpacity(0.7),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
),
|
||||
child: Text(label),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user