Lovelace: Mini Media Player

Share your Projects! Dashboards & Frontend
3075

Sorry the conversation has got confused. I was replying to @RobertJB

3076

I wondered if anyone had found a way to pop-up the media browser from a button/shortcut on the mini media player. The media control card has it available, but its lack of customiseability is terrible. I canā€™t figure out a way to do it, but wondered if anyone else had worked it out. I know we can tap on the card for more info and get it there, but thatā€™s not very intuitive.

3077

Trying to fire a browser-mod popup off a shortcut button but Iā€™m not getting much luck. Keep getting the error Failed to perform the action fire-dom-event/undefined. required key not provided @ data['service']. Got None.

The popup works fine in tap_action on the entire card though. Using the light & telephone buttons to test the browser-mod service.

type: custom:mini-media-player
entity: media_player.android_tv_192_168_1_216
name: Main Hall Cast
source: icon
artwork: material
shortcuts:
  columns: 4
  hide_when_off: true
  buttons:
    - icon: mdi:lightbulb
      type: service
      id: light.toggle
      data:
        entity_id: light.main_hall_lights_l2
    - icon: mdi:phone-classic
      type: service
      id: fire-dom-event
      data:
        action: fire-dom-event
        browser_mod:
          service: browser_mod.popup
          data:
            title: Tablet Setup
            timeout: 200
            content:
              square: true
              columns: 3
              type: grid
              cards: null
    - icon: mdi:remote-tv
      type: service
      id: fire-dom-event
      data:
        action: fire-dom-event
        browser_mod:
          service: browser_mod.popup
          data:
            title: Cast Controls
            dismissable: true
            size: normal
            card_mod:
              style: |
                ha-dialog$:
                  div.mdc-dialog div.mdc-dialog__scrim {
                    backdrop-filter: blur(5px);
                  }
                ha-dialog {
                  --vertical-align-dialog: center !important;
                  --mdc-dialog-min-width: 50px;
                  --mdc-dialog-max-width: 400px;
                  --mdc-dialog-min-height: 350px !important;
                  }
            content:
              type: vertical-stack
              cards:
                - type: custom:android-tv-card
                  card_mod:
                    style: |
                      }    ha-card {
                      margin-bottom: 20px;    }
                  remote_id: media_player.android_tv_192_168_1_216
                  keyboard_id: media_player.android_tv_192_168_1_216
                  media_player_id: media_player.android_tv_192_168_1_216
hold_action:
  action: more-info
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    data:
      title: Cast Controls
      dismissable: true
      size: normal
      card_mod:
        style: |
          ha-dialog$:
            div.mdc-dialog div.mdc-dialog__scrim {
              backdrop-filter: blur(5px);
            }
          ha-dialog {
            --vertical-align-dialog: center !important;
            --mdc-dialog-min-width: 50px;
            --mdc-dialog-max-width: 400px;
            --mdc-dialog-min-height: 350px !important;
            }
3078

I am a newbie to mini media player and I have the card on my dash to control a mini pc (Libreelec/Kodi).

I have a seperate card using WOL to turn the pc on, is it possible to use the power button on the media player card to do this? Effectively intergrate the WOL button to the player card?

If anyone has any suggestions I would be ever so grateful.

3079

Welcome to HA!

Your best bet is probably to create a new media player entity using the Universal Media Player integration, and then use that on the card.

This should allow you to set the turn_on action to your WOL action.

3080

and nobody answerdā€¦ Iā€™m looking for the same thing.
@nickrout not everybody is as good as you and comes here to ask (maybe for you) silly questions, but even after reading the manual and searching for hours I also havenā€™t found the answer,

3081

At a guess card-mod.

3082

Hi @SirMarco, Donā€™t know if you found a solution.
But Iā€™ve found a temporary ā€œdirtyā€ solutionā€¦
If you go to the file www\community\mini-media-player\mini-media-player-bundle.js
edit line 1013 from height: 24px; to (in my case I took) height: 95%; the images will be resized.
question still stays (as we otherwise need to change this at every update ;-)) if anyone knows the correct card-mod syntax, please enlighten me as Iā€™ve tried all of them, but they never got changedā€¦

3083

This works for me:

type: custom:mini-media-player
card_mod:
  style:
    mmp-shortcuts $:
      div.mmp-shortcuts__buttons mmp-button.mmp-shortcuts__button div: |
        img {
          height: 95% !important;
        }

Canā€™t say I like the result much - it depends on the size of the original image I suppose. With the larger images I use, it makes the buttons ridiculously proportioned. The fixed height is there to constrain the button height I guess.

Is the solution to just use a larger image with the smallest margins possible?

3084

@reste_narquois youā€™re a champ!
Thanks thatā€™s what Iā€™ve been looking for. % isnā€™t really doing what itā€™s supposed to, but when I change it tot 60px is really what I want :wink:

1 Like
3086

Helo all! I am looking for some inspiration for my NSPanel Pro music dashboard, as I am done with the mini media player section what I donā€™t have figured out is a beautiful and elegant solution to select/browse music when you tap on the card. Any of you implemented such a solution, would you mind sharing? Thanks!

3087

Hallo!
I want to use the mini media player zu hear radio on the EchoDot

This card i have;
grafik

This is my radio station:
Radio 21

I tried this. But it does not work!

type: media-control
entity: media_player.gunters_echo_dot
artwork: cover
info: short
shortcuts:
  buttons:
    - name: Radio21
      icon: mdi:radio
      type: music
      id: https://radio21.streamabc.net/radio21-hannover-mp3-192-3735655

so i need some help!

3088

it show something like this:

grafik

3089

Translate please :slight_smile:

3090

If you want to use the mini media player card, you should use
type: custom:mini-media-player
I have no idea, what ā€œmedia-controlā€ is :slight_smile:

3091

@EddieFAF I change the type and it looks better :grinning:
When i switch the play button i hear no music.
Do I actually have to change the configuration.yaml?
Or can I make all the settings on the mini media card?
Do you perhaps have a code that I can use where I only change the url of the radio station

grafik

3092

Please look at the very extensive docs.

3093

Would you care to share the musiccast-logo-new.png? Thank you.

3094

@BobMac57 Hallo, sorry i dont now what you mean!

3095

Hallo @ All
I tried it another way:

HA - Automation - Script - made a new script
in yellow: The media player does not support media browsing

grafik
grafik1110Ɨ415 20.4 KB

yaml mode:

action: media_player.play_media
target:
  entity_id: media_player.gunters_echo_dot
data:
  media_content_id: media-source://radio_browser/e417eec8-b2ad-466f-9a3c-ce4abd05c37a
  media_content_type: music
metadata: {}

The result on the EchoDot is:
to send TTS; please send annouct like true; music cant be played this way

What mistake am I make?