Lovelace: Mini Media Player

[kalkih (Karl Kihlström)]

@poldim

Thanks for the great card. I’m having a bit of trouble figuring out the correct config with the shortcut/button feature. I’d like the button to turn off a switch. I tried this last night and it was turning off all switches in HA. How can I direct it only to my desired switch?

Hmm, config looks correct, what could be the issue here is if your browser is loading an older version of the card where the data option wasn’t added/supported yet. If that’s the case the service call would be sent without the entity_id parameter specified and therefore target all switch entities.

Make sure you’re on the latest version of the card, try clearing cache.
If you’re using HACS, check this issue (the info there is relevant for this card as well).

@QbaF

Special needs. My mmp is not with cover by mmp but it has cover in background. While other cards backgrounds are light, changing thr secondary-text-color do not suit.
If it is possible to add the variable for that colors in a future I’ll appreciate it. Nothing urgent.

Yes, could possibly add.
I think you could set --secondary-text-color in the wrapping card with card-mod and it should only apply to the nested cards. So you could try setting it on the wrapping card, the vertical-stack-in-card or whatever card you’re using.

# example
style: |
  :host {
    --secondary-text-color: red;
  }

Let me know if that works.

[QbaF]

Works. Also works

style: |
  div.entity__info__media {
    color: red;
  }

but not if You have separate themes for night and day.

[kalkih (Karl Kihlström)]

A clever thing you can do is create your own theme variables.

In your theme:

my-own-var: red

In card-mod

style: |
  div.entity__info__media {
    color: var(--my-own-var);
  }

[poldim]

@kalkih

try clearing cache

That did the trick, thanks.

[QbaF]

Is there any place where one can find how to stream from MMP to Chromecast Audio from Spotify/Google Music/YouTube Music.
I am searching and searching and only found how to stream radios..

[kalkih (Karl Kihlström)]

I think public url’s to streams/files are the only thing really supported directly through the cast component.
For Spotify and other stuff you would need to go through additional steps, you could set up services which you then call with shortcut buttons in mmp.

See spotcast and assistant-relay, Spotcast is a component with which you can initiate spotify playback on cast devices. Assistant-relay is a bit more complicated to set up, but when you got it running you can through http requests get it to do basically anything google assistant can do, like starting youtube and spotify on specific device, broadcast messages etc…

[Kabala (Cata)]

Hello Kalkih,

does mini media player support logitech media server?
Group Player with logitech media server?

If not, could you implement that?

Thank you.

[nickrout]

Yes it supports LMS. No it doesn’t support grouping on LMS.

[kalkih (Karl Kihlström)]

As nick said, yes and no.

About implementing LMS grouping support, please see this issue #182 and the last reply in particular.

[snel6424 (Colton S.)]

So I don’t know what the deal is, but I am having a terrible time getting this card to load. I have got to be doing something wrong. I have copied and pasted what my code is below, as well as how I have my code in the raw config portion of the Lovelace gui.

I have the mini-media player downloaded through HACS.

The following is the error that pops up: Cannot read property ‘setConfig’ of undefined

- entity: media_player.kitchen_google_home
  type: 'custom:mini-media-player'

  - type: module
    url: /local/mini-media-player-bundle.js?v=1.4.2

[nickrout]

If you installed via hacs the correct format is

- url: /community_plugin/mini-media-player/mini-media-player-bundle.js
  type: module

[snel6424 (Colton S.)]

@snel6424

Cannot read property ‘setConfig’ of undefined

I fixed that, but I am still getting the “Cannot read property ‘setConfig’ of undefined” error. Any ideas?

[Roffolo (Raffaele)]

Hello. I want play a specific playlist when i click on cat button but where i can find id?

entity: media_player.echo_cucina
type: 'custom:mini-media-player'
shortcuts:
  column: 2
  buttons:
    - icon: 'mdi:cat'
      type: playlist
      id: 'id playlist'
    - icon: 'mdi:dog'
      type: source
      id: Bathroom

