Streaming camera in picture-elements

Configuration Frontend
21

@bruxy70, I do not know if this helps, but in version 0.108.0, picture-elements can stream.
I learnt that it depends on how you set up your camera: tried ffmpeg, onvif and generic platforms. Generic platform gave the best streaming result (depends on the HW you are running HASS).

My working ui-lovelace,yaml section looks like:

        - type: conditional
          conditions:
            - entity: device_tracker.fluoreon_cam
              state: 'home'
          card:
            type: picture-elements
            image: camera.living
            camera_image: camera.living
            camera_view: live
            elements:
              - type: icon
                icon: 'mdi:arrow-up'
                entity: camera.living
                style:
                  background: 'rgba(255, 255, 255, 0.5)'
                  right: 25px
                  bottom: 25px
                tap_action:
                  action: call-service
                  service: rest_command.floureon_cmd
                  service_data:
                    ptz_cmd: up
              - type: icon
                icon: 'mdi:arrow-down'
                entity: camera.living
                style:
                  background: 'rgba(255, 255, 255, 0.5)'
                  right: 25px
                  bottom: 0px
                tap_action:
                  action: call-service
                  service: rest_command.floureon_cmd
                  service_data:
                    ptz_cmd: down
              - type: icon
                icon: 'mdi:arrow-left'
                entity: camera.living
                style:
                  background: 'rgba(255, 255, 255, 0.5)'
                  right: 50px
                  bottom: 12px
                tap_action:
                  action: call-service
                  service: rest_command.floureon_cmd
                  service_data:
                    ptz_cmd: left
              - type: icon
                icon: 'mdi:arrow-right'
                entity: camera.living
                style:
                  background: 'rgba(255, 255, 255, 0.5)'
                  right: 0px
                  bottom: 12px
                tap_action:
                  action: call-service
                  service: rest_command.floureon_cmd
                  service_data:
                    ptz_cmd: right
              - type: state-icon
                entity: media_player.tanix_kodi
                style:
                  right: 220px
                  bottom: -10px
                tap_action:
                  action: navigate
                  navigation_path: /lovelace/2
1 Like
22

thanks for the update, this is now working for me too!
how do you get the full size video to play if you tap on the picture element?

1 Like
23

Thanks for sharing this, is there a way to make it so you click on the streaming image and get the full screen stream rather than having to click on an icon?