I tried to implement “marquee” into my calendar template.
Sadly I cant get the sensor to show the value 
event1: |
[[[ return "<marquee>states['calendar.karls_kalender'].attributes.message</marquee>" ]]]
[[[ return `<marquee>${states['calendar.karls_kalender'].attributes.message}</marquee>` ]]]
1 Like
Thanks!
Its probably not easily possible to just let the text scroll, if it doesn’t fit on the button and otherwise stay static ? 
use variables state_on and return true when you want the button to be on and false when you want it to be off
this might work.
state_on: >
[[[ return !entity || entity.state > 50; ]]]
NOTE: untested code as I am on my phone
1 Like
thanks for the input
so something like this?
- type: custom:button-card
entity: sensor.myenergi_eddi_21533936_internal_load_ct1
name: <marquee behavior=scroll scrollamount="3">Eddi kWh Usage</marquee>
state_on: >
[[[ return !entity || entity.state > 50; ]]]
custom_fields:
icon: >
<ha-icon icon="mdi:power-plug"></ha-icon>
template:
- base
no it would be
- type: custom:button-card
entity: sensor.myenergi_eddi_21533936_internal_load_ct1
name: <marquee behavior=scroll scrollamount="3">Eddi kWh Usage</marquee>
variables:
state_on: >
[[[ return !entity || entity.state > 50; ]]]
custom_fields:
icon: >
<ha-icon icon="mdi:power-plug"></ha-icon>
template:
- base
1 Like
exellent thank YOU
working!!!
Hey Mason, which line do I change in your code so that the charge and circle always stays colored?
Right now it’s only colored when state is on.
I would also like the percentage text be colored too.
Thanks
hey @pedolsky
It is working, but if the attribute is not defined I get a undefined value back.
I tried to solve it with if but wasn’t successful.
event1: |
[[[
if (states['calendar.karls_kalender'].attributes.message != 'none' ){
return `<marquee behavior=scroll scrollamount="3">${states['calendar.karls_kalender'].attributes.message}</marquee>`}
]]]
Further more, is it possible to just let the value marquee if the value is too long?
Thanks in advance.
1 Like
I’ve never dealt with the subject.
[[[
var x = states['calendar.karls_kalender'];
if (x.attributes && x.attributes.message)
return `<marquee>${x.attributes.message}</marquee>`; return 'keine Ereignisse'
]]]
or if it is your button card entity:
[[[
if (entity && entity.attributes && entity.attributes.message)
return `<marquee>${entity.attributes.message}</marquee>`; return 'keine Ereignisse'
]]]
Amazing work, Mattias. Everybody wants to copy, but you really have a great concept behind your screens and they show the right amount of information, which is so important for our dashboards.
As you receive lots of inquiries to share your code, could you possibly share this as well?
Thanks for your great contribution to get great dashboards into our homes!
change this line so the 1st ternary operator that is looking at variables.state_on is removed this will make it so the line is always coloured,
use this link as a guid to ternaries Conditional (ternary) operator - JavaScript | MDN
circle_stroke = variables.state_on ? entity.attributes.battery_level < 10 ? "red" : entity.attributes.battery_level < 60 ? "yellow" : "green" : "#b2b2b2",
the text colour is set via fill on this line right now it is set to #8d8e90
<text x="50%" y="54%" fill="#8d8e90" font-size="14" text-anchor="middle" alignment-baseline="middle" dominant-baseline="middle">${inner_text}%</text>
try setting fill to the value of circle_stroke (might want to rename it) using string interpolation (or string templates, same thing different name )
see this link JavaScript Template Literals
If you run into any issues post what you get and I will see if I can help
1 Like
is there a way to scroll the text for a entity: sensor ?
for example the text in the button/tile is cut off
I have scrolling text on the name but not the entity
name: <marquee behavior=scroll scrollamount="3">Zappi Status</marquee>
Mason
Would you know how to have the button light up a different colour? at the moment its white.
would be cool to be like white @ 50w, yellow at 100w and red at 200w
If you change background-color in base (button-card-templates) I get this.
styles:
card:
- background-color: >
[[[
return variables.state_on
? 'rgb(50,100,200)'
: 'rgba(115, 115, 115, 0.25)';
]]]
1 Like
was that for me?
i tired this code on another button which has different charged states for my car but its permently on (lit)
i changed the state of 50 to “completed”
- type: custom:button-card
entity: sensor.myenergi_zappi_20197616_status
name: <marquee behavior=scroll scrollamount="3">Zappi Status</marquee>
variables:
state_on: >
[[[ return !entity || entity.state || Completed; ]]]
custom_fields:
icon: >
<ha-icon icon="mdi:car-electric"></ha-icon>
template:
- base
this line is wrong
[[[ return !entity || entity.state || Completed; ]]]
you have said, be on when you don’t have an entity OR the entity has a state OR Completed.
this section is not valid code || Completed; I think you want something like
[[[ return !entity || entity.state === "Completed"; ]]]
OR
state_on: >
[[[ return ['Completed'].indexOf(!entity || entity.state) !== -1; ]]]
as I don’t know what the state of your entity is I can’t help more than that
thank you very much let me try these
i think there are 3 states (paused, completed, charging)
