import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:recording_tool/features/recording/widgets/record_content_transition.dart';
import 'package:recording_tool/gen/assets.gen.dart';

/// 录制页顶部：Logo、赛事标题
class RecordHeaderWidget extends StatelessWidget {
  const RecordHeaderWidget({
    super.key,
    this.eventTitle,
    required this.isRecording,
  });

  final String? eventTitle;
  final bool isRecording;

  bool get _showEventTitle => eventTitle?.trim().isNotEmpty == true;

  Widget _buildAnimatedHeaderContent() {
    if (_showEventTitle) {
      return _HeaderEventTitleRow(
        key: ValueKey('title-${eventTitle ?? ''}'),
        title: eventTitle ?? '',
      );
    }

    return const SizedBox.shrink(key: ValueKey('header-empty'));
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      bottom: false,
      child: SizedBox(
        height: 56.h,
        width: double.maxFinite,
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 12.w),
          child: Row(
            children: [
              Image.asset(
                Assets.images.imageLogo.path,
                width: 24.r,
                height: 24.r,
                fit: BoxFit.contain,
              ),
              Expanded(
                child: Stack(
                  alignment: Alignment.center,
                  children: [
                    AnimatedSwitcher(
                      duration: RecordContentTransition.duration,
                      switchInCurve: Curves.easeOutCubic,
                      switchOutCurve: Curves.easeInCubic,
                      layoutBuilder: RecordContentTransition.stackLayoutBuilder,
                      transitionBuilder: RecordContentTransition.builder,
                      child: _buildAnimatedHeaderContent(),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class _HeaderEventTitleRow extends StatelessWidget {
  const _HeaderEventTitleRow({super.key, required this.title});

  final String title;

  static TextStyle get _overlayTextStyle => TextStyle(
    color: Colors.white,
    shadows: [Shadow(color: Colors.black54, blurRadius: 6.r)],
  );

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Expanded(
          child: AnimatedSwitcher(
            duration: RecordContentTransition.duration,
            switchInCurve: Curves.easeOutCubic,
            switchOutCurve: Curves.easeInCubic,
            transitionBuilder: RecordContentTransition.builder,
            child: Text(
              title,
              key: ValueKey(title),
              style: _overlayTextStyle.copyWith(
                fontSize: 12.sp,
                fontWeight: FontWeight.w600,
              ),
              textAlign: TextAlign.center,
              maxLines: 3,
              overflow: TextOverflow.ellipsis,
            ),
          ),
        ),
      ],
    );
  }
}
