Sorry, I made a mistake. This is the real log
how would i please make this change colour on “max temp reached”
- type: custom:button-card
entity: sensor.myenergi_eddi_21533936_status
name: <marquee behavior=scroll scrollamount="3">Eddi Status</marquee>
variables:
state_on: >
[[[ return ['Max temp reached'].indexOf(!entity || entity.state) !== -1; ]]]
custom_fields:
icon: >
<ha-icon icon="mdi:shower"></ha-icon>
template:
- base
Hello, are you still there? “I reset it and now it can download the cover of plex to my folder, but it still doesn’t display any data.”
Have you installed and updated both of these?
“I have installed both of these plugins, and the recently added images of EMBY all display normally. Only PLEX does not work. I really don’t know what to do, please help me.”
I am pleased to inform you that after I uninstalled and reinstalled “sensor. plex_recently_added”, it works normally and can display data. What should I do next?
“Now, I set the media card for” ui overlay. yaml “to Plex Recently Added Movies. It can display images normally, but the images are very blurred. It appears to display the background image of the movie instead of the cover page of the movie, and this card does not automatically select the media being played and automatically switch the background. It only displays the recently added images of Plex. Please tell me what to do?”? thank you
I saw that you set a pretty low resolution in the sensor. That’s propably why… Bump it up to 800 instead of 200.
If you want recently added to display something else, I think you have to tinker with this, in the conditional_media template:
- background-image: &media_background_image >
[[[
if (entity) {
if (entity.state === "Active") {
return entity.attributes.data !== undefined
? `url("${entity.attributes.fanart}"), url("${entity.attributes.poster}")`
: `url("${states[variables.entity_picture].attributes.entity_picture}")`;
}
else {
return entity.attributes.data !== undefined
? `url("${entity.attributes.data[variables.i].fanart}"), url("${entity.attributes.data[variables.i].poster}")`
: `url("${states[variables.entity_picture].attributes.entity_picture}")`;
}
}
]]]
Try switching around the poster and fanart. But keep in mind that this probably affects more than just “recently added”.
I don’t have time to look at any more right now, but I’ll get back to you when I get a chance - unless someone else steps in.
2 Likes
nice job @Laffer i’m hopeless with the conditional_media stuff, mine still only works 80% of the time like right now…
i’m going to look over all the work you just did and see if I can fix mine
1 Like
Okay, thank you very much for your help. How should I modify this string of code
After I modified fanart to cover, the cover now displays correctly. It does not display the background image, but instead displays the cover. The incomplete display of the background image may affect the aesthetics. Now it is perfect, but it still cannot automatically switch between the media being played. For example, if I am currently viewing a video from emby, it cannot display the media images and information being played by emby. It always shows recently added pictures
Hi, can I use this animated icon in a custom button card that has other entity?
The button is as follow:
entity: light.test_light
name: Test
type: custom:button-card
styles:
grid:
- grid-template-areas: >-
"n n" "mot window" "icon icon"
.......
custom_fields:
icon: ########animated icon here#########
so the entity is light.test_light.If I put the following animated icon code in custom_fields :
icon: >
[[[ const state = entity.state === 'on' ? 'animate' : null; const style
= '<style>@keyframes animate_on{from{transform: scaleY(0);}to{transform:
scaleY(1);}}.animate_on{animation: animate_on 1s; transform-origin:
-100% 46%; animation-fill-mode: forwards;}@keyframes
animate_off{from{transform: scaleY(1);}to{transform:
scaleY(0);}}.animate_off{animation: animate_off 1s; transform-origin:
-100% 46%; animation-fill-mode: forwards;}</style>'; const path = '<path
d="M46 9.2v27.5H4.1V9.2H46m2.4-2.4H1.6v32.3h46.7c.1 0
.1-32.3.1-32.3zM11.9 43.2h26.3c.6 0 1.1-.4
1.1-1v-.3c0-.6-.4-1.1-1-1.1H11.9c-.6 0-1.1.4-1.1 1v.3a1.11 1.11 0 0 0
1.1 1.1z"/>'; const gradient = '<linearGradient id="A"
gradientUnits="userSpaceOnUse" x1="5.401" y1="34.714" x2="43.817"
y2="11.74"><stop offset="0" stop-color="#64acb7"/><stop offset="1"
stop-color="#7fdbe9"/></linearGradient>'; if (entity.state === 'off'){
return `<svg fill="var(--button-card-light-color-no-temperature)"
viewBox="0 0 50 50"> ${style} ${gradient} <path class="animate_off"
d="M2.9,8h44.3v29.9H2.9V8z" fill="url(#A)"/> ${path} </svg>`; } if
(entity.state === 'on'){ return `<svg fill="#9da0a2" viewBox="0 0 50
50"> ${style} ${gradient} <path d="M2.9,8h44.3v29.9H2.9V8z"
fill="#20262890"/><path class="animate_on" d="M2.9,8h44.3v29.9H2.9V8z"
fill="url(#A)"/> ${path} </svg>`; } if (entity.state === 'on'){ return
`<svg viewBox="0 0 50 50"> ${gradient} <path d="M2.9,8h44.3v29.9H2.9V8z"
fill="url(#A)"/> ${path} </svg>`; } else if (entity.state==='off') {
return `<svg viewBox="0 0 50 50"> ${path} </svg>`; } ]]]
(Mattias code for tv animation) will work and animate if light.test_light is toggled, but I want to use another entity state to animate/show the icon It is possible?
Thanks!
Great God, thank you very much for solving the problem that has been bothering me for several days. I haven’t had a good rest for this for a long time, and there are still issues that haven’t been resolved yet. When I play an emby video, I hope that the film cover and information will automatically switch to the recent addition of plex to the card. As the author said, there will be no viewing activity after 15 minutes, and the latest addition of plex images will be automatically displayed, I think you need a cup of coffee or beer. Thank you very much for your work. I’m from China. How can I pay for coffee? Thank you
1 Like
That’s kind of you, but there is no need for that. Thankfulness is my currency at the moment 
In case you were expressing your gratitude towards Mattias, I think there’s a link.
As for your other issue, please confirm that your friendly names match - before we troubleshoot any more.
Take my ‘Apple TV 1’ as an example. Make sure that the name (friendly_name) is matching everywhere.
The entity itself - and under media in lovelace.yaml
And also, while testing to stream video, check Developer Tools to see if ‘select.conditional_media’ is updating.
1 Like
Okay, thank you. I’ll try it later. I have two more questions to ask you. I have an air conditioner with a temperature and humidity sensor. I want to add it to the card using the “Climate” template, but no matter what I do, it will report errors. Please help me.
button_card_templates/climate.yaml
climate_base:
show_icon: false
styles:
name:
- padding: 12px 13px
- font-size: 0.8em
- font-weight: 600
card:
- border-radius: 10px
climate_fan_mode:
variables:
fan_mode: false
tap_action:
action: call-service
service: climate.set_fan_mode
service_data:
entity_id: >
[[[ return !entity || entity.entity_id; ]]]
fan_mode: >
[[[ return variables.fan_mode; ]]]
styles:
card:
- background-color: >
[[[
return !entity || entity.attributes.fan_mode === variables.fan_mode
? "rgba(158, 158, 158, 0.2)"
: "rgba(189, 189, 189, 0.05)";
]]]
template:
- climate_base
climate_swing_mode:
tap_action:
action: call-service
service: climate.set_swing_mode
service_data:
entity_id: >
[[[ return !entity || entity.entity_id; ]]]
swing_mode: >
[[[
return !entity || entity.attributes.swing_mode === 'off'
? 'on'
: 'off';
]]]
styles:
card:
- background-color: >
[[[
return !entity || entity.attributes.swing_mode === "on"
? "rgba(158, 158, 158, 0.2)"
: "rgba(189, 189, 189, 0.05)";
]]]
template:
- climate_base
ui-lovelace.yaml
- type: custom:button-card
entity: climate.acn05_cloud_419957
name: ac
template:
- base
- climate
- icon_climate
Another issue is that I have a Chromecast that can be automatically discovered by Home Assistant and automatically added to the device. When I play YouTube videos on Chromecast, it does not display the thumbnail of the video on the card, and other streaming media software does not display the thumbnail. I tried to delete it and add it again, but it still remains the issue. I saw that someone else’s Chromecast can display the thumbnail of the video normally on the forum, If you have this device, please tell me what caused it.
“I changed the names to be consistent, but it still didn’t work. I checked select.conditional in the developer tool.”_ Media status. I found it didn’t take effect. What should I do
If I copy your yaml code and paste it in my environment, I get the same result.
That’s because I have no entities with these names.
That leads me to belive that your entity names are wrong in this case.
Compared with mine
So… Go through all of these entities and get the names so you can update the yaml code.
Do not get confused with entity names and the friendly name.
I have made all the changes as you said, but it still has no effect. If this is not possible, it doesn’t matter. As long as the cover of Plex can be displayed, can you help me see how to solve the air conditioning and Chromecast issues I mentioned above?