[kalkih (Karl Kihlström)]

Hey!
The id is media player component specific, so the format ans supported id’s vary.

You seem to be using the alexa media player component right?
If so, here are some examples alexa_media_player/wiki#play-music (expand the service examples dropdown), media_content_id equals id in the shortcut and media_content_type equals type.

[maurizio53 (Maurizio Fabiani)]

@kalkih Is there a way to stylish the buttons inside the shortcuts with css elements? And if yes, how? Examples?
And more, i’d like to change also the text color of the infos but without putting anything inside theme variables… Is it possible with the style option?

[Dansker]

Karl,

Have a really annoying UI issue: On some Samsung tablets, using either the Chrome browser or the new Home Assistant Android app, the yellow/black power button disappeared from the UI, but the “area” is still functioning. This happened first about 1 month ago, now the mute icon is also missing. Have cleared cache, no fix. Also, just noticed he play/stop/shuffle buttons are missing when using a Sonos device with your player (with full album art).

For the same site, some tablets work, some not. Even with the tablets on site being the same brand/model (Samsung S2).

I noticed a GitHub post about invalid icon color fix, but that apparently does not apply to these issues.

Not missing any icons anywhere else. Something that might be caused by your code ?

Other than this, your media player is working just GREAT !

Happy Holidays to you and your family.

[samgreco]

@kalkih

russound

Actually, don’t worry about it. I used the group media entity and it looks and works exactly how I want it to. Thanks!

I know this was a while ago, but would you mind sharing your code? I have a Russound RIO device and will be feeding Squeezeplayers to 3 of the inputs. I would love to make this work. Also, have you figured out a way to use the tuner in this?

This was actually meant for @Hisma

[kalkih (Karl Kihlström)]

@maurizio53

@kalkih Is there a way to stylish the buttons inside the shortcuts with css elements? And if yes, how? Examples?
And more, i’d like to change also the text color of the infos but without putting anything inside theme variables… Is it possible with the style option?

Styling the shortcuts could be hard without modifications to the source code. I would recommend combining a mini-media-player card with a stack of button-cards (which you can customize/style to your hearts content) and wrap it all up inside a vertical-stack-in-card or similar.

You could try styling the shortcuts with card-mod, the shortcuts are in their own shadow DOM so styling them could be hard but check the advanced usage and the $ key in particular.

Changing the media information text color to red with card-mod:

- type: custom:mini-media-player
  ...
  style: |
    :host {
      --secondary-text-color: red;
      --mini-media-player-media-cover-info-color: red;
    }

mini-media-player-media-cover-info-color is only necessary if you’re using artwork: cover options.

@Dansker

Have a really annoying UI issue: On some Samsung tablets, using either the Chrome browser or the new Home Assistant Android app…

Yes, I’ve seen a few reports of this exact issue before but I’ve never been able to recreate it or experienced it myself. It seem to be very random which makes it tough to debug unfortunately.
I’ll try the new HA android app, perhaps I can reproduce it there.

The play/stop/shuffle buttons issue with Sonos, do you think that’s the same issue, are they still there and just not visible? or are they not there at all? a screenshot would be great!

The invalid icon color issue fixed in the last update was only affecting the entity icon.

Thank you Erik,
Happy holidays!

[maurizio53 (Maurizio Fabiani)]

@kalkih

Styling the shortcuts could be hard without modifications to the source code. I would recommend combining a mini-media-player card with a stack of button-cards (which you can customize/style to your hearts content) and wrap it all up inside a vertical-stack-in-card or similar.

Thanks for the infos… but really don’t understand what you mean here… do you have any example?

[kalkih (Karl Kihlström)]

Something like this:

- type: custom:vertical-stack-in-card
  cards:
    - type: custom:mini-media-player
      entity: media_player.example
      ...
    - type: horizontal-stack
      cards:
      - type: custom:button-card
        ...
      - type: custom:button-card
        ...
      - type: custom:button-card
        ...