app.py

import gradio as gr
import random

# Quiz questions and answers
questions = [
    {
        "question": "Who was the chief engineer of the Eiffel Tower?",
        "options": ["Gustave Eiffel", "Maurice Koechlin", "Émile Nouguier", "Stephen Sauvestre"],
        "answer": "Maurice Koechlin",
        "explanation": "Maurice Koechlin designed the internal structure of the tower."
    },
    {
        "question": "What material provides tensile strength in concrete?",
        "options": ["Steel rebar", "Carbon fiber", "Bamboo", "Glass fibers"],
        "answer": "Steel rebar",
        "explanation": "Steel reinforcement bars handle tensile forces in concrete."
    },
    {
        "question": "The Leaning Tower of Pisa tilts due to:",
        "options": ["Inadequate foundation", "Earthquakes", "Material decay", "Design choice"],
        "answer": "Inadequate foundation",
        "explanation": "It was built on unstable subsoil with insufficient foundation depth."
    }
]

def start_quiz(name):
    """Initialize the quiz"""
    if not name.strip():
        name = "Construction Expert"
    
    # Shuffle questions
    random.shuffle(questions)
    
    # Create question interface
    question_uis = []
    for i, q in enumerate(questions):
        with gr.Row():
            gr.Markdown(f"**{i+1}. {q['question']}**")
            question_uis.append(gr.Radio(choices=q["options"], label="Select answer", show_label=False))
    
    # Add submit button
    with gr.Row():
        submit_btn = gr.Button("Submit Answers", variant="primary")
    
    return {
        quiz_state: {"name": name, "questions": questions},
        quiz_container: gr.update(visible=True),
        start_container: gr.update(visible=False),
        questions_column: gr.Column(question_uis),
        submit_button: submit_btn
    }

def evaluate_answers(state):
    """Calculate and display results"""
    results = []
    score = 0
    
    for i, q in enumerate(state["questions"]):
        user_answer = state[f"answer_{i}"]
        is_correct = user_answer == q["answer"]
        
        if is_correct:
            score += 1
        
        results.append((
            f"{i+1}. {q['question']}",
            f"Your answer: {user_answer}",
            f"Correct answer: {q['answer']}",
            f"Explanation: {q['explanation']}",
            "✅ Correct" if is_correct else "❌ Incorrect"
        ))
    
    # Create results display
    result_html = f"""
    <div style="text-align:center; padding:20px; border-radius:10px; background:#f8f9fa">
        <h2>🏆 Quiz Results</h2>
        <h3>Score: {score}/{len(questions)}</h3>
        <h4>Participant: {state['name']}</h4>
    """
    
    for res in results:
        result_html += f"""
        <div style="margin:20px; padding:15px; border-left:4px solid {'#4CAF50' if '✅' in res[4] else '#F44336'}; 
                    background: {'#e8f5e9' if '✅' in res[4] else '#ffebee'}">
            <p><b>{res[0]}</b></p>
            <p>{res[1]}</p>
            <p>{res[2]}</p>
            <p><i>{res[3]}</i></p>
            <p><b>{res[4]}</b></p>
        </div>
        """
    
    result_html += """
        <button style="padding:12px 24px; background:#FFA000; color:white; border:none; 
                      border-radius:8px; font-weight:bold; cursor:pointer;"
                onclick="location.reload()">Restart Quiz</button>
    </div>
    """
    
    return {
        results_container: gr.update(value=result_html, visible=True),
        quiz_container: gr.update(visible=False)
    }

with gr.Blocks(title="Building Construction Quiz", theme=gr.themes.Soft()) as app:
    # State management
    quiz_state = gr.State({})
    
    # Start screen
    with gr.Column(visible=True, elem_id="start-container") as start_container:
        gr.Markdown("# 🏗️ Building Construction Quiz")
        gr.Markdown("Test your knowledge of construction techniques and architectural history")
        name_input = gr.Textbox(label="Enter your name", placeholder="John Doe", value="Construction Pro")
        start_btn = gr.Button("Start Quiz", variant="primary")
    
    # Quiz screen
    with gr.Column(visible=False) as quiz_container:
        questions_column = gr.Column()
        submit_button = gr.Button()
    
    # Results screen
    results_container = gr.HTML(visible=False)
    
    # Event handling
    start_btn.click(
        start_quiz,
        inputs=[name_input],
        outputs=[quiz_state, quiz_container, start_container, questions_column, submit_button]
    )
    
    submit_button.click(
        lambda *answers, state: {**state, **{f"answer_{i}": a for i, a in enumerate(answers)}},
        inputs=[questions_column, quiz_state],
        outputs=[quiz_state]
    ).then(
        evaluate_answers,
        inputs=[quiz_state],
        outputs=[results_container, quiz_container]
    )

if __name__ == "__main__":
    app.launch()