Lovelace: Mini Media Player

Hi there. Great card btw.
I have a question though: is it possible to combine google mini and sonos speaker in one group?
Thanks.

Hello,

You seem to have figured it out but many features of the card requires that they are implemented in the media player platform/component, sometimes they are implemented differently so results may vary.

I think the mute button should work, it’s at least implemented in the alexa (I think that’s what you use?) component. Try updating the component or open an issue in the component repository on github.

Hey, thanks!
I’m not sure but I don’t think so.
This is what I found when searching for info about it: Cannot group Sonos system with Google Home devices and the answer seem to indicate that it isn’t possible.

1 Like

Karl,

Two screen captures below. First is working fine, second is broken. Please let me know if I can help with this in any way. Both power and mute button work, as well as the sonos player controls. When bringing up the entity details dialogs, the controls are there.

I did install 1.5.1 after taking these captures, still see the problem there.

!

One of the recent updates caused the input select drop down list to appear behind other elements. Is there any way to prevent this?

Screenshot_2019-12-17 Home Assistant

Edit: reverting to v1.4.2 rectifies the issue.

Okay, I tried adding fallbacks to some CSS variables to see if that solved it, but I guess not.

If you could play around in the element inspector in chrome/firefox dev-tools that would be helpful. Try adding the style color: red; to the invisible buttons, try on the paper-icon-button or ha-icon elements for example and see if the icon become visible.

Thanks!

Yes, broke with v1.5.0 unfortunately, I’ve addressed the issue and it’s fixed in v1.5.1.

Nice card @tom_l, can you post code?

Unfortunately no, updating didn’t solve it. I restarted HA, reload the Lovelace config and did a “Shift” + reload in Chrome and FF. Still behind other entries.

Uninstall through HACS, remove the entry from Lovelace config, then install again (v1.5.1) add to Lovelace (or just use the add option with HACS) then restart HA. This way worked for me :slight_smile:

1 Like

Yeah strange, normally caching isn’t an issue when using HACS, but it seems it could be this time, thanks for sharing!

1 Like

Does this card allow styles? I use the following to round the corners on all of my cards but I cannot get it to work for this one.

    style: |
      ha-card {
        border-radius: 10px;
      }

@VMCosco Rounded corners work through the main theme, at least in my case. I have created a theme and used 10px rounded corners for the cards config. The entities of Mini Media Player adopts this as well automatically. See screenshot below.

Yes, I do however recommend setting border-radius through the default ha theme variable instead e.g.

    style: |
      :host {
        --ha-card-border-radius: 10px;
      }

You can also set it in your theme if you want it applied to all cards ha-card-border-radius: 10px

@ASNNetworks, nice setup!

3 Likes

Sorry to bother, but still no luck. But it changed it’s behaviour, so I’m thinking, the new version and cache shouldn’t be the issue.

Maybe it’s something on my side? :slight_smile:

I made a screenshot ( the buttons are just for demo in the picture). With the last version, the select menu is a little too much left (I’d say a minus padding).

Should I open an issue on Github?

1 Like

Hello,
Sure, would be helpful if you could provide the whole config from the screenshot (the media receiver card and the card above it).

Thanks!

@mitchell I like your idea any progress on that idea?

I try to change card height to minimum, but not working as I want:
card_height

      - entity: media_player.bedroom_tv
        hide:
          controls: true
          icon: true
          info: true
          name: true
          power: true
          source: true
        name: TV
        style: |
          ha-card {
            height: 50px;
          }
        type: 'custom:mini-media-player'

You’ll want to change the paddings of the mmp-player div.

To completely remove the paddings (16px is default):

style: |
  .mmp-player {
    padding: 0 !important;
  }
1 Like

I’ve started getting a few random errors in my log recently, anyone seen these?

https://xxxxx.duckdns.org/community_plugin/mini-media-player/mini-media-player-bundle.js:1:0 NotSupportedError: 'mmp-group-item' has already been defined as a custom element

and

http://172.16.x.x:8123/community_plugin/mini-media-player/mini-media-player.js:1:68553 NotSupportedError: Cannot define multiple custom elements with the same tag name

I have a few instances of media player running on a page, and everything still works… so not sure what this is related to

Sounds like your browser is somehow running the mini-media-player code twice.
Make sure you only have one resource reference for the card, you could also try clearing cache.

1 Like

Thank you! That fixed it, I guess when I used the HACS auto install option it added the “…bundle.js” but left the old method in there as well.