Update app.py

app.py

@@ -1,5 +1,5 @@
 import gradio as gr
-from utils import process_video
+from utils import process_video  # Ensure this points to the updated utils.py
 
 # Define supported languages
 language_map = {
@@ -16,34 +16,35 @@ language_map = {
     "Japanese": "Helsinki-NLP/opus-mt-en-jap"
 }
 
-# Custom CSS for dark mode and animations
+# Custom CSS for a Windows-like professional look
 css = """
 body {
-    transition: background-color 0.5s ease;
-}
-.dark-theme {
-    background-color: #1a1a1a !important;
+    background-color: #1a1a1a;
     color: #e0e0e0;
+    font-family: 'Segoe UI', sans-serif;
 }
 .gradio-container {
     max-width: 1200px;
     margin: 0 auto;
     padding: 20px;
-    border-radius: 10px;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
+    background: #2d2d2d;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
 }
 .file-preview {
-    border: 2px dashed #6c757d;
+    border: 2px dashed #007acc;
     padding: 20px;
-    border-radius: 10px;
+    border-radius: 8px;
 }
-.progress-text {
-    font-size: 16px;
-    color: #28a745;
-    animation: blink 1s infinite;
+.progress-bar {
+    background: #007acc;
+    border-radius: 8px;
+    height: 20px;
 }
-@keyframes blink {
-    50% { opacity: 0.5; }
+.progress-text {
+    color: #00ff00;
+    font-weight: bold;
+    margin-top: 10px;
 }
 """
 
@@ -56,6 +57,7 @@ with gr.Blocks(theme=gr.themes.Monochrome(), css=css) as demo:
         with gr.Column(scale=2):
             video_input = gr.File(
                 label="Upload Video File",
+                file_types=["mp4", "mkv", "avi"],
                 elem_classes=["file-preview"]
             )
         with gr.Column(scale=1):
@@ -65,9 +67,10 @@ with gr.Blocks(theme=gr.themes.Monochrome(), css=css) as demo:
                 value="English"
             )
 
-    generate_button = gr.Button("Generate Subtitles 🚀")
+    generate_button = gr.Button("Generate Subtitles 🚀", elem_classes=["btn-primary"])
+    progress_bar = gr.ProgressBar(label="Progress", elem_classes=["progress-bar"])
     progress_text = gr.Textbox(
-        label="Progress",
+        label="Status",
         interactive=False,
         elem_classes=["progress-text"]
     )
@@ -77,25 +80,29 @@ with gr.Blocks(theme=gr.themes.Monochrome(), css=css) as demo:
         try:
             # Validate file type
             if not video_file.name.lower().endswith(('.mp4', '.mkv', '.avi')):
-                return None, "❌ Invalid file type. Please upload an MP4, MKV, or AVI file."
+                return None, None, "❌ Invalid file type. Please upload an MP4, MKV, or AVI file."
 
-            # Update progress text
-            progress = "🔄 Processing video..."
-            yield None, progress  # Yield initial progress message
+            # Initialize progress
+            progress = gr.Progress(track_tqdm=True)
+            progress(0, desc="Initializing...")
 
             # Process video
-            srt_path = process_video(video_file.name, language)
+            srt_path = process_video(video_file.name, language, progress=progress)
             if srt_path:
-                return gr.File(srt_path), "✅ Subtitles generated successfully!"
+                progress(1, desc="✅ Subtitles generated successfully!")
+                return gr.File(srt_path), progress(1), "✅ Subtitles ready for download!"
             else:
-                return None, "❌ Error during processing. Check logs."
+                progress(0, desc="❌ Error during processing.")
+                return None, progress(0), "❌ Failed to generate subtitles. Check logs."
+
         except Exception as e:
-            return None, f"❌ Error: {str(e)}"
+            progress(0, desc="❌ Error encountered.")
+            return None, progress(0), f"❌ Error: {str(e)}"
 
     generate_button.click(
         generate_subtitles,
         inputs=[video_input, language_dropdown],
-        outputs=[output_srt, progress_text]
+        outputs=[output_srt, progress_bar, progress_text]
     )
 
 demo.launch()