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

class PlacarPage extends StatefulWidget {
  final String gameId;
  final String myTeam;
  final String opponentTeam;

  const PlacarPage({
    super.key,
    required this.gameId,
    required this.myTeam,
    required this.opponentTeam,
  });

  @override
  State<PlacarPage> createState() => _PlacarPageState();
}

class _PlacarPageState extends State<PlacarPage> {
  int _myScore = 0;
  int _opponentScore = 0;
  
  // Lógica do Tempo (Exemplo: 10 minutos)
  Duration _duration = const Duration(minutes: 10);
  Timer? _timer;
  bool _isRunning = false;

  void _toggleTimer() {
    if (_isRunning) {
      _timer?.cancel();
    } else {
      _timer = Timer.periodic(const Duration(seconds: 1), (timer) {
        if (_duration.inSeconds > 0) {
          setState(() => _duration -= const Duration(seconds: 1));
        } else {
          _timer?.cancel();
          setState(() => _isRunning = false);
        }
      });
    }
    setState(() => _isRunning = !_isRunning);
  }

  String _formatTime(Duration d) {
    return "${d.inMinutes.toString().padLeft(2, '0')}:${d.inSeconds.remainder(60).toString().padLeft(2, '0')}";
  }

  @override
  void dispose() {
    _timer?.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFF121212),
      appBar: AppBar(
        title: const Text("Placar Live"),
        backgroundColor: Colors.transparent,
        foregroundColor: Colors.white,
        elevation: 0,
      ),
      body: Column(
        children: [
          const SizedBox(height: 20),
          // Cronómetro
          GestureDetector(
            onTap: _toggleTimer,
            child: Text(
              _formatTime(_duration),
              style: const TextStyle(color: Colors.white, fontSize: 75, fontWeight: FontWeight.bold, fontFamily: 'monospace'),
            ),
          ),
          const Text("CLIQUE NO TEMPO PARA INICIAR/PAUSAR", style: TextStyle(color: Colors.grey, fontSize: 10)),
          
          Expanded(
            child: Row(
              children: [
                // Minha Equipa
                _buildTeamSide(widget.myTeam, _myScore, (p) => setState(() => _myScore += p), const Color(0xFFE74C3C)),
                // Divisor
                Container(width: 1, color: Colors.white24, margin: const EdgeInsets.symmetric(vertical: 40)),
                // Adversário
                _buildTeamSide(widget.opponentTeam, _opponentScore, (p) => setState(() => _opponentScore += p), Colors.blueGrey),
              ],
            ),
          ),

          // Botão Finalizar
          Padding(
            padding: const EdgeInsets.all(20.0),
            child: ElevatedButton(
              style: ElevatedButton.styleFrom(
                backgroundColor: Colors.green,
                minimumSize: const Size(double.infinity, 50),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
              ),
              onPressed: () {
                // Aqui podes adicionar a lógica para salvar o resultado final no Controller
                Navigator.pop(context);
              },
              child: const Text("FINALIZAR PARTIDA", style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTeamSide(String name, int score, Function(int) onAdd, Color color) {
    return Expanded(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(name, textAlign: TextAlign.center, style: const TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold)),
          const SizedBox(height: 10),
          Text("$score", style: TextStyle(color: color, fontSize: 80, fontWeight: FontWeight.bold)),
          const SizedBox(height: 30),
          // Botões de Pontuação
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [1, 2, 3].map((p) => Padding(
              padding: const EdgeInsets.symmetric(horizontal: 4),
              child: InkWell(
                onTap: () => onAdd(p),
                child: CircleAvatar(
                  backgroundColor: color.withOpacity(0.2),
                  child: Text("+$p", style: TextStyle(color: color, fontWeight: FontWeight.bold)),
                ),
              ),
            )).toList(),
          ),
        ],
      ),
    );
  }
}