import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import '../estado/estado_radio.dart';
import '../pantallas/pantalla_reproductor.dart';
import '../servicios/servicio_audio.dart';
import '../tema/pluriwave_theme.dart';
import 'pluri_glass_surface.dart';
import 'pluri_icon.dart';
import 'visualizador_audio.dart';

/// Barra inferior persistente con controles básicos de reproducción.
/// Toca la barra para abrir PantallaReproductor completa.
class MiniReproductor extends StatelessWidget {
  const MiniReproductor({super.key});

  @override
  Widget build(BuildContext context) {
    final estado = context.watch<EstadoRadio>();
    final emisora = estado.emisoraActual;

    if (emisora == null) return const SizedBox.shrink();

    final t = context.pluriTokens;

    return SafeArea(
      top: false,
      child: Padding(
        padding: EdgeInsets.fromLTRB(
          t.spacingMd,
          t.spacingSm,
          t.spacingMd,
          t.spacingSm,
        ),
        child: PluriGlassSurface(
          padding: EdgeInsets.symmetric(
            horizontal: t.spacingSm,
            vertical: t.spacingXs,
          ),
          borderRadius: BorderRadius.circular(999),
          child: Row(
            children: [
              Expanded(
                child: Semantics(
                  button: true,
                  label: 'Abrir reproductor de ${emisora.nombre}',
                  child: Material(
                    color: Colors.transparent,
                    child: InkWell(
                      borderRadius: BorderRadius.circular(999),
                      onTap: () => PantallaReproductor.abrir(context, emisora),
                      child: Padding(
                        padding: EdgeInsets.symmetric(
                          horizontal: t.spacingXs,
                          vertical: t.spacingXs,
                        ),
                        child: Row(
                          children: [
                            SizedBox(
                              width: 40,
                              height: 40,
                              child: Center(
                                child: IndicadorReproduccion(
                                  estadoStream: estado.estadoStream,
                                  color: t.electricMagenta,
                                  size: 20,
                                ),
                              ),
                            ),
                            SizedBox(width: t.spacingSm),
                            Expanded(
                              child: Column(
                                mainAxisSize: MainAxisSize.min,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text(
                                    emisora.nombre,
                                    style: Theme.of(context)
                                        .textTheme
                                        .titleSmall
                                        ?.copyWith(fontWeight: FontWeight.w700),
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                  ),
                                  StreamBuilder<EstadoReproduccion>(
                                    stream: estado.estadoStream,
                                    builder: (context, snapshot) {
                                      final s =
                                          snapshot.data ??
                                          EstadoReproduccion.detenido;
                                      final activo =
                                          s == EstadoReproduccion.reproduciendo;
                                      return Text(
                                        _labelEstado(s),
                                        style: Theme.of(
                                          context,
                                        ).textTheme.bodySmall?.copyWith(
                                          color:
                                              activo
                                                  ? t.warmCoral
                                                  : Theme.of(context)
                                                      .colorScheme
                                                      .onSurface
                                                      .withValues(alpha: 0.7),
                                          fontWeight:
                                              activo
                                                  ? FontWeight.w600
                                                  : FontWeight.w400,
                                        ),
                                      );
                                    },
                                  ),
                                ],
                              ),
                            ),
                            PluriIcon(
                              glyph: PluriIconGlyph.player,
                              variant: PluriIconVariant.activeGlow,
                              size: 18,
                              semanticLabel: 'Reproductor',
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              StreamBuilder<EstadoReproduccion>(
                stream: estado.estadoStream,
                builder: (context, snapshot) {
                  final s = snapshot.data ?? EstadoReproduccion.detenido;
                  if (s == EstadoReproduccion.cargando) {
                    return const SizedBox(
                      width: 48,
                      height: 48,
                      child: Padding(
                        padding: EdgeInsets.all(12),
                        child: CircularProgressIndicator(strokeWidth: 2),
                      ),
                    );
                  }

                  if (s == EstadoReproduccion.error) {
                    final emisoraActual = estado.emisoraActual;
                    return IconButton(
                      tooltip: 'Reintentar',
                      icon: const Icon(Icons.refresh_rounded),
                      onPressed:
                          emisoraActual != null
                              ? () => estado.reproducir(emisoraActual)
                              : null,
                      constraints: const BoxConstraints.tightFor(
                        width: 48,
                        height: 48,
                      ),
                    );
                  }

                  return Semantics(
                    button: true,
                    label:
                        s == EstadoReproduccion.reproduciendo
                            ? 'Pausar'
                            : 'Reproducir',
                    child: IconButton(
                      tooltip:
                          s == EstadoReproduccion.reproduciendo
                              ? 'Pausar'
                              : 'Reproducir',
                      icon: Icon(
                        s == EstadoReproduccion.reproduciendo
                            ? Icons.pause_circle_filled_rounded
                            : Icons.play_circle_fill_rounded,
                        color: t.electricMagenta,
                      ),
                      onPressed: estado.togglePlay,
                      constraints: const BoxConstraints.tightFor(
                        width: 48,
                        height: 48,
                      ),
                    ),
                  );
                },
              ),
            ],
          ),
        ),
      ),
    );
  }

  String _labelEstado(EstadoReproduccion estado) {
    return switch (estado) {
      EstadoReproduccion.cargando => 'Conectando...',
      EstadoReproduccion.reproduciendo => 'En directo',
      EstadoReproduccion.pausado => 'Pausado',
      EstadoReproduccion.error => 'Error de conexión',
      EstadoReproduccion.detenido => 'Detenido',
    };
  }
}
