Login test 2.0

app.py

@@ -49,8 +49,8 @@ def show_add_entry_form():
 
 def save_entry(df, start_time, text, end_time, selected_row_idx, video_id):
     """Save or update a caption entry"""
-    # if user == "anonymous_user":
-    #     return df, gr.update(visible=True), gr.Warning("Please sign in to save changes")
+    if user == "anonymous_user":
+        return df, gr.update(visible=True), gr.Warning("Please sign in to save changes")
     try:
         start_time = float(start_time)
         end_time = float(end_time)
@@ -120,126 +120,129 @@ def get_next_components():
 with gr.Blocks(css=css, head=yt_init_js) as main_page:
     gr.Markdown("## Caption Editor")
 
-    gr.LoginButton()
-
     current_user = gr.Textbox(visible=False, interactive=False)
     current_video_id = gr.Textbox(value=start_video_id, visible=False, interactive=False)
     selected_row_idx = gr.Number(value=-1, visible=False)
 
+    with gr.Row():
+        with gr.Column():
+            gr.LoginButton()
+        with gr.Column():
+            @gr.render(inputs=current_user)
+            def render_page(logged_in_user):
+                if logged_in_user is None:
+                    gr.Markdown("## Please log in via Hugging Face")
+                else:
+                    gr.Markdown(f"## Logged in as {user}")
+
     main_page.load(get_username, outputs=current_user)  # Disabled when auth is disabled
 
-    @gr.render(inputs=current_user)
-    def render_page(logged_in_user):
-        if logged_in_user is None:
-            gr.Markdown("## Please log in via Hugging Face")
-        else:
-            with gr.Row(key="row1"):
-                with gr.Column(scale=2, min_width=600, key="video_col"):
-                    # Video player and "next video button
-                    video_embed = gr.HTML(value=get_youtube_player_html(), key="video")
-                    next_video_button = gr.Button("Next", key="next_video")
-                with gr.Column(scale=1, min_width=200, key="editor_col"):
-                    # Read-only DataFrame with add button
-                    caption_editor = gr.DataFrame(interactive=False,
-                                                  elem_id="tbl",
-                                                  value=start_captions,
-                                                  datatype=["number", "str", "number"],
-                                                  col_count=(3, "fixed"),
-                                                  column_widths=["20%", "60%", "20%"],
-                                                  headers=["Start", "Text", "End"],
-                                                  wrap=True,
-                                                  key="editor")
-                    add_entry_button = gr.Button("Add Entry", variant="secondary", key="add_entry")
-
-            with gr.Row(key="row2"):
-                # Editing panel (initially hidden) - spans full width
-                with gr.Group(visible=False) as editing_panel:
-                    gr.Markdown("### Edit Caption Entry")
-                    with gr.Row(equal_height=False):
-                        with gr.Column():
-                            start_time_input = gr.Textbox(label="Start Time (seconds)", value="0.000", interactive=False)
-                            insert_start_time_button = gr.Button("Insert Current Time")
-                        with gr.Column():
-                            text_input = gr.Textbox(label="Caption Text", placeholder="Enter caption text...")
-
-                        with gr.Column():
-                            end_time_input = gr.Textbox(label="End Time (seconds)", value="0.000", interactive=False)
-                            insert_end_time_button = gr.Button("Insert Current Time")
-
-                    with gr.Row(equal_height=False):
-                        save_entry_button = gr.Button("Save Entry", variant="primary")
-                        cancel_button = gr.Button("Cancel", variant="secondary")
-
-            save_result = gr.Markdown()
-
-            # Event handlers
-            next_video_button.click(
-                fn=get_next_components,
-                outputs=[caption_editor, current_video_id]
-            )
+    with gr.Row():
+        with gr.Column(scale=2, min_width=600):
+            # Video player and "next video button
+            video_embed = gr.HTML(value=get_youtube_player_html())
+            next_video_button = gr.Button("Next", key="next_video")
+        with gr.Column(scale=1, min_width=200):
+            # Read-only DataFrame with add button
+            caption_editor = gr.DataFrame(interactive=False,
+                                          elem_id="tbl",
+                                          value=start_captions,
+                                          datatype=["number", "str", "number"],
+                                          col_count=(3, "fixed"),
+                                          column_widths=["20%", "60%", "20%"],
+                                          headers=["Start", "Text", "End"],
+                                          wrap=True)
+            add_entry_button = gr.Button("Add Entry", variant="secondary")
+
+    with gr.Row():
+        # Editing panel (initially hidden) - spans full width
+        with gr.Group(visible=False) as editing_panel:
+            gr.Markdown("### Edit Caption Entry")
+            with gr.Row(equal_height=False):
+                with gr.Column():
+                    start_time_input = gr.Textbox(label="Start Time (seconds)", value="0.000", interactive=False)
+                    insert_start_time_button = gr.Button("Insert Current Time")
+                with gr.Column():
+                    text_input = gr.Textbox(label="Caption Text", placeholder="Enter caption text...")
+
+                with gr.Column():
+                    end_time_input = gr.Textbox(label="End Time (seconds)", value="0.000", interactive=False)
+                    insert_end_time_button = gr.Button("Insert Current Time")
+
+            with gr.Row(equal_height=False):
+                save_entry_button = gr.Button("Save Entry", variant="primary")
+                cancel_button = gr.Button("Cancel", variant="secondary")
+
+    save_result = gr.Markdown()
+
+    # Event handlers
+    next_video_button.click(
+        fn=get_next_components,
+        outputs=[caption_editor, current_video_id]
+    )
 
