Update app.py

app.py

@@ -5,7 +5,6 @@ import requests
 import os
 import re
 import io
-import json
 import time
 from PIL import Image, ImageChops
 
@@ -13,12 +12,11 @@ from PIL import Image, ImageChops
 GEMINI_KEY = os.environ.get("GEMINI_API_KEY")
 CMS_SERVICE_ID = os.environ.get("MICROCMS_SERVICE_ID")
 CMS_API_KEY = os.environ.get("MICROCMS_API_KEY")
-ADMIN_PASSWORD = os.environ.get("ADMIN_PASSWORD", "1234")  # Secretsに移行、フォールバックあり
+ADMIN_PASSWORD = os.environ.get("ADMIN_PASSWORD", "1234")
 AUTHOR_LIST = ["にき", "かん", "なごみ", "蜜柑餅"]
 SPACE_URL = "https://nagomi-sugarheart-wasemas9thblogs.hf.space"
 ARTICLES_PER_PAGE = 10
 
-# --- テンプレート定義 ---
 TEMPLATES = {
     "テンプレートなし": "",
     "📅 イベントレポート": """<h2>イベント概要</h2>
@@ -63,18 +61,13 @@ def render_html(html, height=600):
     wrapped = f"""
     <html><head><style>
         body {{
-            margin: 0;
-            padding: 0;
+            margin: 0; padding: 0;
             font-family: sans-serif;
             font-size: 16px;
             color: #111;
             word-break: break-word;
         }}
-        img {{
-            max-width: 100%;
-            height: auto;
-            display: block;
-        }}
+        img {{ max-width: 100%; height: auto; display: block; }}
         p {{ margin: 0.5em 0; }}
         h1,h2,h3 {{ margin: 0.8em 0 0.4em; }}
     </style></head>
@@ -82,6 +75,26 @@ def render_html(html, height=600):
     """
     components.html(wrapped, height=height, scrolling=True)
 
+# --- クリップボードコピーボタン ---
+def copy_button(text, key):
+    escaped = text.replace('`', '\\`').replace('\\', '\\\\')
+    components.html(f"""
+    <button onclick="navigator.clipboard.writeText(`{escaped}`).then(()=>{{
+        this.innerText='✅ コピー済み';
+        setTimeout(()=>this.innerText='📋 コピー', 1500);
+    }})"
+    style="
+        background:#4A90E2;
+        color:white;
+        border:none;
+        border-radius:6px;
+        padding:6px 12px;
+        cursor:pointer;
+        font-size:13px;
+        width:100%;
+    ">📋 コピー</button>
+    """, height=40)
+
 def upload_image_to_microcms(image_file, max_width=1200):
     try:
         img = Image.open(image_file)
@@ -122,7 +135,6 @@ def upload_image_to_microcms(image_file, max_width=1200):
         st.error(f"画像アップロードエラー: {e}")
         return None
 
-# --- ページネーション対応の記事取得 ---
 def get_articles(limit=ARTICLES_PER_PAGE, offset=0):
     if not CMS_SERVICE_ID or not CMS_API_KEY:
         return [], 0
@@ -137,7 +149,6 @@ def get_articles(limit=ARTICLES_PER_PAGE, offset=0):
     except:
         return [], 0
 
-# --- 全件取得（管理画面用）---
 def get_all_articles():
     if not CMS_SERVICE_ID or not CMS_API_KEY:
         return []
@@ -171,11 +182,10 @@ if "id" in params:
         st.title(article.get("title", "無題"))
         st.caption(f"👤 {article.get('author')} | 📅 {article.get('publishedAt')[:10]}")
         st.divider()
-
         content = clean_quill_html(article.get("content", ""))
         render_html(content, height=800)
-
         st.divider()
+
         share_url = f"{SPACE_URL}?id={article_id}"
         st.write("🔗 固定リンク:")
         st.code(share_url)
@@ -197,9 +207,6 @@ else:
 
     tab_view, tab_manage = st.tabs(["📖 ブログを読む", "🛠️ 記事の管理・投稿"])
 
-    # =====================
-    # 閲覧タブ
-    # =====================
     with tab_view:
         st.title("サークル活動ブログ")
         search_col1, search_col2 = st.columns(2)
@@ -209,11 +216,8 @@ else:
             search_author_list = ["全員"] + AUTHOR_LIST
             author_filter = st.selectbox("👤 著者で絞り込み", search_author_list, key="search_author")
 
-        # ページネーション用セッション
         if "view_page" not in st.session_state:
             st.session_state.view_page = 0
-
-        # 検索時はページリセット
         if "last_search" not in st.session_state:
             st.session_state.last_search = ""
         if search_query != st.session_state.last_search:
@@ -221,13 +225,12 @@ else:
             st.session_state.last_search = search_query
 
         offset = st.session_state.view_page * ARTICLES_PER_PAGE
-        articles, total_count = get_articles(limit=ARTICLES_PER_PAGE, offset=offset)
 
-        # 検索・フィルタが入っている場合は全件取得に切り替え
         if search_query or author_filter != "全員":
             articles, _ = get_articles(limit=100, offset=0)
+        else:
+            articles, total_count = get_articles(limit=ARTICLES_PER_PAGE, offset=offset)
 
-        displayed = 0
         for a in articles:
             title = a.get("title", "無題")
             content_html = a.get("content", "")
@@ -254,11 +257,9 @@ else:
                         st.query_params.id = a["id"]
                         st.rerun()
                     st.divider()
-                displayed += 1
 
-        # ページネーションボタン（検索なしの場合のみ）
         if not search_query and author_filter == "全員":
-            total_pages = -(-total_count // ARTICLES_PER_PAGE)  # 切り上げ
+            total_pages = -(-total_count // ARTICLES_PER_PAGE)
             if total_pages > 1:
                 st.caption(f"{total_count}件中 {offset+1}〜{min(offset+ARTICLES_PER_PAGE, total_count)}件を表示")
                 col_prev, col_page, col_next = st.columns([1, 2, 1])
@@ -275,9 +276,6 @@ else:
                             st.session_state.view_page += 1
                             st.rerun()
 
-    # =====================
-    # 管理タブ
-    # =====================
     with tab_manage:
         st.title("秘密の管理画面")
         password = st.text_input("合言葉", type="password")
@@ -285,7 +283,6 @@ else:
         if password == ADMIN_PASSWORD:
             st.success("ログイン成功！")
 
-            # セッションステート初期化
             if "edit_id" not in st.session_state: st.session_state.edit_id = None
             if "edit_data" not in st.session_state: st.session_state.edit_data = {"title": "", "author": AUTHOR_LIST[0], "content": ""}
             if "editor_mode" not in st.session_state: st.session_state.editor_mode = "rich"
@@ -296,12 +293,13 @@ else:
             if "autosave_html" not in st.session_state: st.session_state.autosave_html = ""
             if "autosave_title" not in st.session_state: st.session_state.autosave_title = ""
             if "autosave_time" not in st.session_state: st.session_state.autosave_time = None
+            # ✅ Quillの強制再初期化用カウンター
+            if "quill_key" not in st.session_state: st.session_state.quill_key = 0
 
             st.divider()
             mode_label = f"📝 記事の編集 (ID: {st.session_state.edit_id})" if st.session_state.edit_id else "✍️ 新規記事の投稿"
             st.subheader(mode_label)
 
-            # --- 自動保存の復元バナー ---
             if st.session_state.autosave_html and not st.session_state.working_html:
                 saved_time = st.session_state.autosave_time or "不明"
                 st.info(f"💾 自動保存された下書きがあります（{saved_time}）")
@@ -310,6 +308,7 @@ else:
                     if st.button("📂 復元する"):
                         st.session_state.working_html = st.session_state.autosave_html
                         st.session_state.edit_data["title"] = st.session_state.autosave_title
+                        st.session_state.quill_key += 1
                         st.rerun()
                 with col_r2:
                     if st.button("🗑️ 破棄する"):
@@ -318,7 +317,6 @@ else:
                         st.session_state.autosave_time = None
                         st.rerun()
 
-            # --- タイトル・著者 ---
             col_t, col_a = st.columns([2, 1])
             with col_t:
                 title_input = st.text_input("記事タイトル", value=st.session_state.edit_data["title"])
@@ -329,7 +327,7 @@ else:
                     def_auth_idx = 0
                 author_select = st.selectbox("著者", AUTHOR_LIST, index=def_auth_idx)
 
-            # --- テンプレート選択 ---
+            # --- テンプレート ---
             st.divider()
             st.subheader("📋 テンプレート")
             template_choice = st.selectbox("テンプレートを選択", list(TEMPLATES.keys()), key="template_select")
@@ -337,6 +335,8 @@ else:
                 selected_html = TEMPLATES[template_choice]
                 if selected_html:
                     st.session_state.working_html = selected_html
+                    # ✅ Quillを強制再初期化して即反映
+                    st.session_state.quill_key += 1
                     st.rerun()
                 else:
                     st.warning("テンプレートなしが選択されています")
@@ -374,7 +374,7 @@ else:
 
             # --- 差し込み画像 ---
             st.subheader("📷 本文内差し込み画像")
-            st.caption("アップロード後、ボタンでエディタに挿入するかHTMLタグをコピーしてください")
+            st.caption("アップロード後、ボタンでエディタに挿入またはHTMLタグをコピーしてください")
 
             inline_files = st.file_uploader(
                 "差し込み画像（複数選択可）",
@@ -408,20 +408,22 @@ else:
                 for i, img_info in enumerate(st.session_state.inline_image_urls):
                     max_w = img_info.get("max_w", 900)
                     img_tag = f'<img src="{img_info["url"]}" alt="{img_info["name"]}" style="width:{max_w}px;max-width:100%;height:auto;display:block;" />'
-                    col_il1, col_il2, col_il3, col_il4 = st.columns([2, 1, 2, 1])
+                    col_il1, col_il2, col_il3 = st.columns([2, 2, 1])
                     with col_il1:
                         st.caption(img_info["name"])
                         st.image(img_info["url"], width=120)
                     with col_il2:
                         st.text_area("HTMLタグ", value=img_tag, height=80, key=f"img_tag_{i}")
+                        # ✅ コピーボタン
+                        copy_button(img_tag, key=f"copy_{i}")
                     with col_il3:
+                        st.write("")
                         if st.session_state.editor_mode == "rich":
-                            if st.button("📌 エディタに挿入", key=f"insert_btn_{i}"):
+                            if st.button("📌 挿入", key=f"insert_btn_{i}"):
                                 st.session_state.working_html += img_tag
+                                # ✅ Quillを強制再初期化して即反映
+                                st.session_state.quill_key += 1
                                 st.rerun()
-                        else:
-                            st.caption("HTMLタグをコピーして\nエディタに貼り付けてください")
-                    with col_il4:
                         if st.button("🗑️", key=f"del_inline_{i}"):
                             st.session_state.inline_image_urls.pop(i)
                             st.rerun()
@@ -457,7 +459,8 @@ else:
                             ["link"],
                             ["clean"]
                         ],
-                        key="quill_editor"
+                        # ✅ keyを動的に変えることでQuillを強制再初期化
+                        key=f"quill_editor_{st.session_state.quill_key}"
                     )
                     if rich_html is not None:
                         st.session_state.working_html = rich_html
@@ -513,21 +516,21 @@ else:
                             except Exception as e:
                                 st.error(f"AIエラー: {e}")
 
-            # --- 自動保存（本文が入力されていれば随時保存）---
+            # 自動保存
             if st.session_state.working_html and title_input:
                 st.session_state.autosave_html = st.session_state.working_html
                 st.session_state.autosave_title = title_input
                 st.session_state.autosave_time = time.strftime("%H:%M")
                 st.caption(f"💾 自動保存済み（{st.session_state.autosave_time}）")
 
-            # --- プレビュー ---
+            # プレビュー
             if st.session_state.working_html:
                 st.divider()
                 st.subheader("👀 プレビュー")
                 preview_html = clean_quill_html(st.session_state.working_html)
                 render_html(preview_html, height=400)
 
-            # --- 保存 ---
+            # 保存
             st.divider()
             col_save1, col_save2 = st.columns(2)
             with col_save1:
@@ -542,6 +545,7 @@ else:
                         st.session_state.eyecatch_url = ""
                         st.session_state.inline_image_urls = []
                         st.session_state.editor_mode = "rich"
+                        st.session_state.quill_key += 1
                         st.rerun()
 
             if st.button("💾 この内容で保存する", use_container_width=True):
@@ -572,7 +576,6 @@ else:
 
                         if res.status_code in [200, 201]:
                             st.success("保存完了！")
-                            # 自動保存もクリア
                             st.session_state.autosave_html = ""
                             st.session_state.autosave_title = ""
                             st.session_state.autosave_time = None
@@ -582,13 +585,14 @@ else:
                             st.session_state.eyecatch_url = ""
                             st.session_state.inline_image_urls = []
                             st.session_state.editor_mode = "rich"
+                            st.session_state.quill_key += 1
                             st.rerun()
                         else:
                             st.error(f"エラー: {res.text}")
                     except Exception as e:
                         st.error(f"通信エラー: {e}")
 
-            # --- 既存記事の管理 ---
+            # 既存記事の管理
             st.divider()
             st.subheader("📋 既存記事の管理")
             manage_articles = get_all_articles()
@@ -612,6 +616,7 @@ else:
                         st.session_state.eyecatch_url = ec.get("url", "") if isinstance(ec, dict) else (ec or "")
                         st.session_state.inline_image_urls = []
                         st.session_state.editor_mode = "rich"
+                        st.session_state.quill_key += 1
                         st.rerun()
                 with col_m3:
                     if st.session_state.delete_confirm_id == ma_id: