import 'package:flutter/material.dart';

import 'speed_button.dart';

const holdSpeedPromptBackgroundColor = Color(0x45181818);

class HoldSpeedPrompt extends StatelessWidget {
  final bool visible;
  final bool isLeft;
  final double rate;

  const HoldSpeedPrompt({
    super.key,
    required this.visible,
    required this.isLeft,
    required this.rate,
  });

  @override
  Widget build(BuildContext context) {
    final label = isLeft
        ? '${SpeedButton.formatRate(rate)} 慢放中'
        : '${SpeedButton.formatRate(rate)} 快进中';
    return Positioned(
      top: 0,
      left: 0,
      right: 0,
      child: SafeArea(
        child: IgnorePointer(
          child: AnimatedOpacity(
            opacity: visible ? 1 : 0,
            duration: const Duration(milliseconds: 160),
            child: Padding(
              padding: const EdgeInsets.only(top: 64),
              child: Center(
                child: Container(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 16,
                    vertical: 8,
                  ),
                  decoration: BoxDecoration(
                    color: holdSpeedPromptBackgroundColor,
                    borderRadius: BorderRadius.circular(999),
                  ),
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Icon(
                        isLeft ? Icons.fast_rewind : Icons.fast_forward,
                        color: Colors.white,
                        size: 18,
                      ),
                      const SizedBox(width: 6),
                      Text(
                        label,
                        style: const TextStyle(
                          color: Colors.white,
                          fontSize: 14,
                          fontWeight: FontWeight.w500,
                          fontFeatures: [FontFeature.tabularFigures()],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}