app.py

# Import necessary libraries
import gradio as gr
import random

# List of 5-letter raga names for RagaDle
raga_names = [
    "thodi", "durga", "atana", "manji", "behag", "yaman", "bhair", "begad"
]

# Global state variables
answer = random.choice(raga_names).lower()
current_guess = ""
attempts = 0
grid_content = [[{"letter": "", "color": ""} for _ in range(5)] for _ in range(6)]

def generate_grid_html():
    """Generate HTML to render the current state of the grid."""
    html_content = ""
    for row in grid_content:
        row_html = "".join(
            f"<div class='grid-cell {entry['color']}'>{entry['letter'].upper()}</div>"
            for entry in row
        )
        html_content += f"<div class='grid-row'>{row_html}</div>"
    return html_content

def submit_guess():
    """Submit the guess, update the grid, and apply color coding."""
    global current_guess, grid_content, attempts, answer

    feedback = [{"letter": char, "color": "grey"} for char in current_guess]
    answer_copy = list(answer)  # Copy of answer to manage repeated letters correctly

    # First pass: Check for exact matches (green)
    for i, char in enumerate(current_guess):
        if char == answer[i]:
            feedback[i]["color"] = "green"
            answer_copy[i] = None

    # Second pass: Check for misplaced matches (yellow)
    for i, char in enumerate(current_guess):
        if feedback[i]["color"] != "green" and char in answer_copy:
            feedback[i]["color"] = "yellow"
            answer_copy[answer_copy.index(char)] = None

    # Update the grid with feedback
    if attempts < 6:
        grid_content[attempts] = feedback
        attempts += 1

    if current_guess == answer:
        return generate_grid_html(), f"🎉 Correct! The raga was {answer.upper()}!"
    elif attempts == 6:
        return generate_grid_html(), f"😢 Game Over! The raga was {answer.upper()}."

    current_guess = ""
    return generate_grid_html(), "Enter your next guess."

def handle_key_press(key):
    """Handle key presses from the virtual keyboard."""
    global current_guess

    if key == "Backspace":
        current_guess = current_guess[:-1]
    elif len(current_guess) < 5 and key.isalpha():
        current_guess += key.lower()

    if len(current_guess) == 5:
        return submit_guess()

    return generate_grid_html(), f"Current guess: {current_guess}"

def restart_game():
    """Reset the game to the initial state."""
    global answer, current_guess, attempts, grid_content
    answer = random.choice(raga_names).lower()
    current_guess = ""
    attempts = 0
    grid_content = [[{"letter": "", "color": ""} for _ in range(5)] for _ in range(6)]
    return generate_grid_html(), "Game restarted. Enter a 5-letter raga name."

def reveal_answer():
    """Reveal the answer to the user."""
    return generate_grid_html(), f"The raga was: {answer.upper()}."

# Gradio interface with CSS for layout
with gr.Blocks(css="""
    .grid-row { display: flex; justify-content: center; margin-bottom: 5px; }
    .grid-cell { width: 50px; height: 50px; border: 1px solid #ccc; margin: 2px;
                 display: flex; align-items: center; justify-content: center;
                 font-size: 20px; font-weight: bold; text-transform: uppercase; }
    .green { background-color: lightgreen; }
    .yellow { background-color: gold; }
    .grey { background-color: lightgrey; }
""") as demo:
    gr.Markdown("# 🎶 RagaDle: Guess the Raga!")
    gr.Markdown("Test your knowledge of Carnatic and Hindustani music by guessing the 5-letter raga!")
    gr.Markdown("**Developed by [Venkat](https://www.linkedin.com/in/venkataraghavansrinivasan/)**")

    grid_display = gr.HTML(generate_grid_html())
    status_display = gr.Textbox("Enter your next guess.", interactive=False)

    with gr.Row():
        for key in "qwertyuiop":
            gr.Button(key).click(lambda k=key: handle_key_press(k), outputs=[grid_display, status_display])

    with gr.Row():
        for key in "asdfghjkl":
            gr.Button(key).click(lambda k=key: handle_key_press(k), outputs=[grid_display, status_display])

    with gr.Row():
        for key in "zxcvbnm":
            gr.Button(key).click(lambda k=key: handle_key_press(k), outputs=[grid_display, status_display])

    with gr.Row():
        gr.Button("Backspace").click(lambda: handle_key_press("Backspace"), outputs=[grid_display, status_display])
        gr.Button("Restart Game").click(restart_game, outputs=[grid_display, status_display])
        gr.Button("Reveal Answer").click(reveal_answer, outputs=[grid_display, status_display])

# Launch the Gradio app
demo.launch()