diff --git a/server/app/routers/frame_pages.py b/server/app/routers/frame_pages.py index 3fe9f16..476a471 100644 --- a/server/app/routers/frame_pages.py +++ b/server/app/routers/frame_pages.py @@ -42,7 +42,10 @@ def _frame_page(request: Request, db: Session, frame_id: int, template: str, tab @router.get("/frames/{frame_id}", response_class=HTMLResponse) def frame_photos_page(frame_id: int, request: Request, db: Session = Depends(get_db)): - return _frame_page(request, db, frame_id, "frame_photos.html", "photos") + return _frame_page( + request, db, frame_id, "frame_photos.html", "photos", + display_mode_labels=DISPLAY_MODE_LABELS, + ) def _user_available_calendars(user: User) -> list[dict]: @@ -122,7 +125,6 @@ def frame_config_page(frame_id: int, request: Request, db: Session = Depends(get palette_labels=PALETTE_LABELS, default_palette_rgb=DEFAULT_PALETTE_RGB, palette_to_hex=palette_to_hex, - display_mode_labels=DISPLAY_MODE_LABELS, ) diff --git a/server/app/static/frame_config.js b/server/app/static/frame_config.js index cd40c97..783fbf1 100644 --- a/server/app/static/frame_config.js +++ b/server/app/static/frame_config.js @@ -1,17 +1,17 @@ // Configuration tab: frame settings + firmware card + take control. -// Frame name/mode live in the page header now (frame_header.js) and -// Calendar settings have their own tab (frame_calendar.js). window. -// FRAME_API is set by the template. Checkboxes are always sent -// explicitly as "true"/"false" -- the server treats absent fields as -// "leave unchanged", so a checkbox must never be simply omitted. +// Frame name/mode live in the page header now (frame_header.js), Calendar +// settings have their own tab (frame_calendar.js), and Order/Display mode +// live on the Photos tab (frame_photos.js) -- photos-specific settings, +// not device-wide configuration. window.FRAME_API is set by the template. +// Checkboxes are always sent explicitly as "true"/"false" -- the server +// treats absent fields as "leave unchanged", so a checkbox must never be +// simply omitted. async function saveConfig() { const minutes = parseInt(document.getElementById('refresh_interval_minutes').value, 10) || 60; const body = new URLSearchParams({ - order: document.getElementById('order').value, orientation: document.getElementById('orientation').value, refresh_interval_s: String(minutes * 60), - display_mode: document.getElementById('display_mode').value, quiet_hours_enabled: String(document.getElementById('quiet_hours_enabled').checked), quiet_hours_start: document.getElementById('quiet_hours_start').value || '22:00', quiet_hours_end: document.getElementById('quiet_hours_end').value || '07:00', diff --git a/server/app/static/frame_photos.js b/server/app/static/frame_photos.js index d2408d6..351190b 100644 --- a/server/app/static/frame_photos.js +++ b/server/app/static/frame_photos.js @@ -1,6 +1,6 @@ -// Photos tab: now-displaying, album picker, and the upcoming grid -// (rendering/drag logic in queue.js). window.FRAME_API is set by the -// template. +// Photos tab: now-displaying, album picker, order/display-mode settings, +// and the upcoming grid (rendering/drag logic in queue.js). window. +// FRAME_API is set by the template. function renderControlBanner(control) { const banner = document.getElementById('control-banner'); @@ -74,6 +74,8 @@ async function savePhotoSettings() { const body = new URLSearchParams({ album_id: document.getElementById('album_id').value || '', queue_target_len: document.getElementById('queue_target_len').value, + order: document.getElementById('order').value, + display_mode: document.getElementById('display_mode').value, }); const resp = await fetch(`${window.FRAME_API}/config`, { method: 'POST', diff --git a/server/app/templates/frame_config.html b/server/app/templates/frame_config.html index 0f41b66..b4a2c0c 100644 --- a/server/app/templates/frame_config.html +++ b/server/app/templates/frame_config.html @@ -18,12 +18,6 @@

Display settings

- - -

How a photo's aspect ratio - is reconciled with the panel's: Crop to fill - trims the excess; Crop to faces does the same - but shifts the crop to keep people on screen; Stretch to - fill fills the panel exactly without cropping (photos - not matching the panel's aspect ratio look stretched); - Shrink to fit shows the whole photo, letterboxed - if needed.

diff --git a/server/app/templates/frame_photos.html b/server/app/templates/frame_photos.html index b8d3085..fdb3107 100644 --- a/server/app/templates/frame_photos.html +++ b/server/app/templates/frame_photos.html @@ -30,6 +30,27 @@ {% endfor %} + + +

How a photo's aspect ratio + is reconciled with the panel's: Crop to fill + trims the excess; Crop to faces does the same + but shifts the crop to keep people on screen; Stretch to + fill fills the panel exactly without cropping (photos + not matching the panel's aspect ratio look stretched); + Shrink to fit shows the whole photo, letterboxed + if needed.