Skip to content

v0.7.0 - Browser-side transitions, visual editor, frame_id

Choose a tag to compare

@eyalgal eyalgal released this 08 May 23:23
· 3 commits to main since this release

This release adds a custom Lovelace card with smooth, browser-rendered transitions, a visual editor, and several quality-of-life improvements to the camera entity.

Transitions were inspired by a suggestion from @der-optimist on the Home Assistant forum. Thank you!

✨ Highlights

Album Slideshow Card

A custom Lovelace card ships with the integration. The integration registers it automatically - no HACS frontend repository to add and no Lovelace resource to configure. After installing or upgrading, hard-refresh your dashboard once (Ctrl+Shift+R) to pick up the script.

  • Smooth slide transitions rendered in the browser, so they stay buttery even on lower-end hardware. The server only renders one still per slide change; the browser cross-fades in CSS.
  • Effects: random, none, fade, slide-left, slide-right, slide-up, slide-down, wipe-left, wipe-right, zoom.
  • random picks a different effect per slide and avoids repeating the previous one.
  • Configurable duration and CSS easing.
  • aspect_ratio, fit (auto / cover / contain), and background options. fit: auto inherits the camera's fill_mode attribute (cover / contain / blur backdrop).
  • Optional tap_action: more-info opens the camera's more-info dialog.
  • Visual editor available - pick Album Slideshow from the card picker in Lovelace and the form appears automatically.
type: custom:album-slideshow-card
entity: camera.album_slideshow_living_room
transition: random
duration: 800
easing: ease-in-out
aspect_ratio: 16/9
fit: auto
background: '#000'
tap_action: none

Camera

  • New frame_id attribute: a monotonic counter that increments on every committed slide. The card uses it to cache-bust the camera proxy URL so a fresh JPEG is fetched on every slide.
  • The camera's entity_picture URL now appends &frame=<frame_id>, so any picture-entity cards or templated entity_picture consumers also see fresh frames per slide instead of stale browser-cached images.

📋 Full options reference

type: custom:album-slideshow-card
entity: camera.album_slideshow_living_room
transition: random          # random | none | fade | slide-left | slide-right
                            #   | slide-up | slide-down | wipe-left | wipe-right | zoom
duration: 800               # ms; CSS transition length (50-5000)
easing: ease-in-out         # any CSS timing function
aspect_ratio: 16/9          # CSS aspect-ratio value (16/9, 4/3, 1/1, auto)
fit: auto                   # auto | cover | contain
background: '#000'          # color shown behind contained images; blank inherits theme
tap_action: none            # none | more-info