import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:huacu_mobile/models/auth_data.dart';
import 'package:huacu_mobile/models/available_game.dart';

class TestingGroundsPage extends StatefulWidget {
  const TestingGroundsPage({super.key});

  @override
  State<TestingGroundsPage> createState() => _TestingGroundsPageState();
}

class _TestingGroundsPageState extends State<TestingGroundsPage> {
  final availableGames = <AvailableGame>[].obs;
  final AuthData authData = const AuthData("nuark", "123"); //Get.find();

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;

    return Scaffold(
      body: SizedBox(
        width: size.width,
        height: size.height,
        child: Column(
          children: [
            const Text("Available games"),
            Obx(() => Text("Count: ${availableGames.length}")),
            Expanded(
              child: ObxValue(
                (data) => ListView.builder(
                  itemCount: data.length,
                  itemBuilder: (context, index) {
                    final game = data[index];
                    final you = authData.login == game.opponentName;
                    return Card(
                      child: ListTile(
                        title: Text(
                          "Game of ${game.opponentName} ${you ? "(you)" : ""}"
                              .trim(),
                        ),
                        subtitle: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text("Tries: ${game.tries}"),
                            Text("Needed role: ${game.neededRole}"),
                          ],
                        ),
                        trailing: Row(
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            InkResponse(
                              onTap: () {},
                              child: const Icon(Icons.connect_without_contact),
                            ),
                          ],
                        ),
                      ),
                    );
                  },
                ),
                availableGames,
              ),
            ),
            Row(
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Expanded(
                  child: ObxValue(
                    (data) {
                      return ElevatedButton(
                        onPressed: data.firstWhereOrNull(
                                    (g) => g.opponentName == authData.login) ==
                                null
                            ? _createGame
                            : null,
                        child: const Text("Create"),
                      );
                    },
                    availableGames,
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  void _createGame() async {
    final data = await Get.dialog<Map<String, dynamic>?>(
        Builder(builder: (buildContext) {
      var tries = 20;
      var role = "guesser";

      return AlertDialog(
        title: const Text("New game configuration"),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            const Text("Tries:"),
            Slider(
              value: 20,
              onChanged: (value) {
                tries = value.toInt();
              },
              min: 10,
              max: 50,
              divisions: 40,
            ),
            const Text("Needed role:"),
            DropdownButton<String>(
              value: "guesser",
              items: const [
                DropdownMenuItem(
                  value: "guesser",
                  child: Text("Guesser"),
                ),
                DropdownMenuItem(
                  value: "suggester",
                  child: Text("Suggester"),
                ),
              ],
              onChanged: (value) {
                role = value ?? "guesser";
              },
            ),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () {
              Get.back();
            },
            child: const Text("Cancel"),
          ),
          TextButton(
            onPressed: () {
              Get.back(result: <String, dynamic>{
                "tries": tries,
                "role": role,
              });
            },
            child: const Text("Create"),
          ),
        ],
      );
    }));
    if (data == null) return;

    Get.snackbar("Game created", "Game created");
  }
}