Update app.py

app.py

@@ -1,59 +1,208 @@
-import os, html
+import os, html, random
 import gradio as gr
 from openai import OpenAI
 
+# ===== 基础配置 =====
 API_KEY = os.getenv("OPENAI_API_KEY")
 MODEL_NAME = "gpt-4o-mini"
 client = OpenAI(api_key=API_KEY)
 
+# ===== 系统提示（可爱名字 + 真实名言，灵感优先）=====
 SYSTEM_PROMPT = """You are a playful, high-creativity pet name generator.
 Goal: Produce EXACTLY ONE cute, kid-pronounceable pet name + one authentic quote line.
+
+Creative balance:
+- Inspiration source (山海经 / 迪士尼 / 哈利波特 / 生活) drives the concept (~70%).
+- User inputs (species/appearance/personality/gender) refine the vibe (~30%).
+
+NAME rules (kid-friendly):
+- Cute, easy to call; allow coinages that sound natural.
+- Chinese: 1–2 simple characters; English: 1–2 syllables; Japanese: 2–3 mora; Korean: 2 simple syllables; French: 1–2 syllables with soft endings.
+- Output in requested language (Chinese/English/Japanese/Korean/French).
+- ONE short meaning (≤12 words).
+
+QUOTE rules (must be real):
+- ONE short, warm, authentic quote about animals/love/companionship/playfulness with attribution (e.g., — Anatole France).
+- Translate quote text into the requested language if needed; keep attribution name in Latin script.
+
+STRICT OUTPUT (exactly two lines):
+Name — short meaning
+Quote: “...” — Attribution
 """
 
 def build_prompt(species, look, personality, gender, language, inspiration):
     return f"""
 Requested language: {language}
-Primary inspiration source: {inspiration}
-Secondary refinements:
+Primary inspiration: {inspiration}
+Secondary refinements (may be empty):
 - Species: {species or '(unspecified)'}
 - Appearance: {look or '(unspecified)'}
 - Personality: {personality or '(unspecified)'}
 - Gender: {gender}
+
 Task:
-1) Generate one cute pet name
-2) Provide one authentic quote
+1) Create EXACTLY ONE cute, kid-pronounceable pet name (≤12-word meaning).
+2) Then output ONE authentic, warm animal-related quote with attribution.
+Keep both lines in {language}. Inspiration ~70%, traits ~30%.
 """
 
-def generate_name(species, look, personality, gender, language, inspiration):
+# 真实名言兜底（防止偶尔没返回 quote 行）
+FALLBACK_QUOTES = {
+    "English": [
+        ('"Until one has loved an animal, a part of one\'s soul remains unawakened."', "Anatole France"),
+        ('"An animal\'s eyes have the power to speak a great language."', "Martin Buber"),
+        ('"Animals are such agreeable friends—they ask no questions; they pass no criticisms."', "George Eliot"),
+    ],
+    "中文": [
+        ('“一个人若未曾爱过动物，他的灵魂尚未苏醒。”', "Anatole France"),
+        ('“动物的眼睛自有它们的语言。”', "Martin Buber"),
+        ('“动物是极好的朋友——它们不发问，也不挑剔。”', "George Eliot"),
+    ],
+    "日本語": [
+        ('「動物を愛したことのない者の魂は、まだ目覚めていない。」', "Anatole France"),
+        ('「動物の瞳は偉大な言葉を語る力を持つ。」', "Martin Buber"),
+        ('「動物は実に快い友である——問いも批判もない。」', "George Eliot"),
+    ],
+    "한국어": [
+        ('“동물을 사랑해 보지 않은 영혼은 아직 깨어나지 않았다.”', "Anatole France"),
+        ('“동물의 눈에는 위대한 언어가 담겨 있다.”', "Martin Buber"),
+        ('“동물은 참으로 상냥한 친구다—묻지도 비난하지도 않는다.”', "George Eliot"),
+    ],
+    "Français": [
+        ("« Jusqu'à ce qu'on ait aimé un animal, une partie de notre âme reste endormie. »", "Anatole France"),
+        ("« Les yeux d’un animal ont le pouvoir de parler un grand langage. »", "Martin Buber"),
+        ("« Les animaux sont de si agréables amis — ils ne posent aucune question et ne font aucune critique. »", "George Eliot"),
+    ],
+}
+
+def _fallback_quote(language: str) -> str:
+    lst = FALLBACK_QUOTES.get(language, FALLBACK_QUOTES["English"])
+    text, author = random.choice(lst)
+    return f'Quote: {text} — {author}'
+
+def _ensure_two_lines(content: str, language: str):
+    if not content:
+        return None, None
+    lines = [ln.strip() for ln in content.splitlines() if ln.strip()]
+    name_line = lines[0] if lines else ""
+    quote_line = next((ln for ln in lines[1:] if ln.lower().startswith("quote:")), None)
+    if not quote_line:
+        quote_line = _fallback_quote(language)
+    return name_line, quote_line
+
+def generate_modal_html(species, look, personality, gender, language, inspiration):
+    """返回一个HTML覆盖层(伪弹窗)，不使用 js 参数，兼容所有版本。"""
     try:
