app.py

import gradio as gr
import random

# ----------------------------------------------------------
# 1) ค่าเริ่มต้นหมวดละ 20 คำ (หนูน้อยสามารถแก้ไข/เพิ่มได้)
# ----------------------------------------------------------
default_characters = [
    "cat", "dog", "dragon", "fairy", "robot", "princess", "wizard", "unicorn", "fox", "lion",
    "mermaid", "ninja", "pirate", "turtle", "eagle", "bear", "elf", "ghost", "vampire", "knight"
]

default_adjectives = [
    "cute", "powerful", "magical", "strange", "bright", "happy", "funny", "glowing", "giant", "tiny",
    "shiny", "lovely", "mysterious", "wild", "brave", "silly", "energetic", "colorful", "gentle", "playful"
]

default_activities = [
    "dancing", "jumping", "playing soccer", "eating ice cream", "singing", "flying around", "exploring", "daydreaming",
    "reading a book", "painting a picture", "riding a bike", "playing guitar", "doing magic tricks", "spinning in circles",
    "performing on stage", "climbing a tree", "playing with toys", "laughing loudly", "telling jokes", "juggling"
]

default_styles = [
    "cartoon style", "realistic style", "pastel style", "anime style", "pop art style", "watercolor style", "pixel art style",
    "chibi style", "fantasy style", "comic style", "steampunk style", "gothic style", "cyberpunk style", "vaporwave style",
    "claymation style", "chalkboard style", "paper craft style", "3D style", "collage style", "neon style"
]

default_locations = [
    "in a castle", "on the moon", "under the sea", "in a flower garden", "in snowy mountains", "in a candy land",
    "in a magical forest", "on a floating island", "in a secret cave", "on a pirate ship", "in a haunted house",
    "at a carnival", "in a giant library", "at a busy marketplace", "in an underwater city", "in an alien planet",
    "on a rainbow bridge", "in a dream world", "on a cloud kingdom", "in a crystal cave"
]


# ----------------------------------------------------------
# 2) ฟังก์ชันสุ่มคำ + สร้างประโยคพร้อมแกรมม่าง่ายๆ
# ----------------------------------------------------------
def generate_wonder_prompt(
    characters_text, adjectives_text, activities_text, styles_text, locations_text
):
    """
    1. แปลง Textbox เป็น List
    2. สุ่มอย่างละ 1 คำ
    3. ประกอบเป็นประโยคที่มีโครงสร้างแกรมม่าง่าย ๆ

    ตัวอย่างโครงสร้าง:
    "Look at that [adjective] [character] who is [activity] in [style] [location]!"
    """

    # แยกคำด้วย ',' แล้วตัดช่องว่าง
    chars = [w.strip() for w in characters_text.split(",") if w.strip()]
    adjs = [w.strip() for w in adjectives_text.split(",") if w.strip()]
    acts = [w.strip() for w in activities_text.split(",") if w.strip()]
    stys = [w.strip() for w in styles_text.split(",") if w.strip()]
    locs = [w.strip() for w in locations_text.split(",") if w.strip()]

    # ถ้ามีหมวดไหนไม่มีคำเลย ให้แจ้งเตือน
    if not chars or not adjs or not acts or not stys or not locs:
        return "หนูน้อยจ๊ะ~ ใส่คำในแต่ละหมวดก่อนนะ (อย่าให้ว่างนะจ๊ะ)!"

    # สุ่ม
    c = random.choice(chars)   # character
    a = random.choice(adjs)    # adjective
    t = random.choice(acts)    # activity
    s = random.choice(stys)    # style
    l = random.choice(locs)    # location

    # สร้างประโยค
    # เช่น "Look at that cute dragon who is dancing in cartoon style under the sea!"
    prompt_sentence = f"Look at that {a} {c} who is {t} in {s} {l}!"
    return prompt_sentence


