Update app.py

app.py

@@ -6,7 +6,6 @@ from datetime import datetime, timedelta, timezone
 members = ["かほ", "さや", "こず", "るり", "めぐ", "つづ", "ぎん", "すず", "ひめ", "せら", "いず", "さち"]
 
 def get_personal_daily_oracle(device_id):
-    # device_idが空の場合はセッション固定を防ぐためデフォルト値を使用
     seed_base = device_id if device_id else "default_fate"
     jst = timezone(timedelta(hours=9))
     today_str = datetime.now(jst).strftime("%Y-%m-%d")
@@ -24,7 +23,6 @@ def get_personal_daily_oracle(device_id):
     )
     peace_msg = "これにより、不毛なカップリング論争は終結しました。"
     
-    # [結果HTML, 終結文, 共有ボタン表示, 案内文表示]
     return oracle_html, peace_msg, gr.update(visible=True), gr.update(visible=True)
 
 # JS: 状態チェックと復元
@@ -36,7 +34,6 @@ function(deviceId) {
 
     if (lastDraw === today && lastPair) {
         alert("本日の神託は既に下されています。\\n明日の更新まで、今の思想を維持しなさい。");
-        // 戻り値を4つ（HTML, 終結文, 共有ボタン, 案内文）に対応
         return [lastPair, "これにより、不毛なカップリング論争は終結しました。", { "visible": true, "__type__": "update" }, { "visible": true, "__type__": "update" }];
     } 
     
@@ -47,7 +44,7 @@ function(deviceId) {
 
 # JS: 結果の保存
 js_save_result = """
-function(oracleHtml, peaceMsg, shareBtn, instructMsg) {
+function(oracleHtml, peaceMsg, shareBtn, resultBox) {
     if (oracleHtml && oracleHtml.includes("本日の神託")) {
         localStorage.setItem('lastPairText', oracleHtml);
     }
@@ -78,6 +75,7 @@ function() {
 custom_css = """
 .gradio-container { max-width: 600px !important; text-align: center !important; }
 
+/* 1. 最上部の空白を40pxに設定 */
 .center-content { 
     display: flex !important; 
     flex-direction: column !important; 
@@ -85,12 +83,14 @@ custom_css = """
     padding-top: 40px !important; 
 }
 
+/* 2. タイトルと教義の間を-5px */
 h1 { 
     margin-top: 0px !important;
     margin-bottom: -5px !important; 
     font-size: 32px !important; 
 }
 
+/* 3. 教義と結果の間を-5px */
 #doctrine { 
     font-size: 1.5em !important; 
     line-height: 1.4 !important; 
@@ -99,6 +99,7 @@ h1 {
     text-align: center !important;
 }
 
+/* 4. 結果ボックスと終結文の間を-5px */
 #oracle-box {
     color: #000 !important;
     background: #fff !important;
@@ -112,6 +113,7 @@ h1 {
     margin: 0px auto -5px auto !important; 
 }
 
+/* 5. 終結文とボタンの間を-5px */
 #peace-msg { 
     font-size: 20px !important; 
     font-weight: bold !important; 
@@ -119,6 +121,7 @@ h1 {
     margin: 0px auto -5px auto !important; 
 }
 
+/* 6. ボタン同士の間を-5px */
 .action-btn { 
     font-size: 26px !important; 
     font-weight: bold !important; 
@@ -129,28 +132,17 @@ h1 {
 
 #draw-btn { margin: 0px auto -5px auto !important; }
 #share-btn { margin: 0px auto 10px auto !important; }
-
-/* 案内文のスタイル：他のテキストと同様に黒く表示 */
-#instruct-msg {
-    font-size: 18px !important;
-    font-weight: bold !important;
-    color: #000 !important;
-    margin: 0px auto 10px auto !important;
-    line-height: 1.5 !important;
-    background: transparent !important;
-    border: none !important;
-}
 """
 
 with gr.Blocks(title="蓮ノ空聖書正典", css=custom_css, theme=gr.themes.Monochrome()) as demo:
-    # 修正ポイント: gr.State から gr.Textbox(visible=False) に変更
+    # 修正箇所: gr.State() を gr.Textbox(visible=False) に変更
     device_id_storage = gr.Textbox(visible=False)
 
     demo.load(None, None, device_id_storage, js="""
     () => {
         let id = localStorage.getItem('cp_oracle_device_id');
         if(!id) {
-            id = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
+            id = Math.random().toString(36).substring(2, 15);
             localStorage.setItem('cp_oracle_device_id', id);
         }
         return id;
@@ -166,24 +158,16 @@ with gr.Blocks(title="蓮ノ空聖書正典", css=custom_css, theme=gr.themes.Mo
         peace_display = gr.Markdown(elem_id="peace-msg")
         
         draw_btn = gr.Button("神託を受ける", variant="primary", elem_id="draw-btn", elem_classes="action-btn")
-        
         share_btn = gr.Button("信仰を広める", variant="secondary", elem_id="share-btn", elem_classes="action-btn", visible=False)
-        
-        # 案内文の追加
-        instruct_msg = gr.HTML(
-            "画像を添えて<br>その導きを世界へ示しなさい。", 
-            elem_id="instruct-msg", 
-            visible=False
-        )
 
     draw_btn.click(
         fn=get_personal_daily_oracle,
         inputs=[device_id_storage],
-        outputs=[result_display, peace_display, share_btn, instruct_msg],
+        outputs=[result_display, peace_display, share_btn, result_display],
         js=js_logic
     ).then(
         fn=None,
-        inputs=[result_display, peace_display, share_btn, instruct_msg],
+        inputs=[result_display, peace_display, share_btn, result_display],
         outputs=None,
         js=js_save_result
     )