mirror of
https://github.com/R0m1k3/xtremflow.git
synced 2026-10-11 17:30:00 +02:00
feat(design): Warm Cinema theme + event-driven adaptive players
Replaces the Projector Noir palette with "Warm Cinema" and rebuilds the web players around a shared, event-driven engine. Design - app_colors: warm charcoal (#0B0908), cream (#F3E9DF), ember (#D9541F); adds posterScrim/heroScrim gradients, lift()/emberFocus() shadows, const cream-alpha tokens replacing Colors.whiteNN, and primaryFill, a deeper ember reserved for text-bearing fills so white labels clear the 4.5:1 AA threshold that #D9541F alone does not - app_theme / mobile_theme: Fraunces (display serif) + Karla (body), tighter radii, 20+ component themes - glass_container: opaque layered surfaces replace the blurred glass - themed_loading_screen restyled; players and boot splash follow Performance - drop every BackdropFilter: backdrop blur forced a full framebuffer read per frame per card, the main source of scroll jank - bundle Fraunces/Karla as assets so google_fonts stops fetching from fonts.gstatic.com at startup - bound image decode size on 12 sites: a 40-poster grid drops from ~240 MB to a few tens of MB of GPU memory Players (new shared engine: web/xf-player-core.js) - start on media events instead of polling the buffer every 100-200 ms - hls.js/mpegts.js loaded on demand, so ~213 KB of mpegts is never fetched for HLS streams - liveSyncDurationCount 10 -> 2, startFragPrefetch on, testBandwidth off, MPEG-TS initial stash 512 KB -> 64 KB - adaptive escalation fast -> balanced -> safe after repeated stalls in a 60 s window, applied live for HLS so there is no visible cut Preserved from the recent streaming work on main: server-side quality selection, stable player viewId, the turbo direct MPEG-TS path, vendored library cache headers and the CI/Docker changes. Only the theme layer and the player front-end were replaced; GlassCard stays in ui_components. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
MichaelandClaude Opus 5 committed
1 parent
e332895d7d
commit
1feeaae78a
49 files changed
+2341
-1751
No files matched your search
@@ -50,7 +50,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
const SizedBox(height: 16),
|
||||
const Text(
|
||||
'Loading channels...',
|
||||
style: TextStyle(color: Colors.white70),
|
||||
style: TextStyle(color: AppColors.onSurfaceVariant),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
FutureBuilder(
|
||||
@@ -80,8 +80,8 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'Failed to load channels',
|
||||
style: GoogleFonts.instrumentSans(
|
||||
color: Colors.white,
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
@@ -89,7 +89,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'$e',
|
||||
style: const TextStyle(color: Colors.white54),
|
||||
style: const TextStyle(color: AppColors.onSurface54),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
@@ -153,15 +153,15 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
Expanded(
|
||||
child: TextField(
|
||||
controller: _searchController,
|
||||
style: GoogleFonts.instrumentSans(color: Colors.white),
|
||||
style: GoogleFonts.karla(color: AppColors.onSurface),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search channels...',
|
||||
hintStyle:
|
||||
GoogleFonts.instrumentSans(color: Colors.white54),
|
||||
GoogleFonts.karla(color: AppColors.onSurface54),
|
||||
border: InputBorder.none,
|
||||
prefixIcon: const Icon(
|
||||
Icons.search,
|
||||
color: Colors.white54,
|
||||
color: AppColors.onSurface54,
|
||||
),
|
||||
isDense: true,
|
||||
),
|
||||
@@ -171,7 +171,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
GestureDetector(
|
||||
onTap: () => _searchController.clear(),
|
||||
child:
|
||||
const Icon(Icons.close, color: Colors.white54),
|
||||
const Icon(Icons.close, color: AppColors.onSurface54),
|
||||
),
|
||||
],
|
||||
),
|
||||
@@ -201,15 +201,15 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: isSelected
|
||||
? Colors.white
|
||||
? AppColors.onSurface
|
||||
: Colors.black.withOpacity(0.4),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Text(
|
||||
category,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
color:
|
||||
isSelected ? Colors.black : Colors.white70,
|
||||
isSelected ? Colors.black : AppColors.onSurfaceVariant,
|
||||
fontWeight: isSelected
|
||||
? FontWeight.w600
|
||||
: FontWeight.w500,
|
||||
@@ -233,8 +233,8 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
: _showFavoritesOnly
|
||||
? 'Favorites'
|
||||
: _selectedCategory ?? 'Channels',
|
||||
style: GoogleFonts.instrumentSans(
|
||||
color: Colors.white,
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.onSurface,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 18,
|
||||
),
|
||||
@@ -249,7 +249,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
decoration: BoxDecoration(
|
||||
color: _showFavoritesOnly
|
||||
? AppColors.live.withOpacity(0.2)
|
||||
: Colors.white.withOpacity(0.1),
|
||||
: AppColors.onSurface.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
border: _showFavoritesOnly
|
||||
? Border.all(color: AppColors.live)
|
||||
@@ -261,7 +261,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
: Icons.favorite_border,
|
||||
color: _showFavoritesOnly
|
||||
? AppColors.live
|
||||
: Colors.white,
|
||||
: AppColors.onSurface,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
@@ -279,13 +279,13 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.tv_off,
|
||||
color: Colors.white24,
|
||||
color: AppColors.onSurface24,
|
||||
size: 48,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'No channels found',
|
||||
style: GoogleFonts.instrumentSans(color: Colors.white38),
|
||||
style: GoogleFonts.karla(color: AppColors.onSurface38),
|
||||
),
|
||||
],
|
||||
),
|
||||
@@ -365,7 +365,7 @@ class _MobileChannelTile extends StatelessWidget {
|
||||
width: 48,
|
||||
height: 48,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
color: AppColors.onSurface.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
padding: const EdgeInsets.all(4),
|
||||
@@ -373,17 +373,19 @@ class _MobileChannelTile extends StatelessWidget {
|
||||
? Image.network(
|
||||
iconUrl,
|
||||
fit: BoxFit.contain,
|
||||
cacheWidth: 120,
|
||||
filterQuality: FilterQuality.low,
|
||||
errorBuilder: (_, __, ___) =>
|
||||
const Icon(Icons.tv, color: Colors.white24),
|
||||
const Icon(Icons.tv, color: AppColors.onSurface24),
|
||||
)
|
||||
: const Icon(Icons.tv, color: Colors.white24),
|
||||
: const Icon(Icons.tv, color: AppColors.onSurface24),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: Text(
|
||||
channel.name,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
color: Colors.white,
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.onSurface,
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 14,
|
||||
),
|
||||
@@ -394,12 +396,12 @@ class _MobileChannelTile extends StatelessWidget {
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
color: AppColors.onSurface.withOpacity(0.1),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.play_arrow_rounded,
|
||||
color: Colors.white,
|
||||
color: AppColors.onSurface,
|
||||
size: 16,
|
||||
),
|
||||
),
|
||||
|
||||
@@ -206,13 +206,13 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
|
||||
Expanded(
|
||||
child: TextField(
|
||||
controller: _searchController,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
fontSize: 14,
|
||||
color: AppColors.onSurface,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search Movies...',
|
||||
hintStyle: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
|
||||
hintStyle: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
|
||||
border: InputBorder.none,
|
||||
isDense: true,
|
||||
contentPadding: const EdgeInsets.only(bottom: 11),
|
||||
@@ -300,6 +300,8 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
|
||||
? Image.network(
|
||||
_getProxiedImageUrl(movie.streamIcon, ref),
|
||||
fit: BoxFit.cover,
|
||||
cacheWidth: 360,
|
||||
filterQuality: FilterQuality.low,
|
||||
errorBuilder: (_, __, ___) =>
|
||||
Container(color: AppColors.surfaceContainerLow),
|
||||
)
|
||||
@@ -346,7 +348,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
|
||||
children: [
|
||||
Text(
|
||||
movie.name,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
@@ -357,7 +359,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
|
||||
if (isWatched)
|
||||
Text(
|
||||
'WATCHED',
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.primary,
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
@@ -389,7 +391,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
_formatRating(movie.rating)!,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColors.onSurface,
|
||||
|
||||
@@ -197,13 +197,13 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
|
||||
Expanded(
|
||||
child: TextField(
|
||||
controller: _searchController,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
fontSize: 14,
|
||||
color: AppColors.onSurface,
|
||||
),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search Series...',
|
||||
hintStyle: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
|
||||
hintStyle: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
|
||||
border: InputBorder.none,
|
||||
isDense: true,
|
||||
contentPadding: const EdgeInsets.only(bottom: 11),
|
||||
@@ -290,6 +290,8 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
|
||||
? Image.network(
|
||||
_getProxiedImageUrl(series.cover, ref),
|
||||
fit: BoxFit.cover,
|
||||
cacheWidth: 360,
|
||||
filterQuality: FilterQuality.low,
|
||||
errorBuilder: (_, __, ___) =>
|
||||
Container(color: AppColors.surfaceContainerLow),
|
||||
)
|
||||
@@ -332,7 +334,7 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
|
||||
right: 12,
|
||||
child: Text(
|
||||
series.name,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
@@ -364,7 +366,7 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
_formatRating(series.rating)!,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColors.onSurface,
|
||||
|
||||
@@ -398,7 +398,7 @@ class _SectionHeader extends StatelessWidget {
|
||||
padding: const EdgeInsets.only(left: 8, bottom: 8),
|
||||
child: Text(
|
||||
title,
|
||||
style: GoogleFonts.instrumentSans(
|
||||
style: GoogleFonts.karla(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.onSurfaceVariant,
|
||||
|
||||
Reference in new issue
Block a user