Update app.py

app.py

@@ -112,7 +112,7 @@ DEFAULT_PROMPTS = {
     }
 }
 
-# ===== CORE CAPTIONING =====
+# ===== CAPTION GENERATION =====
 def safe_generate_caption_direct(image, system_prompt, user_prompt, max_chars=1200):
     try:
         if image is None:
@@ -150,7 +150,6 @@ def safe_generate_caption_direct(image, system_prompt, user_prompt, max_chars=12
         gc.collect()
         return f"❌ Error: {str(e)[:200]}"
 
-# ===== INDIVIDUAL CAPTION WRAPPERS =====
 @spaces.GPU(duration=60)
 @torch.no_grad()
 def generate_caption(image, system, user):
@@ -239,9 +238,10 @@ def export_joycaption_data(keywords, custom_instructions, avoid, question, c1, c
 
 # ===== UI =====
 with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Soft()) as demo:
+    # CSS for autoresize
     gr.HTML("""
     <style>
-    textarea.autoresize {overflow-y:hidden!important;min-height:50px!important;height:auto!important;}
+    textarea {overflow-y:hidden !important;}
     </style>
     """)
     gr.HTML("<h1 style='text-align:center;margin-top:10px;'>🎨 JoyCaption Advanced Prompting System (v6.0)</h1><hr>")
@@ -250,7 +250,6 @@ with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Sof
     active_tab = gr.State("casual")
 
     with gr.Row():
-        # LEFT
         with gr.Column(scale=1):
             image_input = gr.Image(type="pil", label="📸 Image", height=400)
             keywords_input = gr.Textbox(label="🏷️ Keywords", lines=2, placeholder="e.g. beach, sunset")
@@ -260,9 +259,7 @@ with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Sof
             ask_btn = gr.Button("Ask", variant="secondary")
             qa_output = gr.Textbox(label="Answer", lines=3, show_copy_button=True)
 
-        # RIGHT
         with gr.Column(scale=1):
-            # template buttons top
             gr.Markdown("**Insert Template**")
             with gr.Row():
                 key_btn = gr.Button("key", size="sm")
@@ -270,26 +267,27 @@ with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Sof
                 use_btn = gr.Button("use", size="sm")
                 not_btn = gr.Button("not", size="sm")
 
-            # Tabs
             with gr.Tab("📝 Casual") as tab1:
                 gr.Markdown("**System Prompt**")
-                system1 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["casual"]["system"], elem_classes="autoresize")
+                system1 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["casual"]["system"])
                 gr.Markdown("**User Prompt**")
-                user1 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["casual"]["user"], elem_classes="autoresize")
+                user1 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["casual"]["user"])
                 gen1_btn = gr.Button("Generate Casual", variant="primary")
                 out1 = gr.Textbox(lines=5, show_copy_button=True)
+
             with gr.Tab("🤝 Friendly") as tab2:
                 gr.Markdown("**System Prompt**")
-                system2 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["friendly"]["system"], elem_classes="autoresize")
+                system2 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["friendly"]["system"])
                 gr.Markdown("**User Prompt**")
-                user2 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["friendly"]["user"], elem_classes="autoresize")
+                user2 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["friendly"]["user"])
                 gen2_btn = gr.Button("Generate Friendly", variant="primary")
                 out2 = gr.Textbox(lines=5, show_copy_button=True)
+
             with gr.Tab("🔥 Erotic") as tab3:
                 gr.Markdown("**System Prompt**")
-                system3 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["erotic"]["system"], elem_classes="autoresize")
+                system3 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["erotic"]["system"])
                 gr.Markdown("**User Prompt**")
-                user3 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["erotic"]["user"], elem_classes="autoresize")
+                user3 = gr.Textbox(show_label=False, value=DEFAULT_PROMPTS["erotic"]["user"])
                 gen3_btn = gr.Button("Generate Erotic", variant="primary")
                 out3 = gr.Textbox(lines=5, show_copy_button=True)
 
@@ -298,23 +296,21 @@ with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Sof
             export_out = gr.Textbox(visible=False)
             export_file = gr.File(visible=False)
 
-    # === TAB SWITCH HANDLERS ===
+    # === Tab tracking
     tab1.select(lambda: "casual", None, active_tab)
     tab2.select(lambda: "friendly", None, active_tab)
     tab3.select(lambda: "erotic", None, active_tab)
 
-    # === EVENTS ===
+    # === Button actions
     gen1_btn.click(generate_caption, [image_input, system1, user1], out1)
     gen2_btn.click(generate_caption, [image_input, system2, user2], out2)
     gen3_btn.click(generate_caption, [image_input, system3, user3], out3)
     ask_btn.click(answer_question, [image_input, question_input], qa_output)
 
-    # Template logic — update only current tab
+    # === Template logic
     def handle_template(btn_type, tab, s1, u1, s2, u2, s3, u3, k, c, q, a):
         key_f, que_f, use_f, not_f = create_template_functions()
-        mapping = {
-            "key": key_f, "que": que_f, "use": use_f, "not": not_f
-        }
+        mapping = {"key": key_f, "que": que_f, "use": use_f, "not": not_f}
         fn = mapping.get(btn_type)
         if not fn:
             return s1, u1, s2, u2, s3, u3
@@ -351,5 +347,21 @@ with gr.Blocks(title="JoyCaption Advanced Prompting System", theme=gr.themes.Sof
         [export_out, export_file]
     )
 
+    # === JS autoresize for all tabs
+    demo.load(None, None, None, _js="""
+    () => {
+      function resizeAll() {
+        document.querySelectorAll('textarea').forEach(t=>{
+          t.style.height='auto';
+          t.style.height=(t.scrollHeight+5)+'px';
+        });
+      }
+      resizeAll();
+      document.querySelectorAll('[role="tab"]').forEach(tab=>{
+        tab.addEventListener('click', ()=>setTimeout(resizeAll,300));
+      });
+    }
+    """)
+
 if __name__ == "__main__":
     demo.launch()