A different take on designing a Lovelace UI

Awesome, thank you :slight_smile:

I’ve recently implemented much of the latest update, migrating to split button card templates and such.

I know this repo doesn’t use graphs on button card but I pulled my code for them from @mobiustorr’s post here.

Since the update they still appear correctly on firefox, even when simulating my phones model (resolution etc):
image
however, in the HA mobile app, the height suddenly doesn’t behave the same as before:
image

I’m wondering if something has been set for mobile view elsewhere in the code that is causing this.
If anyone has run into the same issue or has some insight on this, it’d be much appreciated!

@ LafferAndré, i see you have a shield (its in your sidebar code), do you know if its possible to get the id of the current YouTube video playing out of the shield?
I’m thinking of getting one but id like to know if that’s possible before I do.

Hello everyone, has anyone tried that the sidebar would display not only which device is on, but also in which room?

The Android TV does not show any YouTube media title. But you can get that by using the builtin Chromecast. Add that to HA.

Welcome @cnfhm
its not possible to get the area of an entity in a template, as far as I know.
but you could have an array of lights for each room
so this

          {% set lights = [
            states.light.vardagsrum_tv,
            states.light.vardagsrum_golv,
            states.light.vardagsrum_horna,
TIMED

would become this

          {% set lights_bedroom = [          
            states.light.studio_spot_2,
            states.switch.deltaco_sh_p01_socket
          ] %}
          {% set lights_kitchen = [          
            states.light.sovrum_mattias,
            states.light.sovrum_sanja,
          ] %}

ect…
OR
you could use groups if you have them set up for each room.

{{ expand('group.luces', 'light.whatever') | selectattr('state','eq','on') | list | count }}

and then build the string up from that.
the only issue I can see is depending on the number of rooms you have it might get a bit long.

so if I open the app on the shield and start watching YouTube, the Chromecast integration connected to the shield will have details of what video is playing?

how about Plex and Netflix, playing / paused state?

right now I have an LG with web OS, control is fantastic, opening an app ect works well, but there is no nice way to get data out, eg what is playing on YouTube, or even playing / paused state for anything.

I want to upgrade and I’m 40% for the shield and 35% Apple TV and 25% any other Chromecast

That is correct. Same for Plex and Netflix.

Personally, I like the Apple TV alot more. But it depends on what’s important to you.

The only reason I got a Shield was for full Lossless Atmos support with Plex.

The Apple TV with the Infuse app worked great. It handles large remuxes perfectly. But I recently mounted in-ceiling speakers, and the only way to get the full Atmos experience was with Shield.

The Apple TV is more stable in my opinion, and it generally runs really smooth. I’ve always found Android to lock up and stutter in places where the Apple TV just don’t.

… But the Shield has been working great for Plex streaming so far. :crossed_fingers:

thanks for the info, iv been looking into the Android TV integration and could not find anything on what details I could get out of it

Atmos support is one of the selling points for me as well, and the 2ed is the HA integration.

now that I know I can get details out of the shield ill pick one up next time I have the opportunity.

The main automation I have set up with my tv at the moment are, open YouTube open Plex and open Netflix. when looking into the Apple TV to do the same automation its “left 3 times then select” and that just sounds like a pain to deal with. and I’m a Apple Mac/iPhone user so for me its odd not going with apple but with the limited HA integration I’m not not that keen on the Apple TV.

Is it only for me that HACS from the update panel does not open?

Hi,I updated the latest code. But the media center do not work it right.
they can’t switch.

homeassistant:
  customize:
    media_player.mibox4:
      friendly_name: Mibox
    media_player.spotify.slwl:
      friendly_name: Spotify
    media_player.emby_mibox4:
      friendly_name: Emby
    media_player.forked_daapd_server:
      friendly_name: LISO  

template:
  - select:
      - name: conditional_media
        state: >
          {% set recently_added = 'Media Center' %}
          {% set paused_timeout_minutes = 15 %}
          {% set media_players = [
            states.media_player.mibox4,
            states.media_player.emby_mibox4,
            states.media_player.spotify_slwl,

Are you saying that you will get the info of what is playing within Netflix or Plex with an Nvidia shield? I configured my Nvidia shield with Google Cast integration and not getting the show being played only the app name.

volume_level: 0.46666666865348816
is_volume_muted: false
app_id: Netflix
app_name: Netflix
entity_picture_local: null
icon: mdi:television-guide
friendly_name: Master Bedroom Shield
supported_features: 21389

How do you get the live camera view with the button cards?

I have the same issue and I think I found a fix. Add a padding to the BASE /* phone */ section of the “extra_styles.yaml”. I’m having an issue where the mini-graph-card is wider in the mobile view, so I’ll need to add in a setting to narrow it.

        /* phone */
        @media screen and (max-width: 800px) {
          #name, #state {
            font-size: calc(var(--button-card-font-size) * var(--card-phone));
          }
          #graph {
          padding: 15%;
          }
        }
1 Like

Yes, tested it yesterday.

1 Like

The cards are not showing a live feed. They need to be clicked. Then a popup shows the live feed. These are entity pictures that update when the camera updates.

However, its on my to-do list to have the pictures update whenever a camera detects movement.

Hi André, could you please share your blinds and sensors detection icons code? Your dashboard looks great, I’m checking all your posts to improve mine.

1 Like

As the Apple TV is treated as a media_player, I think you could use Select source to do what you want here.
I could test this out for you if you’d like.

1 Like

Sure thing. I’m actually working on those right now, but I’ll share them shortly.

2 Likes