Digital photo frame

My idea was to build a photo frame with some information.

For the frontend I use card-mod, kiosk-mode, and auto-entities (all available in HACS).

For the camera, I use imagesdirectory-camera (available in HACS) and configured with the following in the configuration.yaml

camera:
  - platform: imagedirectory
    name: pictures
    sourcepath: "/media"
    delay_time: 5

To show the date and time, I added the following to my configuration.yaml:

sensor:
  - platform: time_date
    display_options:
      - 'date'
      - 'time'

To prevent storing the date and time, I added the following to my configuration.yaml:

recorder:
  exclude:
    domains:
      - automation
      - updater
    entity_globs:
      - sun.*
    entities:
      - sensor.last_boot # Comes from 'systemmonitor' sensor platform
      - sensor.time
      - sensor.date
    event_types:
      - call_service # Don't record service calls

I created another dashboard with the following RAW configuration:

kiosk_mode:
  hide_header: true
  hide_sidebar: true
  hide_menubutton: true
  hide_overflow: true
title: Kiosk
views:
  - title: Kiosk
    type: panel
    path: kiosk
    cards:
      - type: picture-elements
        camera_image: camera.pictures
        camera_view: live
        style:
          hui-image:
            $:
              ha-camera-stream:
                $: |
                  img {
                    height: 100vh !important;
                    width: 100vw !important;
                    object-fit: contain !important;
                  }
        elements:
          - type: state-label
            entity: sensor.date
            style:
              transform: none
              top: 5px
              left: 5px
              font-size: 20px
              color: white
              background-color: rgba(10, 10, 10, 0.4)
              border-radius: 10px
          - type: state-label
            entity: sensor.time
            style:
              transform: none
              top: 5px
              right: 5px
              font-size: 20px
              color: white
              background-color: rgba(10, 10, 10, 0.4)
              border-radius: 10px
          - type: custom:auto-entities
            card:
              type: entities
              title: null
              show_header_toggle: false
              state_color: true
            filter:
              template: |-
                {% for state in states.sensor -%}
                  {%- if state.entity_id | regex_match("sensor\.esp12f_ht_.*_temperature", ignorecase=False) -%}
                    {{
                      {
                        'entity': state.entity_id,
                        'name': state.attributes.friendly_name.split(' Temperature')[0]
                      }
                    }},
                  {%- endif -%}
                  {%- endfor %}
            style:
              transform: none
              bottom: 5px
              left: 5px
              background-color: rgba(10, 10, 10, 0.4)
              border-radius: 10px
          - type: custom:auto-entities
            card:
              type: entities
              title: null
              show_header_toggle: false
              state_color: true
            filter:
              template: |-
                {% for state in states.sensor -%}
                  {%- if state.entity_id | regex_match("sensor\.esp12f_ht_.*_humidity", ignorecase=False) -%}
                    {{
                      {
                        'entity': state.entity_id,
                        'name': state.attributes.friendly_name.split(' Humidity')[0]
                      }
                    }},
                  {%- endif -%}
                  {%- endfor %}
            style:
              transform: none
              bottom: 5px
              right: 5px

On the tablet I am loading the dashboard using the wallpanel app.

1 Like

Hello,

i have a Dashboard “Kiosk” but the
hide_header: true or hide_sidebar: true
dont work. nothing changed.

if i use https://myhainstance/lovelace-kiosk/first-tab?hide_sidebar then the sidebar is gone
what could be my false?

THX

Is it possible to use JPGs in the slideshow that are in some Dropbox directory?

I am not sure. Sorry for the late reply.

I would guess you need to replace the camera platform with something that supports dropbox but I’m not sure how to do it.