901 lines
29 KiB
Dart
901 lines
29 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:intl/intl.dart';
|
|
import '../services/iptv_provider.dart';
|
|
import '../models/xtream_models.dart';
|
|
import 'player_screen.dart';
|
|
|
|
class HomeScreen extends StatefulWidget {
|
|
const HomeScreen({super.key});
|
|
|
|
@override
|
|
State<HomeScreen> createState() => _HomeScreenState();
|
|
}
|
|
|
|
class _HomeScreenState extends State<HomeScreen> {
|
|
int _focusedIndex = 0;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
|
_loadInitialData();
|
|
});
|
|
}
|
|
|
|
double get _screenWidth => MediaQuery.of(context).size.width;
|
|
bool get _isLargeScreen => _screenWidth > 900;
|
|
bool get _isMediumScreen => _screenWidth > 600 && _screenWidth <= 900;
|
|
|
|
int get _gridCrossAxisCount {
|
|
if (_screenWidth > 900) return 6;
|
|
if (_screenWidth > 600) return 4;
|
|
return 3;
|
|
}
|
|
|
|
double get _titleFontSize => _isLargeScreen ? 32 : (_isMediumScreen ? 28 : 24);
|
|
double get _iconSize => _isLargeScreen ? 80 : 60;
|
|
double get _headerPadding => _isLargeScreen ? 32 : 24;
|
|
|
|
Future<void> _loadInitialData() async {
|
|
final provider = context.read<IPTVProvider>();
|
|
await provider.loadLiveStreams();
|
|
await provider.loadVodStreams();
|
|
await provider.loadSeries();
|
|
}
|
|
|
|
void _showLiveCategories() {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(builder: (_) => const ContentListScreen(type: ContentType.live)),
|
|
);
|
|
}
|
|
|
|
void _showMovies() {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(builder: (_) => const ContentListScreen(type: ContentType.movies)),
|
|
);
|
|
}
|
|
|
|
void _showSeries() {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(builder: (_) => const ContentListScreen(type: ContentType.series)),
|
|
);
|
|
}
|
|
|
|
String _formatExpiry(int? timestamp) {
|
|
if (timestamp == null) return 'Ilimitado';
|
|
try {
|
|
final date = DateTime.fromMillisecondsSinceEpoch(timestamp * 1000);
|
|
return DateFormat('dd MMM yyyy').format(date);
|
|
} catch (_) {
|
|
return 'Ilimitado';
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final now = DateTime.now();
|
|
final dateStr = DateFormat('EEEE, dd MMMM').format(now);
|
|
final timeStr = DateFormat('HH:mm').format(now);
|
|
|
|
return Scaffold(
|
|
body: Container(
|
|
decoration: const BoxDecoration(
|
|
gradient: RadialGradient(
|
|
center: Alignment.center,
|
|
radius: 1.5,
|
|
colors: [
|
|
Color(0xFF1a1a2e),
|
|
Color(0xFF0f0f1a),
|
|
],
|
|
),
|
|
),
|
|
child: SafeArea(
|
|
child: Column(
|
|
children: [
|
|
_buildHeader(timeStr, dateStr),
|
|
Expanded(child: _buildDashboard()),
|
|
_buildFooter(),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildHeader(String timeStr, String dateStr) {
|
|
final double titleSize = _isLargeScreen ? 28.0 : 24.0;
|
|
final double iconSize = _isLargeScreen ? 40.0 : 32.0;
|
|
return Padding(
|
|
padding: EdgeInsets.symmetric(horizontal: _headerPadding, vertical: _isLargeScreen ? 24 : 16),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Icon(Icons.live_tv, color: Colors.red, size: iconSize),
|
|
const SizedBox(width: 12),
|
|
Text(
|
|
'XSTREAM TV',
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: titleSize,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
Row(
|
|
children: [
|
|
Text(timeStr, style: TextStyle(color: Colors.white70, fontSize: _isLargeScreen ? 20 : 16)),
|
|
const SizedBox(width: 16),
|
|
Text(dateStr, style: TextStyle(color: Colors.white54, fontSize: _isLargeScreen ? 16 : 14)),
|
|
const SizedBox(width: 24),
|
|
Icon(Icons.person, color: Colors.white70, size: _isLargeScreen ? 32 : 24),
|
|
const SizedBox(width: 16),
|
|
IconButton(
|
|
icon: Icon(Icons.settings, color: Colors.white70, size: _isLargeScreen ? 32 : 24),
|
|
onPressed: () {
|
|
context.read<IPTVProvider>().logout();
|
|
},
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildDashboard() {
|
|
final double cardSpacing = _isLargeScreen ? 24.0 : 16.0;
|
|
return Padding(
|
|
padding: EdgeInsets.symmetric(horizontal: _headerPadding),
|
|
child: Row(
|
|
children: [
|
|
Expanded(
|
|
flex: 2,
|
|
child: Focus(
|
|
autofocus: _focusedIndex == 0,
|
|
child: _DashboardCard(
|
|
title: 'LIVE TV',
|
|
icon: Icons.tv,
|
|
isLarge: _isLargeScreen,
|
|
gradient: const LinearGradient(
|
|
colors: [Color(0xFF00c853), Color(0xFF2979ff)],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
onTap: _showLiveCategories,
|
|
),
|
|
),
|
|
),
|
|
SizedBox(width: cardSpacing),
|
|
Expanded(
|
|
child: Column(
|
|
children: [
|
|
Expanded(
|
|
child: Focus(
|
|
autofocus: _focusedIndex == 1,
|
|
child: _DashboardCard(
|
|
title: 'MOVIES',
|
|
icon: Icons.play_circle_fill,
|
|
isLarge: _isLargeScreen,
|
|
gradient: const LinearGradient(
|
|
colors: [Color(0xFFff5252), Color(0xFFff9800)],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
onTap: _showMovies,
|
|
),
|
|
),
|
|
),
|
|
SizedBox(height: cardSpacing),
|
|
Expanded(
|
|
child: Focus(
|
|
autofocus: _focusedIndex == 2,
|
|
child: _DashboardCard(
|
|
title: 'SERIES',
|
|
icon: Icons.movie,
|
|
isLarge: _isLargeScreen,
|
|
gradient: const LinearGradient(
|
|
colors: [Color(0xFF9c27b0), Color(0xFF03a9f4)],
|
|
begin: Alignment.topLeft,
|
|
end: Alignment.bottomRight,
|
|
),
|
|
onTap: _showSeries,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildFooter() {
|
|
final double footerPadding = _isLargeScreen ? 32.0 : 24.0;
|
|
final double fontSize = _isLargeScreen ? 16.0 : 12.0;
|
|
return Consumer<IPTVProvider>(
|
|
builder: (context, provider, _) {
|
|
final expDate = provider.userInfo?.expDate;
|
|
final username = provider.userInfo?.username ?? 'Usuario';
|
|
|
|
return Padding(
|
|
padding: EdgeInsets.all(footerPadding),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Expiración: ${_formatExpiry(expDate)}',
|
|
style: TextStyle(color: Colors.white38, fontSize: fontSize),
|
|
),
|
|
Text(
|
|
'Términos de Servicio',
|
|
style: TextStyle(color: Colors.white38, fontSize: fontSize),
|
|
),
|
|
Text(
|
|
'Usuario: $username',
|
|
style: TextStyle(color: Colors.white38, fontSize: fontSize),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|
|
|
|
class _DashboardCard extends StatelessWidget {
|
|
final String title;
|
|
final IconData icon;
|
|
final Gradient gradient;
|
|
final VoidCallback onTap;
|
|
final bool isLarge;
|
|
|
|
const _DashboardCard({
|
|
required this.title,
|
|
required this.icon,
|
|
required this.gradient,
|
|
required this.onTap,
|
|
this.isLarge = false,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final iconSize = isLarge ? 80.0 : 60.0;
|
|
final titleSize = isLarge ? 32.0 : 24.0;
|
|
final bgIconSize = isLarge ? 200.0 : 150.0;
|
|
return Focus(
|
|
child: Builder(
|
|
builder: (context) {
|
|
final hasFocus = Focus.of(context).hasFocus;
|
|
return GestureDetector(
|
|
onTap: onTap,
|
|
child: AnimatedContainer(
|
|
duration: const Duration(milliseconds: 200),
|
|
decoration: BoxDecoration(
|
|
gradient: gradient,
|
|
borderRadius: BorderRadius.circular(20),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Colors.black.withValues(alpha: hasFocus ? 0.5 : 0.3),
|
|
blurRadius: hasFocus ? 25 : 15,
|
|
offset: const Offset(0, 8),
|
|
),
|
|
],
|
|
border: hasFocus
|
|
? Border.all(color: Colors.white.withValues(alpha: 0.5), width: 3)
|
|
: null,
|
|
),
|
|
child: Stack(
|
|
children: [
|
|
Positioned(
|
|
right: -40,
|
|
bottom: -40,
|
|
child: Icon(
|
|
icon,
|
|
size: bgIconSize,
|
|
color: Colors.white.withValues(alpha: 0.1),
|
|
),
|
|
),
|
|
Center(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(icon, size: iconSize, color: Colors.white),
|
|
const SizedBox(height: 16),
|
|
Text(
|
|
title,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: titleSize,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: 2,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
enum ContentType { live, movies, series }
|
|
|
|
class ContentListScreen extends StatefulWidget {
|
|
final ContentType type;
|
|
|
|
const ContentListScreen({super.key, required this.type});
|
|
|
|
@override
|
|
State<ContentListScreen> createState() => _ContentListScreenState();
|
|
}
|
|
|
|
class _ContentListScreenState extends State<ContentListScreen> {
|
|
final TextEditingController _searchController = TextEditingController();
|
|
String _searchQuery = '';
|
|
String? _selectedCountry;
|
|
final FocusNode _gridFocusNode = FocusNode();
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_loadContent();
|
|
}
|
|
|
|
double get _screenWidth => MediaQuery.of(context).size.width;
|
|
bool get _isLargeScreen => _screenWidth > 900;
|
|
bool get _isMediumScreen => _screenWidth > 600 && _screenWidth <= 900;
|
|
|
|
int get _gridCrossAxisCount {
|
|
if (_screenWidth > 900) return 6;
|
|
if (_screenWidth > 600) return 4;
|
|
return 3;
|
|
}
|
|
|
|
double get _titleFontSize => _isLargeScreen ? 32 : (_isMediumScreen ? 28 : 24);
|
|
double get _cardTextSize => _isLargeScreen ? 16 : 12;
|
|
double get _headerPadding => _isLargeScreen ? 32 : 16;
|
|
|
|
void _loadContent() {
|
|
final provider = context.read<IPTVProvider>();
|
|
if (widget.type == ContentType.live) {
|
|
provider.loadLiveStreams(_selectedCountry ?? '');
|
|
} else if (widget.type == ContentType.movies) {
|
|
provider.loadVodStreams();
|
|
} else {
|
|
provider.loadSeries();
|
|
}
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_searchController.dispose();
|
|
_gridFocusNode.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
String get _title {
|
|
switch (widget.type) {
|
|
case ContentType.live:
|
|
return 'TV en Vivo';
|
|
case ContentType.movies:
|
|
return 'Películas';
|
|
case ContentType.series:
|
|
return 'Series';
|
|
}
|
|
}
|
|
|
|
List<XtreamCategory> get _categories {
|
|
final provider = context.read<IPTVProvider>();
|
|
switch (widget.type) {
|
|
case ContentType.live:
|
|
return provider.liveCategories;
|
|
case ContentType.movies:
|
|
return provider.vodCategories;
|
|
case ContentType.series:
|
|
return provider.seriesCategories;
|
|
}
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
backgroundColor: const Color(0xFF0f0f1a),
|
|
body: SafeArea(
|
|
child: Column(
|
|
children: [
|
|
_buildHeader(),
|
|
_buildCountryFilter(),
|
|
Expanded(child: _buildContentList()),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildHeader() {
|
|
final searchWidth = _isLargeScreen ? 350.0 : (_isMediumScreen ? 300.0 : 250.0);
|
|
final searchHeight = _isLargeScreen ? 56.0 : 44.0;
|
|
final iconSize = _isLargeScreen ? 32.0 : 24.0;
|
|
return Container(
|
|
padding: EdgeInsets.all(_headerPadding),
|
|
child: Row(
|
|
children: [
|
|
IconButton(
|
|
icon: Icon(Icons.arrow_back, color: Colors.white, size: iconSize),
|
|
onPressed: () => Navigator.pop(context),
|
|
iconSize: 48,
|
|
padding: EdgeInsets.all(_isLargeScreen ? 12 : 8),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Text(
|
|
_title,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: _titleFontSize,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
const Spacer(),
|
|
SizedBox(
|
|
width: searchWidth,
|
|
height: searchHeight,
|
|
child: TextField(
|
|
controller: _searchController,
|
|
style: TextStyle(color: Colors.white, fontSize: _isLargeScreen ? 18 : 14),
|
|
decoration: InputDecoration(
|
|
hintText: 'Buscar...',
|
|
hintStyle: TextStyle(color: Colors.grey, fontSize: _isLargeScreen ? 18 : 14),
|
|
prefixIcon: Icon(Icons.search, color: Colors.grey, size: _isLargeScreen ? 28 : 20),
|
|
suffixIcon: _searchQuery.isNotEmpty
|
|
? IconButton(
|
|
icon: Icon(Icons.clear, color: Colors.grey, size: _isLargeScreen ? 28 : 20),
|
|
onPressed: () {
|
|
_searchController.clear();
|
|
setState(() => _searchQuery = '');
|
|
},
|
|
)
|
|
: null,
|
|
filled: true,
|
|
fillColor: Colors.grey[900],
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(8),
|
|
borderSide: BorderSide.none,
|
|
),
|
|
contentPadding: EdgeInsets.symmetric(horizontal: 16, vertical: _isLargeScreen ? 16 : 12),
|
|
),
|
|
onChanged: (value) {
|
|
setState(() => _searchQuery = value);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
String _getCountryName(String categoryName) {
|
|
if (categoryName.contains('|')) {
|
|
return categoryName.split('|').first.trim();
|
|
}
|
|
return categoryName.trim();
|
|
}
|
|
|
|
Widget _buildCountryFilter() {
|
|
if (widget.type != ContentType.live) {
|
|
return const SizedBox.shrink();
|
|
}
|
|
|
|
final categories = _categories;
|
|
if (categories.isEmpty) {
|
|
return const SizedBox.shrink();
|
|
}
|
|
|
|
final countries = categories.map((c) => _getCountryName(c.name)).toList();
|
|
final chipHeight = _isLargeScreen ? 56.0 : 50.0;
|
|
final chipFontSize = _isLargeScreen ? 16.0 : 14.0;
|
|
|
|
return Container(
|
|
height: chipHeight,
|
|
margin: EdgeInsets.only(bottom: _isLargeScreen ? 16 : 8),
|
|
child: ListView.builder(
|
|
scrollDirection: Axis.horizontal,
|
|
padding: EdgeInsets.symmetric(horizontal: _headerPadding),
|
|
itemCount: countries.length + 1,
|
|
itemBuilder: (context, index) {
|
|
if (index == 0) {
|
|
return Padding(
|
|
padding: EdgeInsets.only(right: _isLargeScreen ? 12 : 8),
|
|
child: FilterChip(
|
|
label: Text('Todos', style: TextStyle(color: Colors.white, fontSize: chipFontSize)),
|
|
selected: _selectedCountry == null,
|
|
selectedColor: Colors.red,
|
|
backgroundColor: Colors.grey[800],
|
|
padding: EdgeInsets.symmetric(horizontal: _isLargeScreen ? 12 : 8),
|
|
onSelected: (_) {
|
|
setState(() => _selectedCountry = null);
|
|
context.read<IPTVProvider>().loadLiveStreams('');
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
final countryName = countries[index - 1];
|
|
final category = categories[index - 1];
|
|
return Padding(
|
|
padding: EdgeInsets.only(right: _isLargeScreen ? 12 : 8),
|
|
child: FilterChip(
|
|
label: Text(
|
|
countryName.length > 20 ? '${countryName.substring(0, 20)}...' : countryName,
|
|
style: TextStyle(color: Colors.white, fontSize: chipFontSize),
|
|
),
|
|
selected: _selectedCountry == category.id,
|
|
selectedColor: Colors.red,
|
|
backgroundColor: Colors.grey[800],
|
|
padding: EdgeInsets.symmetric(horizontal: _isLargeScreen ? 12 : 8),
|
|
onSelected: (_) {
|
|
setState(() => _selectedCountry = category.id);
|
|
context.read<IPTVProvider>().loadLiveStreams(category.id);
|
|
},
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildContentList() {
|
|
final padding = _isLargeScreen ? 24.0 : 16.0;
|
|
final spacing = _isLargeScreen ? 16.0 : 12.0;
|
|
return Consumer<IPTVProvider>(
|
|
builder: (context, provider, _) {
|
|
if (provider.isLoading) {
|
|
return Center(child: CircularProgressIndicator(color: Colors.red, strokeWidth: _isLargeScreen ? 4 : 2));
|
|
}
|
|
|
|
List<XtreamStream> streams = [];
|
|
if (widget.type == ContentType.live) {
|
|
streams = provider.liveStreams;
|
|
} else if (widget.type == ContentType.movies) {
|
|
streams = provider.vodStreams;
|
|
} else {
|
|
streams = provider.seriesList.map((s) => XtreamStream(
|
|
streamId: s.seriesId,
|
|
name: s.name,
|
|
streamIcon: s.cover,
|
|
plot: s.plot,
|
|
rating: s.rating,
|
|
)).toList();
|
|
}
|
|
|
|
if (_searchQuery.isNotEmpty) {
|
|
streams = streams
|
|
.where((s) => s.name.toLowerCase().contains(_searchQuery.toLowerCase()))
|
|
.toList();
|
|
}
|
|
|
|
if (streams.isEmpty) {
|
|
return Center(
|
|
child: Text(
|
|
_searchQuery.isNotEmpty ? 'No se encontraron resultados' : 'Sin contenido',
|
|
style: TextStyle(color: Colors.grey, fontSize: _isLargeScreen ? 20 : 16),
|
|
),
|
|
);
|
|
}
|
|
|
|
return GridView.builder(
|
|
padding: EdgeInsets.all(padding),
|
|
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: _gridCrossAxisCount,
|
|
childAspectRatio: 16 / 9,
|
|
crossAxisSpacing: spacing,
|
|
mainAxisSpacing: spacing,
|
|
),
|
|
itemCount: streams.length,
|
|
itemBuilder: (context, index) {
|
|
final stream = streams[index];
|
|
return _ChannelCard(
|
|
stream: stream,
|
|
isSeries: widget.type == ContentType.series,
|
|
isLarge: _isLargeScreen,
|
|
onTap: () {
|
|
if (widget.type == ContentType.series) {
|
|
final series = provider.seriesList.firstWhere(
|
|
(s) => s.seriesId == stream.streamId,
|
|
);
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => SeriesEpisodesScreen(series: series),
|
|
),
|
|
);
|
|
} else {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => PlayerScreen(
|
|
stream: stream,
|
|
isLive: widget.type == ContentType.live,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
},
|
|
);
|
|
},
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|
|
|
|
class _ChannelCard extends StatelessWidget {
|
|
final XtreamStream stream;
|
|
final bool isSeries;
|
|
final VoidCallback onTap;
|
|
final bool isLarge;
|
|
|
|
const _ChannelCard({
|
|
required this.stream,
|
|
required this.isSeries,
|
|
required this.onTap,
|
|
this.isLarge = false,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final textSize = isLarge ? 16.0 : 12.0;
|
|
final ratingFontSize = isLarge ? 14.0 : 10.0;
|
|
final placeholderIconSize = isLarge ? 56.0 : 40.0;
|
|
final padding = isLarge ? 12.0 : 8.0;
|
|
final ratingPaddingH = isLarge ? 10.0 : 6.0;
|
|
final ratingPaddingV = isLarge ? 4.0 : 2.0;
|
|
return Focus(
|
|
child: Builder(
|
|
builder: (context) {
|
|
final hasFocus = Focus.of(context).hasFocus;
|
|
return GestureDetector(
|
|
onTap: onTap,
|
|
child: AnimatedContainer(
|
|
duration: const Duration(milliseconds: 200),
|
|
decoration: BoxDecoration(
|
|
color: Colors.grey[900],
|
|
borderRadius: BorderRadius.circular(16),
|
|
border: Border.all(
|
|
color: hasFocus ? Colors.red : Colors.red.withValues(alpha: 0.3),
|
|
width: hasFocus ? 3 : 1,
|
|
),
|
|
boxShadow: hasFocus
|
|
? [
|
|
BoxShadow(
|
|
color: Colors.red.withValues(alpha: 0.3),
|
|
blurRadius: 15,
|
|
spreadRadius: 2,
|
|
),
|
|
]
|
|
: null,
|
|
),
|
|
child: Stack(
|
|
children: [
|
|
if (stream.streamIcon != null && stream.streamIcon!.isNotEmpty)
|
|
ClipRRect(
|
|
borderRadius: BorderRadius.circular(16),
|
|
child: Image.network(
|
|
stream.streamIcon!,
|
|
width: double.infinity,
|
|
height: double.infinity,
|
|
fit: BoxFit.cover,
|
|
errorBuilder: (_, __, ___) => _buildPlaceholder(placeholderIconSize),
|
|
),
|
|
)
|
|
else
|
|
_buildPlaceholder(placeholderIconSize),
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(16),
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.bottomCenter,
|
|
colors: [
|
|
Colors.transparent,
|
|
Colors.black.withValues(alpha: 0.8),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
Positioned(
|
|
bottom: padding,
|
|
left: padding,
|
|
right: padding,
|
|
child: Text(
|
|
stream.name,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: textSize,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
maxLines: 2,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
),
|
|
if (stream.rating != null)
|
|
Positioned(
|
|
top: padding,
|
|
right: padding,
|
|
child: Container(
|
|
padding: EdgeInsets.symmetric(horizontal: ratingPaddingH, vertical: ratingPaddingV),
|
|
decoration: BoxDecoration(
|
|
color: Colors.amber,
|
|
borderRadius: BorderRadius.circular(6),
|
|
),
|
|
child: Text(
|
|
stream.rating!,
|
|
style: TextStyle(
|
|
color: Colors.black,
|
|
fontSize: ratingFontSize,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildPlaceholder(double iconSize) {
|
|
return Container(
|
|
color: Colors.grey[800],
|
|
child: Center(
|
|
child: Icon(
|
|
isSeries ? Icons.tv : Icons.play_circle_outline,
|
|
color: Colors.red,
|
|
size: iconSize,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class SeriesEpisodesScreen extends StatefulWidget {
|
|
final XtreamSeries series;
|
|
|
|
const SeriesEpisodesScreen({super.key, required this.series});
|
|
|
|
@override
|
|
State<SeriesEpisodesScreen> createState() => _SeriesEpisodesScreenState();
|
|
}
|
|
|
|
class _SeriesEpisodesScreenState extends State<SeriesEpisodesScreen> {
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
|
context.read<IPTVProvider>().loadSeriesEpisodes(widget.series);
|
|
});
|
|
}
|
|
|
|
double get _screenWidth => MediaQuery.of(context).size.width;
|
|
bool get _isLargeScreen => _screenWidth > 900;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final double fontSize = _isLargeScreen ? 24.0 : 20.0;
|
|
final double iconSize = _isLargeScreen ? 56.0 : 40.0;
|
|
final double padding = _isLargeScreen ? 24.0 : 16.0;
|
|
return Scaffold(
|
|
backgroundColor: const Color(0xFF0f0f1a),
|
|
body: SafeArea(
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
padding: EdgeInsets.all(padding),
|
|
child: Row(
|
|
children: [
|
|
IconButton(
|
|
icon: Icon(Icons.arrow_back, color: Colors.white, size: iconSize),
|
|
onPressed: () => Navigator.pop(context),
|
|
iconSize: 48,
|
|
padding: EdgeInsets.all(_isLargeScreen ? 12 : 8),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Expanded(
|
|
child: Text(
|
|
widget.series.name,
|
|
style: TextStyle(
|
|
color: Colors.white,
|
|
fontSize: fontSize,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Expanded(
|
|
child: Consumer<IPTVProvider>(
|
|
builder: (context, provider, _) {
|
|
if (provider.isLoading) {
|
|
return Center(
|
|
child: CircularProgressIndicator(color: Colors.red, strokeWidth: _isLargeScreen ? 4 : 2),
|
|
);
|
|
}
|
|
|
|
final episodes = provider.seriesEpisodes;
|
|
if (episodes.isEmpty) {
|
|
return Center(
|
|
child: Text(
|
|
'No hay episodios',
|
|
style: TextStyle(color: Colors.grey, fontSize: _isLargeScreen ? 20 : 16),
|
|
),
|
|
);
|
|
}
|
|
|
|
return ListView.builder(
|
|
padding: EdgeInsets.all(padding),
|
|
itemCount: episodes.length,
|
|
itemBuilder: (context, index) {
|
|
final episode = episodes[index];
|
|
return Card(
|
|
color: Colors.grey[900],
|
|
margin: EdgeInsets.only(bottom: _isLargeScreen ? 16 : 8),
|
|
child: ListTile(
|
|
contentPadding: EdgeInsets.all(_isLargeScreen ? 16 : 12),
|
|
leading: Icon(
|
|
Icons.play_circle_fill,
|
|
color: Colors.red,
|
|
size: iconSize,
|
|
),
|
|
title: Text(
|
|
'S${episode.seasonNumber}E${episode.episodeNumber} - ${episode.title}',
|
|
style: TextStyle(color: Colors.white, fontSize: _isLargeScreen ? 20 : 16),
|
|
),
|
|
onTap: () {
|
|
Navigator.push(
|
|
context,
|
|
MaterialPageRoute(
|
|
builder: (_) => PlayerScreen(
|
|
stream: XtreamStream(
|
|
streamId: episode.episodeId,
|
|
name: episode.title,
|
|
containerExtension: episode.containerExtension,
|
|
url: episode.url,
|
|
),
|
|
isLive: false,
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
);
|
|
},
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|