Update app.py

app.py

@@ -9,6 +9,7 @@ from facenet_pytorch import MTCNN
 from transformers import AutoFeatureExtractor, AutoModelForImageClassification
 from PIL import Image
 import os
+import time
 
 # Load models
 device = 'cuda' if torch.cuda.is_available() else 'cpu'
@@ -36,7 +37,7 @@ def detect_emotion(frame):
     return model.config.id2label[torch.argmax(probs).item()]
 
 # Process Video
-def process_video(video_path):
+def process_video(video_path, progress=gr.Progress()):
     cap = cv2.VideoCapture(video_path)
     fps = int(cap.get(cv2.CAP_PROP_FPS))
     frame_width, frame_height = int(cap.get(cv2.CAP_PROP_FRAME_WIDTH)), int(cap.get(cv2.CAP_PROP_FRAME_HEIGHT))
@@ -44,6 +45,8 @@ def process_video(video_path):
     out = cv2.VideoWriter(out_path, cv2.VideoWriter_fourcc(*'mp4v'), fps, (frame_width, frame_height))
 
     emotion_counts = {}
+    total_frames = int(cap.get(cv2.CAP_PROP_FRAME_COUNT))
+    processed_frames = 0
 
     while cap.isOpened():
         ret, frame = cap.read()
@@ -61,6 +64,9 @@ def process_video(video_path):
 
         out.write(frame)
 
+        processed_frames += 1
+        progress((processed_frames / total_frames) * 100)
+
     cap.release()
     out.release()
 
@@ -74,12 +80,62 @@ def process_video(video_path):
 
     return emotion, "emotion_distribution.jpg", out_path
 
-# Gradio Interface
-gr.Interface(
-    fn=process_video,
-    inputs=[gr.File(type="filepath")],
-    outputs=["text", "image", "file"],
-    title="Emotion Analysis from Video",
-    description="Upload a video to analyze frame-by-frame emotion changes, get an emotion distribution pie chart, and a processed video with emotions.",
-).launch()
+# Custom CSS for styling
+css = """
+h1 {
+    text-align: center;
+    color: #ffffff;
+    font-size: 32px;
+    font-weight: bold;
+}
+
+.gradio-container {
+    background-color: #1E1E1E;
+    color: #ffffff;
+    padding: 20px;
+    font-family: 'Arial', sans-serif;
+}
+
+button {
+    font-size: 18px !important;
+    padding: 10px 15px !important;
+    background-color: #00BFFF !important;
+    color: white !important;
+    border-radius: 10px !important;
+}
+
+.gr-text-input {
+    background-color: #2E2E2E;
+    color: white;
+    border: 1px solid #00BFFF;
+}
+"""
+
+# Gradio Interface with Enhanced UI
+with gr.Blocks(css=css) as demo:
+    with gr.Row():
+        gr.Markdown("<h1>🎭 Emotion Analysis from Video 🎥</h1>")
+    
+    with gr.Row():
+        video_input = gr.File(label="📤 Upload your video", type="filepath")
+    
+    with gr.Row():
+        analyze_button = gr.Button("🚀 Analyze Video")
+
+    with gr.Row():
+        result_text = gr.Textbox(label="Detected Emotion", interactive=False)
+    
+    with gr.Row():
+        emotion_chart = gr.Image(label="📊 Emotion Distribution", interactive=False)
+    
+    with gr.Row():
+        processed_video = gr.Video(label="🎞 Processed Video with Emotion Detection")
+
+    analyze_button.click(
+        process_video,
+        inputs=[video_input],
+        outputs=[result_text, emotion_chart, processed_video]
+    )
 
+# Launch Gradio app
+demo.launch()