import gradio as gr
import random

questions = [
    {"image": "images/red_circle.png", "sentence": "This is a red circle.", "answer": True, "audio": "audio/q1_red_circle.mp3"},
    {"image": "images/red_circle.png", "sentence": "This is a blue square.", "answer": False, "audio": "audio/q2_blue_square_false.mp3"},
    {"image": "images/blue_square.png", "sentence": "This is a blue square.", "answer": True, "audio": "audio/q3_blue_square.mp3"},
    {"image": "images/blue_square.png", "sentence": "This is a yellow star.", "answer": False, "audio": "audio/q4_yellow_star_false.mp3"},
    {"image": "images/green_triangle.png", "sentence": "This is a green triangle.", "answer": True, "audio": "audio/q5_green_triangle.mp3"},
    {"image": "images/green_triangle.png", "sentence": "This is a red circle.", "answer": False, "audio": "audio/q6_red_circle_false.mp3"},
    {"image": "images/yellow_star.png", "sentence": "This is a yellow star.", "answer": True, "audio": "audio/q7_yellow_star.mp3"},
    {"image": "images/yellow_star.png", "sentence": "This is a green triangle.", "answer": False, "audio": "audio/q8_green_triangle_false.mp3"},
    {"image": "images/red_circle.png", "sentence": "This is a red square.", "answer": False, "audio": "audio/q9_red_square_false.mp3"},
    {"image": "images/blue_square.png", "sentence": "This is a blue circle.", "answer": False, "audio": "audio/q10_blue_circle_false.mp3"}
]

score = {"correct": 0, "wrong": 0, "index": 0}

def check_answer(user_answer, correct_answer):
    if score["index"] >= len(questions):
        return "", None, "", "🎉 Game over!", score["correct"], score["wrong"], None

    is_correct = str(user_answer) == correct_answer
    feedback = "✅ **Correct!**" if is_correct else "❌ **Wrong!**"
    if is_correct:
        score["correct"] += 1
    else:
        score["wrong"] += 1

    score["index"] += 1

    if score["index"] >= len(questions):
        feedback += f"\n🎉 Game over! Final score: {score['correct']} correct / {score['wrong']} wrong"
        return "", None, "", feedback, score["correct"], score["wrong"], None

    next_q = questions[score["index"]]
    return next_q["sentence"], next_q["image"], str(next_q["answer"]), feedback, score["correct"], score["wrong"], next_q["audio"]

def reset_game():
    score["correct"] = 0
    score["wrong"] = 0
    score["index"] = 0
    random.shuffle(questions)
    q = questions[0]
    return q["sentence"], q["image"], str(q["answer"]), "", 0, 0, q["audio"]

with gr.Blocks(css="#feedback-box {font-size: 30px; font-weight: bold; text-align: center; min-height: 60px;}") as demo:
    gr.Markdown("## 🎨 True or False Game with Audio and Visual Feedback")
    sentence = gr.Textbox(label="Sentence", interactive=False)
    image = gr.Image(type="filepath", label="Image")
    correct_answer = gr.Textbox(visible=False)

    with gr.Row():
        btn_true = gr.Button("✅ True")
        btn_false = gr.Button("❌ False")

    result = gr.Markdown("", elem_id="feedback-box")
    score_correct = gr.Number(label="Correct", value=0, interactive=False)
    score_wrong = gr.Number(label="Wrong", value=0, interactive=False)
    question_audio = gr.Audio(label="Question Audio", autoplay=True)

    btn_true.click(fn=lambda x: check_answer(True, x), inputs=correct_answer,
                   outputs=[sentence, image, correct_answer, result, score_correct, score_wrong, question_audio])
    btn_false.click(fn=lambda x: check_answer(False, x), inputs=correct_answer,
                    outputs=[sentence, image, correct_answer, result, score_correct, score_wrong, question_audio])

    demo.load(fn=reset_game,
              outputs=[sentence, image, correct_answer, result, score_correct, score_wrong, question_audio])
demo.launch()