ReelShort/lib/pages/player/widgets/player_video_surface.dart

// Author: fruit.com.cn

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';

import '../../../core/widgets/remote_image.dart';

const Duration _videoFadeDuration = Duration(milliseconds: 200);
const double _debugRight = 8;
const double _debugBottom = 8;
const double _debugFontSize = 11;
const double _errorHorizontal = 32;
const int _errorMaxLines = 3;

/// 封面底层与视频层共用同一控制器，视频首帧就绪后再淡入。
class PlayerVideoSurface extends StatefulWidget {
  const PlayerVideoSurface({
    super.key,
    required this.controller,
    required this.posterUrl,
    required this.videoUrl,
    required this.theater,
    required this.onTap,
  });

  final VideoPlayerController? controller;
  final String posterUrl;
  final String videoUrl;
  final bool theater;
  final VoidCallback onTap;

  @override
  State<PlayerVideoSurface> createState() => _PlayerVideoSurfaceState();
}

class _PlayerVideoSurfaceState extends State<PlayerVideoSurface> {
  String? _lastDebugState;

  @override
  void didUpdateWidget(covariant PlayerVideoSurface oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.controller != widget.controller) _lastDebugState = null;
  }

  @override
  Widget build(BuildContext context) {
    final controller = widget.controller;
    if (controller == null) return _frame(null);
    return ValueListenableBuilder<VideoPlayerValue>(
      valueListenable: controller,
      builder: (context, value, _) => _frame(value),
    );
  }

  Widget _frame(VideoPlayerValue? value) {
    final controller = widget.controller;
    final reveal = _shouldReveal(value);
    _logStateChange(value);
    return Stack(
      fit: StackFit.expand,
      children: [
        _FallbackBackground(posterUrl: widget.posterUrl),
        AnimatedOpacity(
          key: const Key('player-video-opacity'),
          opacity: reveal ? 1 : 0,
          duration: _videoFadeDuration,
          curve: Curves.easeOut,
          child: reveal && controller != null
              ? _VideoLayer(
                  controller: controller,
                  value: value!,
                  theater: widget.theater,
                  onTap: widget.onTap,
                )
              : const SizedBox.expand(),
        ),
        if (kDebugMode)
          Positioned(
            right: _debugRight,
            bottom: _debugBottom,
            child: DecoratedBox(
              decoration: const BoxDecoration(color: Color(0x99000000)),
              child: Padding(
                padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 2),
                child: Text(
                  _debugStatus(value),
                  key: const Key('player-debug-video'),
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: const TextStyle(
                    color: Colors.white70,
                    fontSize: _debugFontSize,
                  ),
                ),
              ),
            ),
          ),
        if (kDebugMode && value?.hasError == true)
          Center(
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: _errorHorizontal),
              child: Text(
                value?.errorDescription ?? 'unknown video error',
                key: const Key('player-video-error'),
                maxLines: _errorMaxLines,
                overflow: TextOverflow.ellipsis,
                textAlign: TextAlign.center,
                style: const TextStyle(color: Colors.white70, fontSize: 13),
              ),
            ),
          ),
      ],
    );
  }

  bool _shouldReveal(VideoPlayerValue? value) {
    return value != null &&
        !value.hasError &&
        value.isInitialized &&
        value.size.width > 0 &&
        (value.position > Duration.zero || value.isPlaying);
  }

  void _logStateChange(VideoPlayerValue? value) {
    if (!kDebugMode) return;
    final status = _debugStatus(value);
    final signature =
        '$status|${value?.isInitialized ?? false}|'
        '${value?.errorDescription ?? 'none'}';
    if (signature == _lastDebugState) return;
    _lastDebugState = signature;
    final source = widget.controller?.dataSource ?? widget.videoUrl;
    debugPrint(
      '[video] init=${value?.isInitialized ?? false} '
      'err=${value?.errorDescription ?? 'none'} host=${_host(source)}',
    );
  }

  String _debugStatus(VideoPlayerValue? value) {
    if (value == null) return 'loading';
    if (value.hasError) {
      return 'error: ${value.errorDescription ?? 'unknown'}';
    }
    if (value.isBuffering) return 'buffering';
    if (value.isInitialized) return 'initialized';
    return 'loading';
  }

  String _host(String source) {
    final uri = Uri.tryParse(source);
    if (uri == null || uri.host.isEmpty) return 'unknown';
    final port = uri.hasPort
        ? uri.port
        : uri.scheme == 'https'
        ? 443
        : 80;
    return '${uri.host}:$port';
  }
}

class _VideoLayer extends StatelessWidget {
  const _VideoLayer({
    required this.controller,
    required this.value,
    required this.theater,
    required this.onTap,
  });

  final VideoPlayerController controller;
  final VideoPlayerValue value;
  final bool theater;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: onTap,
      child: FittedBox(
        fit: theater ? BoxFit.contain : BoxFit.cover,
        child: SizedBox(
          width: value.size.width,
          height: value.size.height,
          child: VideoPlayer(controller, key: ValueKey(controller)),
        ),
      ),
    );
  }
}

class _FallbackBackground extends StatelessWidget {
  const _FallbackBackground({required this.posterUrl});

  final String posterUrl;

  @override
  Widget build(BuildContext context) {
    if (posterUrl.trim().isEmpty) {
      return const ColoredBox(
        key: Key('player-fallback-background'),
        color: Colors.black,
      );
    }
    return Stack(
      key: const Key('player-fallback-background'),
      fit: StackFit.expand,
      children: [
        RemoteImage(
          posterUrl,
          key: const Key('player-fallback-cover'),
          fit: BoxFit.cover,
          fallbackColor: Colors.black,
        ),
        const ColoredBox(
          key: Key('player-fallback-scrim'),
          color: Color(0x4D000000),
        ),
      ],
    );
  }
}