Lovelace: Mini Media Player

Playing with time was fun.

This is what I got for maths:

seek_position: " {{ ( as_timestamp(now()) - as_timestamp(state_attr(entity, 'media_position_updated_at')) + state_attr(entity, 'media_position') ) | float + interval }} "
3 Likes

Haha, that’s a long line :smile:

Ok, I need some help. I have really tried to get rounded corners on my artwork in mini media player. But I cant!

Here is the code:

- card:
                  artwork: full-cover
                  entity: media_player.spotify
                  hide:
                    controls: false
                    icon: true
                    info: false
                    mute: true
                    name: true
                    power: true
                    power_state: true
                    shuffle: false
                    source: true
                    volume: true
                  info: scroll
                  style: |
                    ha-card {
                      background: none;
                      box-shadow: none;
                      border-radius: 20px;
                      overflow: hidden;
                      width: 60%;
                      margin: 0%;
                      padding-top: 0px;
                      left: 8%;
                      top: 30px;
                    }
                  type: 'custom:mini-media-player'

And this is what I get:
PNG

It seems like none of background, box-shadow, border-radius, overflow is affected when changed. Only width, left etc makes a difference.
As you can see my artwork dont have border radius 20px, its only 10px as set in my theme!

Any help is appreciated!! :slight_smile:

Latest version of mini media player.

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

Seems like a bug, when the card is in collapsed config (e.g. volume and/or controls are hidden).
The only thing you should need to set is ha-card-border-radius in your theme.
I’ll fix it tomorrow.

Should now be fixed in the latest release.

I have a very simple configuration that adds a button to play a local radio station that uses m3u8:

      - type: custom:mini-media-player
        entity: media_player.suite_speaker
        artwork: cover
        info: short
        shortcuts:
          buttons:
          - name: Eldorado
            icon: mdi:radio
            type: music
            id: http://estadaohls-lh.akamaihd.net/i/estadaohls_1@301351/master.m3u8

How can I add a second button with a TuneIn radio station ?

Thanks

Still same issue
 :frowning:

Actually it seems to be a google chrome problem. It works on my ipad with safari, and on my android with edge and firefox but NOT on my computer or android tablet running google chrome? :o

Just installed the latest release and added the play_stop option, but when running the card and pressing the stop button i get the following:

Fallita chiamata a servizio media_player/media_stop 

Is it my fault in something or what?

I’m not sure about tuneIn, but to add another button, just do like this.
Media content is platform dependant so the id, type and even supported sources may vary between components.

      - type: custom:mini-media-player
        entity: media_player.suite_speaker
        artwork: cover
        info: short
        shortcuts:
          buttons:
            - name: Eldorado
              icon: mdi:radio
              type: music
              id: http://estadaohls-lh.akamaihd.net/i/estadaohls_1@301351/master.m3u8
            - name: Second station
              icon: mdi:radio
              type: music
              id: http://example.com/radio.m3u8

Clear cache maybe? Works as expected for me on Chrome after the latest update (which had the same issue as you had before).

Is it possible that your media player doesn’t support the stop service, what component is it?

Yes, I can add more buttons but can`t get them to play from TUNEIN.

Does anybody have a sample config of Mini Media Player playing from TUNEIN to a Google Home?

Check this, it’s from 2017 but might still be relevant:

media_content_id would be the id and media_content_type would be the type in the shortcut.

Found the issue, I tried update using the HACS. But apparently that did not work.
So i did a manual update instead using the latest mini-media-player-bundle.js.

And now it works!! Perfect
 Thank you Very much for your help! :+1:t2::blush:

1 Like

Great!
The resource reference for the card changed in HACS a few months back so if that was the problem you might have to update it (if you want to use the card with HACS in the future).

2 Likes

Yes, you’re right, it seems this option doesn’t work on amazon echo show
 tried another media player and this works!

1 Like

Can someone help me get the grouped cards working? Im trying to follow the example in the docs (see below) but Im a bit confused. The initial multi-room player
how do I create that? Right now, I have 3 seperate sonos speakers in different rooms that I would like to group together.

- type: entities
  entities:
    - type: custom:mini-media-player
      entity: media_player.multiroom_player
      group: true
      source: icon
      info: short
      hide:
        volume: true
        power: true
    - type: custom:mini-media-player
      entity: media_player.kitchen_speakers
      group: true
      hide:
        controls: true
    - type: custom:mini-media-player
      entity: media_player.bathroom_speakers
      group: true
      hide:
        controls: true
    - type: custom:mini-media-player
      entity: media_player.bedroom_speakers
      group: true
      hide:
        controls: true
    - type: custom:mini-media-player
      entity: media_player.patio_speakers
      group: true
      hide:
        controls: true

It is pretty obvious in the ha source what services the player supports.

The example you’re looking at is simply displaying how you can group several mini media player cards into “one card”, it’s just a layout example and won’t provide any extra features or functionality.

See the Speaker group management example instead, I think that’s what you’re looking for.

Can anyone help with the shortcut buttons on this card:

I was hoping to add buttons to select “sources” that I have set up in my SkyQ component.

I have buttons that work with this code, where switch.skyq_bbconelounge will make bbc one play on sky

      - type: custom:button-card
        entity: switch.skyq_bbconelounge
        show_entity_picture: true
        show_name: false
        show_icon: false
        show_label: false
        show_state: false
        styles:
          card: 
            - padding: 0px
          img_cell:
            - justify-content: start    
        entity_picture: "/local/images/remote/bbconefaded2.png"

And the config for the sources is this:

    skyq_bbconelounge:
      value_template: '{{"off"}}'
      friendly_name: 'BBCOne in the Lounge'
      turn_on:
        service: media_player.select_source
        data:
          entity_id: media_player.skyq
          source: 'BBCOne'

But no idea what option I need in the media card for “type” and for “id”

Thanks

This shortcut would do the same thing as your button, but I don’t really see the need for the switch, as you could just call media_player.select_source directly.

- name: example name
  type: service
  id: switch.toggle # or turn_on, not sure which one you want.
  data:
    entity_id: switch.skyq_bbconelounge

And if the media player entity of which source you want to change is the same as the card entity, you could just do:

- name: example name
  type: source
  id: BBCOne

Thanks. I am happy to not use the button, I just could not get the source to work. Will give that a try when I get home.