From 1909b16ec55aa342da516cbf51e8a6d160759d98 Mon Sep 17 00:00:00 2001
From: Scheianu Ionut <scheianuionut@gmail.com>
Date: Sun, 11 May 2025 19:36:32 +0300
Subject: [PATCH] updated app

---
 app/run_app.sh           |  4 ++--
 app/static/index.html    | 11 ++++++---
 app/static/settings.html | 49 ++++++++++++++++++++++++++++++++++++----
 3 files changed, 54 insertions(+), 10 deletions(-)

diff --git a/app/run_app.sh b/app/run_app.sh
index c1196f9..f4abc04 100644
--- a/app/run_app.sh
+++ b/app/run_app.sh
@@ -6,9 +6,9 @@ set -e
 # Activate the virtual environment
 source venv/bin/activate
 
-# Run the Gunicorn server
+# Run the Gunicorn server in the foreground
 echo "Starting Gunicorn server..."
-python3 run_gunicorn.py &
+exec python3 run_gunicorn.py &
 
 # Wait for 5 seconds to ensure the server is up
 sleep 5
diff --git a/app/static/index.html b/app/static/index.html
index a836514..922dae7 100755
--- a/app/static/index.html
+++ b/app/static/index.html
@@ -27,9 +27,9 @@
         }
         .playlist-container img, 
         .playlist-container video { 
-            max-width: 100%; 
-            max-height: 100%; 
-            object-fit: contain; /* Ensure content fits within the container */
+            width: 100%; /* Make the video fill the width */
+            height: 100%; /* Make the video fill the height */
+            object-fit: cover; /* Ensure the video scales to cover the container */
         }
         .controls-wrapper {
             position: fixed; /* Fix the controls at the bottom of the page */
@@ -149,6 +149,11 @@
                 video.controls = false;
                 playlistContainer.appendChild(video);
 
+                // Ensure the video starts playing
+                video.play().catch(error => {
+                    console.error("Error starting video playback:", error);
+                });
+
                 // Play the video and move to the next item after it ends
                 video.onended = () => {
                     if (!isPaused) {
diff --git a/app/static/settings.html b/app/static/settings.html
index 60fe9fc..6d905d3 100755
--- a/app/static/settings.html
+++ b/app/static/settings.html
@@ -5,11 +5,50 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Settings</title>
     <style>
-        body { font-family: Arial, sans-serif; margin: 20px; }
-        label { display: block; margin: 10px 0 5px; }
-        input, select { width: 100%; padding: 8px; margin-bottom: 10px; }
-        button { padding: 10px 15px; }
-        .home-button { position: fixed; bottom: 20px; right: 20px; }
+        body { 
+            font-family: Arial, sans-serif; 
+            margin: 20px; 
+            background-color: black; /* Set background to black */
+            color: white; /* Set text color to white */
+        }
+        label { 
+            display: block; 
+            margin: 10px 0 5px; 
+        }
+        input, select { 
+            width: 100%; 
+            padding: 8px; 
+            margin-bottom: 10px; 
+            background-color: #333; /* Dark background for inputs */
+            color: white; /* White text for inputs */
+            border: 1px solid #555; /* Subtle border for inputs */
+            border-radius: 4px; /* Rounded corners */
+        }
+        button { 
+            padding: 10px 15px; 
+            background-color: #444; /* Dark button background */
+            color: white; /* White text for buttons */
+            border: none; 
+            border-radius: 5px; 
+            cursor: pointer; 
+        }
+        button:hover { 
+            background-color: #666; /* Lighter background on hover */
+        }
+        .home-button { 
+            position: fixed; 
+            bottom: 20px; 
+            right: 20px; 
+            background-color: #444; /* Dark background for home button */
+            color: white; 
+            border: none; 
+            border-radius: 5px; 
+            padding: 10px 15px; 
+            cursor: pointer; 
+        }
+        .home-button:hover { 
+            background-color: #666; /* Lighter background on hover */
+        }
     </style>
 </head>
 <body>