# ----------------------------------------------------------
# 3) สร้าง UI (Gradio) + ตกแต่งเล็กน้อย
# ----------------------------------------------------------
custom_css = """
body {
    background-color: #FFFAF0;
    font-family: "Comic Sans MS", cursive;
}

#title {
    color: #FF6F91;
    text-align: center;
    font-size: 2.1rem;
    margin-top: 20px;
    margin-bottom: 10px;
    font-weight: bold;
}

#subtitle {
    text-align: center;
    color: #555;
    margin-bottom: 30px;
}

.magic-btn {
    background-color: #F8B400;
    border: 2px solid #FF9800;
    font-weight: bold;
    font-size: 1.1rem;
    padding: 10px 20px;
    border-radius: 10px;
}
.magic-btn:hover {
    background-color: #FFCA28;
}

#prompt-box {
    font-size: 20px;
    min-height: 80px;
    text-align: center;
    border: 2px solid #ccc;
    border-radius: 10px;
    padding: 10px;
}

.game-desc {
    border: 2px solid #FFE0B2;
    background-color: #FFF3E0;
    padding: 15px;
    border-radius: 12px;
    margin-bottom: 20px;
}
"""

with gr.Blocks(css=custom_css) as demo:
    gr.Markdown("<h1 id='title'>ZenityX Magical Prompt Adventure</h1>")
    
    gr.Markdown(
        """
        <div id='subtitle'>
            <p>ยินดีต้อนรับนะจ๊ะ หนูน้อย! พร้อมจะเปิดโลกจินตนาการสุดแฟนตาซีกับ ZenityX แล้วหรือยัง?</p>
        </div>
        <div class="game-desc">
            <p>
            <strong>วิธีเล่นง่ายมาก:</strong><br>
            1) แต่ละหมวดมีคำมาตรฐาน 20 คำ (คั่นด้วยจุลภาค) หนูน้อยปรับ/เพิ่มคำได้นะ ถ้าอยากได้แบบอลังการสุด ๆ <br>
            2) กดปุ่ม "<strong>สร้างพรอมพ์สุดวิเศษ!</strong>" แล้วพี่ระบบจะสุ่มรวมคำตามหมวด พร้อมเรียบเรียงประโยคให้อัตโนมัติ <br>
            3) นำพรอมพ์ไปใช้กับ AI เจนภาพ (เช่น Stable Diffusion) หรือแค่ดูชื่อก็สนุกแล้ว! 
            </p>
        </div>
        """,
        visible=True
    )

    # Textbox แต่ละหมวด (ค่าเริ่มต้น = 20 คำ)
    character_box = gr.Textbox(
        label="Character (ตัวละคร)",
        value=", ".join(default_characters),
        lines=4
    )
    adjective_box = gr.Textbox(
        label="Adjective (คำคุณศัพท์)",
        value=", ".join(default_adjectives),
        lines=4
    )
    activity_box = gr.Textbox(
        label="Activity (กิจกรรม)",
        value=", ".join(default_activities),
        lines=4
    )
    style_box = gr.Textbox(
        label="Style (รูปแบบ/สไตล์ศิลปะ)",
        value=", ".join(default_styles),
        lines=4
    )
    location_box = gr.Textbox(
        label="Location (สถานที่)",
        value=", ".join(default_locations),
        lines=4
    )

    # ปุ่ม "สร้างพรอมพ์สุดวิเศษ!"
    magic_button = gr.Button("🔮 สร้างพรอมพ์สุดวิเศษ!", elem_classes="magic-btn")

    # กล่องแสดงผล
    prompt_output = gr.Textbox(
        label="Prompt สุดท้าย",
        interactive=False,
        elem_id="prompt-box"
    )

    # เมื่อกดปุ่ม -> เรียก generate_wonder_prompt
    magic_button.click(
        fn=generate_wonder_prompt,
        inputs=[
            character_box,
            adjective_box,
            activity_box,
            style_box,
            location_box
        ],
        outputs=prompt_output
    )

    # เมื่อโหลดครั้งแรก อยากให้แสดงผลสักอย่าง (อาจเป็น "ยังไม่มี Prompt")
    def initial_text(*args):
        return "ยังไม่มี Prompt ลองกด 'สร้างพรอมพ์สุดวิเศษ!' ดูสิจ๊ะ!"

    demo.load(
        fn=initial_text,
        inputs=[],
        outputs=prompt_output
    )

demo.launch()