app.py

import gradio as gr
import random

# ------------------------
# 🎮 GUESS THE OUTPUT QUIZ
# ------------------------

quiz_questions = [
    {"code": 'print("Hello" + "World")', "options": ["HelloWorld", "Hello World", "Hello+World"], "answer": "HelloWorld", "hint": "What happens when you add two strings?"},
    {"code": 'print(2 * 3)', "options": ["6", "23", "5"], "answer": "6", "hint": "Multiplication or joining?"},
    {"code": 'x = 5\nprint(x + 2)', "options": ["7", "10", "5"], "answer": "7", "hint": "Adding a number to a variable."},
    {"code": 'print(3 + 5 * 2)', "options": ["13", "16", "8"], "answer": "13", "hint": "Order of operations."},
    {"code": 'print("Python"[0])', "options": ["P", "Y", "p"], "answer": "P", "hint": "What does the index 0 in a string return?"},
    {"code": 'x = [1, 2, 3]\nprint(x[1])', "options": ["2", "3", "1"], "answer": "2", "hint": "Indexing a list."},
    {"code": 'print("5" + "5")', "options": ["10", "55", "50"], "answer": "55", "hint": "What happens when you add strings?"}
]

# ------------------------
# GAME LOGIC
# ------------------------

def get_new_question():
    q = random.choice(quiz_questions)
    return q

def start_game():
    question = get_new_question()
    return (
        question["code"], 
        gr.update(choices=question["options"], value=None),
        "", "",  # Clear result and hint
        question,  # Save question in state
        0          # Initial score
    )

def submit_answer(user_answer, current_question, score):
    if user_answer == current_question["answer"]:
        score += 1
        result = f"✅ Correct! Your score is now {score}"
    else:
        result = f"❌ Wrong! The correct answer was '{current_question['answer']}'"

    # Show hint
    hint = f"💡 Hint: {current_question['hint']}"

    # Load next question
    next_question = get_new_question()

    return (
        next_question["code"],
        gr.update(choices=next_question["options"], value=None),
        result,
        hint,
        next_question,
        score
    )

# ------------------------
# GRADIO UI
# ------------------------

with gr.Blocks() as demo:
    gr.Markdown("## 🧠 Learn Python Through Games - Guess the Output Edition")

    start_btn = gr.Button("🎲 Start Quiz")

    question_display = gr.Textbox(label="🧩 Code Snippet", interactive=False)
    options_dropdown = gr.Dropdown(choices=[], label="Choose the Output")
    submit_btn = gr.Button("Submit Answer")

    result_text = gr.Textbox(label="Result", interactive=False)
    hint_text = gr.Textbox(label="Hint", interactive=False)

    # Hidden states to store session data
    question_state = gr.State()
    score_state = gr.State()

    # Link start button to load first question
    start_btn.click(start_game, 
                    inputs=[], 
                    outputs=[question_display, options_dropdown, result_text, hint_text, question_state, score_state])

    # Link submit button to check answer and load next
    submit_btn.click(submit_answer, 
                     inputs=[options_dropdown, question_state, score_state], 
                     outputs=[question_display, options_dropdown, result_text, hint_text, question_state, score_state])

demo.launch()