diff --git a/app/static/index.html b/app/static/index.html
index 0c66e8c..35613e4 100755
--- a/app/static/index.html
+++ b/app/static/index.html
@@ -134,6 +134,27 @@
if (currentItem.type === 'image') {
const img = document.createElement('img');
img.src = currentItem.url;
+
+ // Fetch the orientation setting from app_config.json
+ const response = await fetch('/static/app_config.json');
+ const config = await response.json();
+ const playerOrientation = config.player_orientation; // "landscape" or "portrait"
+
+ // Check the orientation of the image and adjust the object-fit property
+ const image = new Image();
+ image.src = currentItem.url;
+ image.onload = () => {
+ const isImageLandscape = image.width > image.height;
+ if (
+ (playerOrientation === 'landscape' && !isImageLandscape) ||
+ (playerOrientation === 'portrait' && isImageLandscape)
+ ) {
+ img.style.objectFit = 'contain'; // Show the full image without cropping
+ } else {
+ img.style.objectFit = 'cover'; // Crop to fit the container
+ }
+ };
+
playlistContainer.appendChild(img);
// Display the image for the specified duration