import 'package:flutter/material.dart';
import 'package:ju_learn/main.dart';

// ignore: must_be_immutable
class QuizPageTest extends StatefulWidget {
  Vault v;
  QuizPageTest(this.v, {super.key});

  @override
  // ignore: no_logic_in_create_state, library_private_types_in_public_api
  _QuizPageTestState createState() => _QuizPageTestState(v);
}

class _QuizPageTestState extends State<QuizPageTest> {
  int qI = 0;
  late Question _currentQuestion;
  bool finished = false;
  Vault v;
  _QuizPageTestState(this.v) {
    v.softReset();
    _currentQuestion = v.questions[0];
  }

  void _checkAnswer(int selectedIndex) {
    setState(() {
      _currentQuestion.pickedAwnser = selectedIndex;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Testing: ${v.name}'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Align(
              alignment: Alignment.center,
              child: finished
                  ? Text("${v.rightNum()}/${v.questions.length} correct")
                  : Text("${v.pickedNum()}/${v.questions.length} awnsered"),
            ),
            Text(
              _currentQuestion.quest,
              style: const TextStyle(
                fontSize: 20.0,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 20.0),
            ..._currentQuestion.answers.map((option) => Container(
                margin: const EdgeInsets.symmetric(vertical: 8.0),
                child: FilledButton(
                    onPressed: () {
                      if (!finished) {
                        _checkAnswer(
                          _currentQuestion.answers.indexOf(option),
                        );
                      }
                    },
                    style: FilledButton.styleFrom(
                        padding: const EdgeInsets.all(16.0),
                        backgroundColor: !finished
                            ? (_currentQuestion.answers.indexOf(option) ==
                                    _currentQuestion.pickedAwnser
                                ? Colors.amber
                                : null)
                            : (_currentQuestion.answers.indexOf(option) ==
                                    _currentQuestion.pickedAwnser
                                ? (_currentQuestion.correct ==
                                        _currentQuestion.answers.indexOf(option)
                                    ? Colors.green[200]
                                    : Colors.red[200])
                                : (_currentQuestion.correct ==
                                        _currentQuestion.answers.indexOf(option)
                                    ? Colors.green
                                    : Colors.red))),
                    child: Text(option)))),
            if (finished)
              Text(
                _currentQuestion.explanation,
                style: const TextStyle(
                  fontSize: 15.0,
                  fontWeight: FontWeight.bold,
                ),
              )
          ],
        ),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      floatingActionButton: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 12),
        child: Row(
          children: [
            FloatingActionButton(
              onPressed: () {
                if (qI > 0) {
                  qI--;
                } else {
                  qI = v.questions.length - 1;
                }
                setState(() {
                  _currentQuestion = v.questions[qI];
                });
              },
              child: const Icon(Icons.chevron_left),
            ),
            if (!finished) const Spacer(),
            if (!finished)
              FloatingActionButton(
                onPressed: () {
                  showDialog(
                    context: context,
                    builder: (BuildContext context) {
                      return AlertDialog(
                        title: const Text('Finish Test'),
                        content: const Text('Do you want to finish your Test?'),
                        actions: [
                          TextButton(
                              onPressed: () {
                                Navigator.of(context).pop();
                              },
                              child: const Text('Cancel')),
                          FilledButton(
                            child: const Text('Finish'),
                            onPressed: () {
                              setState(() {
                                finished = true;
                              });
                              Navigator.of(context).pop();
                            },
                          ),
                        ],
                      );
                    },
                  );
                },
                child: const Icon(Icons.check),
              ),
            const Spacer(),
            FloatingActionButton(
              onPressed: () {
                if (qI < v.questions.length - 1) {
                  qI++;
                } else {
                  qI = 0;
                }
                setState(() {
                  _currentQuestion = v.questions[qI];
                });
              },
              child: const Icon(Icons.chevron_right),
            ),
          ],
        ),
      ),
    );
  }
}