• Stars
    star
    169
  • Rank 224,453 (Top 5 %)
  • Language
    JavaScript
  • Created almost 6 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Custom entity row for HomeAssistant, providing additional types of data to be displayed in the secondary info area of the Lovelace Entities card

secondaryinfo-entity-row

Custom entity row for Home Assistant, providing additional types of data to be displayed in the secondary info sections of the Lovelace Entities card.

Prerequisites

  • Home Assistant >= 0.88 (last tested against 2021.4.4)
  • Thomas Lovรฉnโ€™s card-tools.js >= 2.0 (tested against 11)

Installation Instructions

This card is available as a plugin in the default community store of HACS

1) Install the latest Card Tools via HACS (Prerequisite)

Search for the card-tools plugin in HACS and install. This is available in the default HACS community store.

2) Install Secondary Info Entity Row via HACS

Search for the secondaryinfo-entity-row plugin in HACS and install.

3) Update the Lovelace configuration to use the plugins

resources:
  url: /hacsfiles/card-tools.js
  type: module
  url: /hacsfiles/secondaryinfo-entity-row.js
  type: module

Options

The standard Lovelace configuration for entities remains valid, with the exception of secondary_info.

New way - Home Assistant rendering

To utilize card-tools Jinja2 API, secondary_info should be a string value with at least one Jinja2 tag (either starting with {{ or {%). In addition, every user that should be able to see secondary_info content, must be an admin. This constraint comes from card-tools.

Old way - Custom template language

For card-tools old templating support, secondary_info should be a string value, enclosed in double-quotes, which supports the parseTemplate syntax defined in card-tools.js. Per the documentation:

Two things are important:

- Template must start with [[<space> and end with <space>]]
- This is not in any way the same kind of template as used in the Home Assistant configuration

The templates are parsed by reading one step at a time from the `hass.states` object.
Thus, the first part must be an entity with domain and id, e.g. `light.bed_light`, `media_player.bedroom` etc.
Next is one of:

- entity_id
- state
- attributes.<attribute>
- last_changed
- last_updated

Also see details of the new conditional syntax at useful-markdown-card:

if

Syntax: [[ if(<condition>, <then>, <else>) ]] Simply put, if <condition> is satisfied, the template will be replaced with <then>, otherwise it will be replaced with <else>.

Both <then> and <else> can in turn be <template> expressions, and <else> can even be another if(!).

Conditions are in the form <left> <comparison> <right> where <left> and <right> are <template>, strings or numeric values.

<comparison> is one of ==, !=, <, >, <= or >=.

Examples

type: entities
title: Custom Secondary Info
entities:
- entity: sun.sun
  name: Entity ID with wrapped in tag
  type: "custom:secondaryinfo-entity-row"
  secondary_info: "<b style='color:red'>[[ sun.sun.entity_id ]]</b>"
  
- entity: sun.sun
  name: Absolute time for last-changed
  type: "custom:secondaryinfo-entity-row"
  secondary_info: "[[ sun.sun.last_changed ]]"
  
- entity: sun.sun
  name: Static text
  type: "custom:secondaryinfo-entity-row"
  secondary_info: "This is the entity row for the Sun"

- entity: sun.sun
  name: Entity attribute
  type: "custom:secondaryinfo-entity-row"
  secondary_info: "Next Dawn: [[ sun.sun.attributes.next_dawn ]]"
  
- entity: sun.sun
  name: Templated entity object
  type: "custom:secondaryinfo-entity-row"
  secondary_info:  "Next Dawn: [[ {entity}.attributes.next_dawn ]]"
  
- entity: sun.sun
  name: Conditional template
  type: "custom:secondaryinfo-entity-row"
  secondary_info: '[[ if(sun.sun.attributes.elevation < 0, "Below", "Above") ]] the horizon'
  
- entity: sun.sun
  name: Jinja2 template
  type: "custom:secondaryinfo-entity-row"
  secondary_info: "Next Dawn: {{ state_attr('sun.sun', 'next_dawn') }}"

example

Changelog

0.5

  • Jinja2 templates support from card-tools

0.4.1

  • Updated HACS support files and documentation

0.4

  • Compatible with latest card-tools
  • Updated README with HACS install info

0.3.1

  • Replaced deprecated card-tools functions
  • Added example image to GitHub

0.3

  • The configured entity object can now be referenced as {entity} inside a template. This enables compatibility with dynamic entity list generators such as auto-entities.
  • Requires card-tools 0.4, which introduces conditional statements in the template. See useful-markdown-card.
  • Examples updated

0.2

  • Compatibility with Home Assistant 0.88

0.1.1

  • Add custom_cards.json for custom_updater integration

0.1

  • New release based on card-tools

More Repositories

1

button-card

โ‡๏ธ Lovelace button-card for home assistant
JavaScript
1,890
star
2

spotify-card

Spotify playlist card for Home Assistant card
TypeScript
379
star
3

decluttering-card

๐Ÿงน Declutter your lovelace configuration with the help of this card
TypeScript
360
star
4

bar-card

Customizable Animated Bar card for Home Assistant Lovelace
TypeScript
333
star
5

stack-in-card

๐Ÿ›  group multiple cards into one card without the borders
TypeScript
267
star
6

upcoming-media-card

๐Ÿ“บ A card to display upcoming episodes and movies from services like: Plex, Kodi, Radarr, Sonarr, and Trakt.
JavaScript
260
star
7

surveillance-card

A custom component for displaying camera feeds in the style of a surveillance system.
JavaScript
244
star
8

boilerplate-card

A community driven blueprint for best practices
TypeScript
225
star
9

dual-gauge-card

Dual gauge custom card for Lovelace in Home Assistant
JavaScript
187
star
10

flex-table-card

Highly Flexible Lovelace Card - arbitrary contents/columns/rows, regex matched, perfect to show appdaemon created content and anything breaking out of the entity_id + attributes concept
JavaScript
184
star
11

circle-sensor-card

A custom component for displaying sensor values as cards or elements
JavaScript
166
star
12

canvas-gauge-card

The card makes it possible to use gauges from https://canvas-gauges.com/
TypeScript
158
star
13

tracker-card

A card to track custom cards and custom component updates.
JavaScript
110
star
14

bignumber-card

JavaScript
110
star
15

button-entity-row

Adds buttons to call services to entity cards
JavaScript
103
star
16

check-button-card

Check Button Card is a button that tracks when it is last pressed, for the Home Assistant Lovelace front-end using MQTT auto discovery.
TypeScript
103
star
17

information

88
star
18

entity-attributes-card

Entity Attributes
JavaScript
64
star
19

group-element

A group element for picture-elements with dynamic toggle capability
JavaScript
60
star
20

light-entity-row

Entity row for lights with sliders for adjusting different values based on features
JavaScript
55
star
21

custom-card-helpers

Custom Card Helper Functions/Types for Developers
TypeScript
48
star
22

gauge-card

JavaScript
44
star
23

monster-card

โš ๏ธ DEPRECATED - MOVE TO AUTO-ENTITIES
JavaScript
35
star
24

unused-card

All your unused entities in a list
TypeScript
32
star
25

plan-coordinates

JavaScript
28
star
26

rmv-card

Custom card for the RMV component.
JavaScript
27
star
27

group-card

JavaScript
23
star
28

state-attribute-element

Give you the specified attribute of an entity
JavaScript
22
star
29

favicon-counter

Show a notification count badge.
JavaScript
19
star
30

text-element

An element that can be used to show static text on the `picture-elements` card
JavaScript
19
star
31

cover-element

JavaScript
17
star
32

camera-card

๐Ÿ“บ Camera Card for Lovelace
JavaScript
17
star
33

ext-weblink

Adds ext weblink with icon to picture-elements or entity cards
JavaScript
16
star
34

state-element

Give you the option to prefix the state-label with a formated string.
JavaScript
16
star
35

nintendo-wishlist-card

Displays a card showing Nintendo Switch games that are on sale from your wish list.
JavaScript
15
star
36

timer-card

โฒ Lovelace Timer Card
TypeScript
11
star
37

home-setter

JavaScript
10
star
38

pc-card

๐Ÿ’ต Personal Capital Card
JavaScript
8
star
39

text-action-element

JavaScript
7
star
40

username-element

Show the current logged in user.
JavaScript
7
star
41

beer-card

This card give you a list of your wishlist items.
JavaScript
3
star