-            # Load video when current_video_id changes
-            current_video_id.change(
-                fn=None,
-                inputs=current_video_id,
-                outputs=None,
-                js="""(videoId) => {
-                    if (window.ytPlayer && window.ytPlayer.cueVideoById) {
-                        console.log('[Video Load] Calling cueVideoById with:', videoId);
-                        window.ytPlayer.cueVideoById(videoId);
-                    } else {
-                        console.error('[Video Load] Player not ready yet');
-                    }
-                }"""
-            )
+    # Load video when current_video_id changes
+    current_video_id.change(
+        fn=None,
+        inputs=current_video_id,
+        outputs=None,
+        js="""(videoId) => {
+            if (window.ytPlayer && window.ytPlayer.cueVideoById) {
+                console.log('[Video Load] Calling cueVideoById with:', videoId);
+                window.ytPlayer.cueVideoById(videoId);
+            } else {
+                console.error('[Video Load] Player not ready yet');
+            }
+        }"""
+    )
 
-            # Handle row selection in DataFrame
-            caption_editor.select(
-                fn=on_row_select,
-                inputs=[caption_editor],
-                outputs=[editing_panel, start_time_input, text_input, end_time_input, selected_row_idx, save_entry_button]
-            )
+    # Handle row selection in DataFrame
+    caption_editor.select(
+        fn=on_row_select,
+        inputs=[caption_editor],
+        outputs=[editing_panel, start_time_input, text_input, end_time_input, selected_row_idx, save_entry_button]
+    )
 
-            # Handle add entry button
-            add_entry_button.click(
-                fn=show_add_entry_form,
-                outputs=[editing_panel, start_time_input, text_input, end_time_input, selected_row_idx, save_entry_button]
-            )
+    # Handle add entry button
+    add_entry_button.click(
+        fn=show_add_entry_form,
+        outputs=[editing_panel, start_time_input, text_input, end_time_input, selected_row_idx, save_entry_button]
+    )
 
-            # Handle save entry
-            save_entry_button.click(
-                fn=save_entry,
-                inputs=[caption_editor, start_time_input, text_input, end_time_input,
-                        selected_row_idx, current_video_id],
-                outputs=[caption_editor, editing_panel, save_result]
-            )
+    # Handle save entry
+    save_entry_button.click(
+        fn=save_entry,
+        inputs=[caption_editor, start_time_input, text_input, end_time_input,
+                selected_row_idx, current_video_id],
+        outputs=[caption_editor, editing_panel, save_result]
+    )
 
-            insert_start_time_button.click(fn=None, inputs=None, outputs=start_time_input,
-              js="() => window.ytPlayer ? +window.ytPlayer.getCurrentTime().toFixed(3) : 0")
+    insert_start_time_button.click(fn=None, inputs=None, outputs=start_time_input,
+      js="() => window.ytPlayer ? +window.ytPlayer.getCurrentTime().toFixed(3) : 0")
 
-            insert_end_time_button.click(fn=None, inputs=None, outputs=end_time_input,
-              js="() => window.ytPlayer ? +window.ytPlayer.getCurrentTime().toFixed(3) : 0")
+    insert_end_time_button.click(fn=None, inputs=None, outputs=end_time_input,
+      js="() => window.ytPlayer ? +window.ytPlayer.getCurrentTime().toFixed(3) : 0")
 
 
-            # Handle cancel
-            cancel_button.click(
-                fn=cancel_edit,
-                outputs=[editing_panel]
-            )
+    # Handle cancel
+    cancel_button.click(
+        fn=cancel_edit,
+        outputs=[editing_panel]
+    )
 
-            # Load initial video on page load
-            main_page.load(
-                fn=None,
-                inputs=current_video_id,
-                outputs=None,
-                js="""(videoId) => {
-                    const checkPlayer = setInterval(() => {
-                        if (window.ytPlayer && window.ytPlayer.cueVideoById) {
-                            clearInterval(checkPlayer);
-                            window.ytPlayer.cueVideoById(videoId);
-                        }
-                    }, 100);
-                }"""
-            )
+    # Load initial video on page load
+    main_page.load(
+        fn=None,
+        inputs=current_video_id,
+        outputs=None,
+        js="""(videoId) => {
+            const checkPlayer = setInterval(() => {
+                if (window.ytPlayer && window.ytPlayer.cueVideoById) {
+                    clearInterval(checkPlayer);
+                    window.ytPlayer.cueVideoById(videoId);
+                }
+            }, 100);
+        }"""
+    )
 
 main_page.launch(share=True)