-        prompt = build_prompt(species, look, personality, gender, language, inspiration)
+        prompt = build_prompt(
+            (species or "").strip(),
+            (look or "").strip(),
+            (personality or "").strip(),
+            gender, language, inspiration
+        )
         resp = client.chat.completions.create(
             model=MODEL_NAME,
-            temperature=0.9,
+            temperature=0.95,
+            top_p=0.95,
             max_tokens=280,
             messages=[
                 {"role": "system", "content": SYSTEM_PROMPT},
-                {"role": "user", "content": prompt}
+                {"role": "user",   "content": prompt}
             ]
         )
         raw = (resp.choices[0].message.content or "").strip()
-        return raw
+        name_line, quote_line = _ensure_two_lines(raw, language)
+        if not name_line:
+            name_line = "（没有生成内容）"
+        if not quote_line:
+            quote_line = _fallback_quote(language)
+
+        # 构造覆盖层HTML（带关闭按钮，纯CSS/HTML，不依赖 .click 的 js 参数）
+        name_html = html.escape(name_line)
+        quote_html = html.escape(quote_line)
+        return f"""
+        <div class="pm-overlay" onclick="this.remove()">
+          <div class="pm-modal" onclick="event.stopPropagation()">
+            <div class="pm-modal-title">Pawfect Match</div>
+            <div class="pm-modal-body">
+              <div class="pm-name">{name_html}</div>
+              <div class="pm-quote">{quote_html}</div>
+            </div>
+            <div class="pm-modal-actions">
+              <button class="pm-btn" onclick="document.querySelector('.pm-overlay')?.remove()">关闭</button>
+            </div>
+          </div>
+        </div>
+        """
     except Exception as e:
-        return f"⚠️ 出错：{html.escape(str(e))}"
+        err = html.escape(str(e))
+        return f"""
+        <div class="pm-overlay" onclick="this.remove()">
+          <div class="pm-modal" onclick="event.stopPropagation()">
+            <div class="pm-modal-title">Pawfect Match</div>
+            <div class="pm-modal-body">
+              <div class="pm-name">⚠️ 出错</div>
+              <div class="pm-quote">{err}</div>
+            </div>
+            <div class="pm-modal-actions">
+              <button class="pm-btn" onclick="document.querySelector('.pm-overlay')?.remove()">关闭</button>
+            </div>
+          </div>
+        </div>
+        """
 
+# ===== 主题 & CSS =====
 theme = gr.themes.Soft(primary_hue="pink", secondary_hue="cyan", neutral_hue="slate")
