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

import '../models/game.dart';
import '../models/player.dart';
import '../models/role.dart';

class FlipingCard extends StatefulWidget {
  final List<Player> players;
  const FlipingCard({required this.players, super.key});

  @override
  State<FlipingCard> createState() => _FlipingCardState();
}

class _FlipingCardState extends State<FlipingCard> {
  int index = 0;

  String giveRole(Role role) {
    String playerrole = "Dorfbewohner";
    switch (role) {
      case Role.werwolf:
        playerrole = "Werwolf";
        break;
      case Role.joker:
        playerrole = "Joker";
        break;
      default:
        playerrole = "Dorfbewohner";
        break;
    }
    return playerrole;
  }

  _renderContent(context) {
    return Card(
      elevation: 0.0,
      margin: const EdgeInsets.only(
          left: 15.0, right: 15.0, top: 10.0, bottom: 10.0),
      color: const Color(0x00000000),
      child: FlipCard(
        direction: FlipDirection.HORIZONTAL,
        side: CardSide.FRONT,
        speed: 400,
        onFlipDone: (status) {},
        front: Container(
          decoration: const BoxDecoration(
            color: Color(0xFF006666),
            borderRadius: BorderRadius.all(Radius.circular(8.0)),
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                padding: const EdgeInsets.all(10),
                child: Text(
                  widget.players[index].name,
                  textAlign: TextAlign.center,
                  style: Theme.of(context)
                      .textTheme
                      .displayMedium
                      ?.copyWith(color: Colors.white),
                ),
              ),
              Text('Klick um deine Rolle zu sehen!',
                  textAlign: TextAlign.center,
                  style: Theme.of(context).textTheme.bodyLarge?.copyWith(
                      color: const Color.fromARGB(255, 202, 202, 202))),
            ],
          ),
        ),
        back: Container(
          decoration: const BoxDecoration(
            color: Color(0xFF006666),
            borderRadius: BorderRadius.all(Radius.circular(8.0)),
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                padding: const EdgeInsets.all(10),
                child: Text(
                  giveRole(widget.players[index].role),
                  textAlign: TextAlign.center,
                  style: Theme.of(context)
                      .textTheme
                      .displaySmall
                      ?.copyWith(color: Colors.white),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Werwolf"),
        centerTitle: true,
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Expanded(child: _renderContent(context)),
          Container(
            color: const Color.fromARGB(255, 29, 29, 29),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                OutlinedButton(
                  style: OutlinedButton.styleFrom(
                    foregroundColor: Colors.red,
                    side: const BorderSide(
                      color: Colors.red,
                    ),
                  ),
                  onPressed: () {
                    if (index > 0 && index <= widget.players.length) {
                      index--;
                    }
                  },
                  child: const Text("Zurück"),
                ),
                OutlinedButton(
                  style: OutlinedButton.styleFrom(
                    foregroundColor: const Color.fromARGB(255, 40, 168, 168),
                    side: const BorderSide(
                      color: Color.fromARGB(255, 40, 168, 168),
                    ),
                  ),
                  onPressed: () {
                    if (index >= 0 && index <= widget.players.length) {
                      index++;
                    }
                  },
                  child: const Text("Nächster Spieler"),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}