Skip to content

dimagoltsman/refreshable-picture-card

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

47 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Refreshable Picture card

resources:
  - url: /hacsfiles/refreshable-picture-card/refreshable-picture-card.js
    type: module

Configuration is very easy, and can be done graphically.

You can set a picture from a URL or a picture from an entity attribute.

Name Description Required
title Cart title no
refresh_interval Time in seconds between refreshes. Defaults to 30 seconds yes
url URL of the picture. Can be a local path. mutually exclusive with entity
entity Picture entity mutually exclusive with url
attribute Entity attribute no
tap_action Action on tap no
noMargin Whether to disable the margin around the picture. no

Attribute picture example:

type: 'custom:refreshable-picture-card'
title: My Mibox
refresh_interval: 3
entity: media_player.livingroom_mibox
attribute: entity_picture

url image example:

type: 'custom:refreshable-picture-card'
title: My Mibox
refresh_interval: 3
url: /api/media_player_proxy/media_player.livingroom_mibox?token=11111111111111222222222233333333&cache=1589898123.724253

Reolink camera snap url example:

type: 'custom:refreshable-picture-card'
title: Reolink Camera
refresh_interval: 1
url: http://192.168.1.174/cgi-bin/api.cgi?cmd=Snap&channel=0&rs=someString&user=username&password=password

Tap action example:

type: 'custom:refreshable-picture-card'
title: Reolink Camera
refresh_interval: 1
url: http://192.168.1.174/cgi-bin/api.cgi?cmd=Snap&channel=0&rs=someString&user=username&password=password
tap_action:
  action: call-service
  service: remote.send_command
  data:
    entity_id: remote.living_room_remote
    command: b64:JgCgAJSSEg8QEBIPERAPMhEyDxERDxAxEDESLxAyEREPEREQEBAQlBARDxIQEBAREi8PMhEvEhAQMRExDzIREBARDhISDhAyEBEQEQ8REi8RAAdclJMRDxAREREPEREwEi8SEBARDzIQMhAwDzESEBARERAQEBKSEg8QEBAREREPMREyDjESDhIwETESLxEQEBEREBAQETAPERERERAQMRAADQUAAAAAAAAAAA==

no margin (full card picture) example:

type: 'custom:refreshable-picture-card'
url: http://192.168.1.174/weatherForecast/weather.jpg
noMargin: true

navigate example (onclick, open url in new tab):

type: 'custom:refreshable-picture-card'
title: Reolink Camera
refresh_interval: 1
url: http://192.168.1.174/cgi-bin/api.cgi?cmd=Snap&channel=0&rs=someString&user=username&password=password
tap_action:
  action: url
  url_path: https://github.com/dimagoltsman/refreshable-picture-card/

navigate_local example (onclick, change local/lovelace tab):

type: 'custom:refreshable-picture-card'
title: Reolink Camera
refresh_interval: 1
url: http://192.168.1.174/cgi-bin/api.cgi?cmd=Snap&channel=0&rs=someString&user=username&password=password
tap_action:
  action: navigate
  navigation_path: camera

you are also welcome to contribute