+CUSTOM_CSS = """
+:root{
+  --pm-bg:#faf7fb; --pm-surface:#ffffff; --pm-border:#eddcf3; --pm-text:#111; --pm-muted:#6b7280;
+  --pm-accent:#ff4fa3;
+}
+body, .gradio-container{ background:var(--pm-bg) !important; }
+.pm-topbar{
+  display:flex; align-items:center; justify-content:space-between;
+  padding:12px; background:linear-gradient(90deg,#ffe8f3,#e8fbff);
+  border-radius:12px; border:1px solid var(--pm-border);
+}
+.pm-brand{ display:flex; align-items:center; gap:10px; }
+.pm-logo{ font-size:24px; }
+.pm-title{ font-weight:800; font-size:20px; color:var(--pm-text); }
 
-with gr.Blocks(title="Pawfect Match", theme=theme) as demo:
-    # 顶栏（只保留标题，没有副标题）
+/* 覆盖层(伪弹窗) */
+.pm-overlay{
+  position:fixed; inset:0; background:rgba(0,0,0,.35);
+  display:flex; align-items:center; justify-content:center; z-index:9999;
+}
+.pm-modal{
+  width:min(560px, 92vw); background:var(--pm-surface); border:1px solid var(--pm-border);
+  border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.18);
+  overflow:hidden; animation:pm-pop .14s ease-out;
+}
+.pm-modal-title{
+  padding:14px 16px; font-weight:800; border-bottom:1px solid var(--pm-border);
+}
+.pm-modal-body{ padding:16px; }
+.pm-name{ font-weight:800; font-size:22px; margin-bottom:8px; color:#111; }
+.pm-quote{ font-weight:600; font-size:14px; color:#374151; opacity:.95; }
+.pm-modal-actions{ padding:12px 16px; display:flex; justify-content:flex-end; gap:8px; border-top:1px solid var(--pm-border); }
+.pm-btn{
+  padding:10px 14px; border-radius:10px; border:1px solid var(--pm-border); background:var(--pm-surface);
+  cursor:pointer; font-weight:700;
+}
+.pm-btn:hover{ border-color: var(--pm-accent); color: var(--pm-accent); }
+
+@keyframes pm-pop{ from{ transform:translateY(6px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
+"""
+
+# ===== 界面 =====
+with gr.Blocks(title="Pawfect Match", theme=theme, css=CUSTOM_CSS) as demo:
+    # 顶栏（去掉副标题）
     gr.HTML("""
-      <div style="display:flex;align-items:center;justify-content:space-between;
-                  padding:12px;background:linear-gradient(90deg,#ffe8f3,#e8fbff);
-                  border-radius:12px;border:1px solid #eddcf3;">
-        <div style="display:flex;align-items:center;gap:10px;">
-          <div style="font-size:24px;">🐾</div>
-          <div style="font-weight:800;font-size:20px;color:#111;">Pawfect Match</div>
+      <div class="pm-topbar">
+        <div class="pm-brand">
+          <div class="pm-logo">🐾</div>
+          <div class="pm-title">Pawfect Match</div>
         </div>
-        <div style="color:#6b7280;font-size:12px;">v1.6</div>
+        <div style="color:#6b7280;font-size:12px;">v1.7</div>
       </div>
     """)
 
@@ -70,28 +219,18 @@ with gr.Blocks(title="Pawfect Match", theme=theme) as demo:
         btn = gr.Button("✨ 起名", variant="primary")
         clear_btn = gr.Button("清空", variant="secondary")
 
-    # 点击生成后，不输出到文本框，而是触发前端弹窗
-    out = gr.Textbox(visible=False)
+    # 输出：只放一个隐藏的 HTML 容器，点“起名”时返回覆盖层 HTML
+    modal = gr.HTML(visible=True, value="")  # 初始为空，不显示
 
     btn.click(
-        generate_name,
+        generate_modal_html,
         inputs=[species, look, personality, gender, language, inspiration],
-        outputs=out,
-        js="""
-        (result) => {
-            if (result) {
-                alert(result);
-            } else {
-                alert("没有生成结果，请重试。");
-            }
-            return result;
-        }
-        """
+        outputs=modal
     )
 
     clear_btn.click(
-        lambda: ("","","","male","English","生活"),
-        outputs=[species, look, personality, gender, language, inspiration]
+        lambda: ("","","","male","English","生活",""),
+        outputs=[species, look, personality, gender, language, inspiration, modal]
     )
 
 if __name__ == "__main__":