I’m running HASSIO and everything was fine until a couple of updates ago. Since then all my bar-cards have stopped being displayed. Now I just get the big red box of doom saying;
Custom element doesn’t exist: bar-card
I’m using the custom:layout-card by Thomas Lovren. Bar cards displayed outside of this appear to work fine.
Any ideas what’s wrong & how to fix it?
Thanks.
LintHart
(Linton)
May 1, 2020, 11:35am
503
Same here after updating to 0.109.1.
bars sitting inside a custom vertical-stack-in-card
1 Like
That’s how I am using it too!
Gluwc
(Lucas Bramlage)
May 1, 2020, 12:06pm
505
Try using stack-in-card instead. Afaik vertical-stack-in-card is no longer being maintained.
1 Like
bouwew
(Bouwe)
May 2, 2020, 8:15am
506
Update: issue #75 created.
I’m having the same issue, I switched to stack-in-card, doesn’t help.
When I move the card outside of the stack-in-card, this error is in the log:
http://192.168.xxx.yyy:8123/local/community/bar-card/bar-card.js:5349:1 Uncaught SyntaxError: Unexpected token 'export'
Bar-card == v3.1.5
Gluwc
(Lucas Bramlage)
May 2, 2020, 1:13pm
507
This means you’re not loading the card as a module
. You can fix this in the Lovelace resources config panel.
2 Likes
@Gluwc : There is another problem. Since the rewrite, the level is displayed with 100% if the attribute is not available, e.g. the brightness level of Z-Wave lamps when they are switched off. Can you please change this to the previous behaviour?
Thanks. That was what broke my cards.
How did that change all of a sudden?
azure93
(Azure93)
May 4, 2020, 1:45pm
510
bar-card used in picture-element as curtain states for each rooms. (blue means curatin are opened)
after update direction for right/down are not working anymore. ( refer center blue bar … only work for left )
Is there any posibillity to used old method?
- type: custom:bar-card
entity: sensor.curtain_livingroom_current_position
height: 4px
width: 100%
color: '#99d3ff'
direction: left
entity_row: true
positions:
icon: 'off'
name: 'off'
value: 'off'
indicator: 'off'
style:
top: 86.6%
left: 42.5%
width: 15%
- type: custom:bar-card
entity: sensor.curtain_livingroom_current_position
height: 4px
width: 100%
color: '#99d3ff'
direction: right
entity_row: true
positions:
icon: 'off'
name: 'off'
value: 'off'
indicator: 'off'
style:
top: 86.6%
left: 58%
width: 15%
Gluwc
(Lucas Bramlage)
May 4, 2020, 2:03pm
511
Currently not directly supported but you could use card-mod to rotate the bar:
style: |-
bar-card-background {
transform: rotate(180deg);
}
@Gluwc I’m back my friend a new issue since either latest version of your card or ha v 0.109 unsure as I upgraded both at the same time . The gap between entities on a multi-entity bar card is huge now.
Before
After
2 Likes
Hi @Gluwc
did you get a chance to check this yet? https://github.com/custom-cards/bar-card/issues/79
not sure if HA update or Barcard update caused the error, so hope you can fix this?
thanks!
skank
May 9, 2020, 8:16pm
515
thx that fixed it for me too, indeed strange this changed
daxm
May 15, 2020, 11:54am
516
Whatever I do, the custom bar card can’t be found. I import via:
- url: /local/bar-card.js
type: module
- type: custom:vertical-stack-in-card
title: EPSON XP 830
cards:
- type: custom:bar-card
columns: 5
direction: up
entities:
- color: MediumTurquoise
entity: sensor.epson_xp_830_series_cyan_ink
- color: MediumOrchid
entity: sensor.epson_xp_830_series_magenta_ink
- color: Gold
entity: sensor.epson_xp_830_series_yellow_ink
- color: Black
entity: sensor.epson_xp_830_series_black_ink
- color: Black
entity: sensor.epson_xp_830_series_photo_black_ink
height: 200px
max: 100
min: 0
padding: 2px
target: 20
title_position: bottom
icon_position: inside
unit_of_measurement: '%'
width: 100%
Erorr:
Custom element doesn't exist: bar-card.
type: 'custom:bar-card'
columns: 5
direction: up
entities:
- color: MediumTurquoise
entity: sensor.epson_xp_830_series_cyan_ink
- color: MediumOrchid
entity: sensor.epson_xp_830_series_magenta_ink
- color: Gold
entity: sensor.epson_xp_830_series_yellow_ink
- color: Black
entity: sensor.epson_xp_830_series_black_ink
- color: Black
entity: sensor.epson_xp_830_series_photo_black_ink
height: 200px
max: 100
min: 0
padding: 2px
target: 20
title_position: bottom
icon_position: inside
unit_of_measurement: '%'
width: 100%
DrewXT
(Andrew)
May 18, 2020, 2:57am
517
the ink levels is very cool, @Mariusthvdb - do you have the code in github, or can you share it?
DrewXT:
or can you share it?
sure:
type: entities
title: Epson printer
show_header_toggle: false
entities:
- device_tracker.epson_printer
- entity: script.update_epson_cartridge_sensors
action_name: Update
- type: custom:hui-glance-card
style: |
ha-card {box-shadow:none;}
entities:
- entity: sensor.epson_ink_level_black
name: Black
- entity: sensor.epson_ink_level_cyan
name: Cyan
- entity: sensor.epson_ink_level_magenta
name: Magenta
- entity: sensor.epson_ink_level_yellow
name: Yellow
- entity: sensor.epson_ink_level_waste
name: Waste
- type: custom:bar-card
style: |
ha-card {box-shadow:none;}
bar-card-value {color:darkgrey;}
bar-card-title {word-break:break-all;}
stack: horizontal
entity_row: true
direction: up
entities:
- color: black
entity: sensor.epson_ink_level_black
name: Black
- color: cyan
entity: sensor.epson_ink_level_cyan
name: Cyan
- color: magenta
entity: sensor.epson_ink_level_magenta
name: Magenta
- color: yellow
entity: sensor.epson_ink_level_yellow
name: Yellow
- color: grey
entity: sensor.epson_ink_level_waste
name: Waste
height: 150px
max: 100
min: 0
target: 20
unit_of_measurement: '%'
width: 100%
positions:
icon: 'off'
- input_number.ink_level
- automation.printer_ink_alert
- type: custom:fold-entity-row
head:
type: section
label: Low ink levels
padding: 0
entities:
- type: custom:hui-glance-card
style: |
ha-card {
box-shadow: none;
background-image: url('/local/devices/epson/official/epson_background.png');
background-size: cover;
}
entities:
- entity: binary_sensor.ink_level_black_threshold
name: Black
- entity: binary_sensor.ink_level_cyan_threshold
name: Cyan
- entity: binary_sensor.ink_level_magenta_threshold
name: Magenta
- entity: binary_sensor.ink_level_yellow_threshold
name: Yellow
- entity: binary_sensor.ink_level_waste_threshold
name: Waste
be ware though, the bottom section for the glance card isn’t yet styled as I want it, (to use the full width of the card) Apparently Glance card behaves differently when styling is concerned.
1 Like
DrewXT
(Andrew)
May 18, 2020, 11:00pm
519
thanks mate…
I get an error I can’t resolve with the Bar Card… has anyone seen this before? doesn’t matter what I do with “indicator” it throws this error. was also throwing an error for title_position and rounding… Home Assistant running non-HASSIO on Raspbian - I suspect I’m missing a dependency but the logs aren’t telling me as much
From reading the documentation, aren’t inside
, outside
and off
the only possible settings for indicator:
? I’m probably wrong, but it might be choking on your use of auto
.
DrewXT
(Andrew)
May 19, 2020, 11:12pm
521
reste_narquois:
From reading the documentation, aren’t inside
, outside
and off
the only possible settings for indicator:
? I’m probably wrong, but it might be choking on your use of auto
.
it’s also supposed to have a default, but fails if I leave it blank as well…
Straight from the repo these are the valid options for postions
so you either need to select one of these or don’t put it in there at all if you want it auto