The card: parameter does not accept a list of cards.
also picture glances require entities, i.e. entities needs at least 1 entity.
It actually works with an empty list too.
1 Like
Hi Thomas,
i tried everything but just donāt see it, can you help me a little here?
I get no errors anymore, but if I click on the icon not happens, no popup, no error?
This works
- entity: media_player.sonos_one_dressing
style:
left: 40.5%
top: 56%
tap_action:
action: call-service
service: browser_mod.popup
service_data:
card:
entities: null
entity: media_player.sonos_bureau
hide:
icon: false
power: true
source: true
speaker_group:
entities:
- entity_id: media_player.sonos_bureau
name: Sonos Bureau
- entity_id: media_player.sonos_one_badkamer
name: Sonos Badkamer
- entity_id: media_player.master_slaap
name: Sonos Master slaapkamer
- entity_id: media_player.sonos_michael
name: Sonos Michael
- entity_id: media_player.woonkamer
name: Sonos Woonkamer
- entity_id: media_player.sonos_one_dressing
name: Sonos Dressing
platform: sonos
show_group_count: true
type: 'custom:mini-media-player'
deviceID:
- this
- dashboard
title: Sonos bureau
type: state-icon
This not, but I really donāt see whats wrong here 
- type: icon
icon: mdi:fullscreen
title: Living room Floor Plan
style:
left: 43%
top: 56%
tap_action:
action: call-service
service: browser_mod.popup
service_data:
cards:
type: picture-glance
entities:
entity: media_player.sonos_bureau
image: 'http://192.168.0.4:8082'
aspect_ratio: 0%
deviceID:
- this
- dashboard
Thanks!
cards:?
Is it possible to use this to detect a mobile device and navigate the user automatically to a dashboard that is mobile friendly?
Hi
I am trying use the browser_mod media_player.play_media to play an Icecast MP3 acting as an intercom. The file is http://localip/file.mp3. This works on non browser mod devices, but doesnāt work on browser mod devices.
I get sound on browser mod devices if I use /local/test.mp3 but not when using the Icecast URL.
Any ideas or is this a limitation?
The Icecast server is on the same IP as Hass.
I tried sym link of test.mp3 to Icecast file.mp3 but thatās not possible. I also tried a playlist with the Icecast URL as an item.
Welcome thoughts.
Hi, @thomasloven, this is my use case:
Use multiple addons in order to create a Tablet Dashboard.
Mix browser_mod.popup service for extra info and image card for floor plan.
Code:
ui-yaml file
a.
- type: icon
icon: mdi:information-outline
title: Information
style:
top: 87.41%
left: 10.7%
color: rgba(255, 255, 255, 0.10)
padding: 0.8vw
--iron-icon-height: 4vw
--iron-icon-width: 4vw
tap_action: !include popup/sidebar_information.yaml
b.
- entity: switch.kitchen_light
hold_action:
action: none
state_image:
'off': /local/floorplan/apartment/transparent_square.png
'on': /local/floorplan/apartment/kitchen_1.png
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
type: image
- entity: switch.kitchen_light
image: /local/floorplan/apartment/transparent_square.png
style:
left: 53.5%
top: 75%
tap_action:
action: toggle
type: image
sidebar_information.yaml
action: call-service
service: browser_mod.popup
service_data:
title: Close
deviceID: this
style:
background: none
box-shadow: none
width: calc(400px + 400px + 400px)
card:
type: custom:layout-card
column_num: 3
column_width: [400, 400, 400]
layout: vertical
cards:
- type: entities
title: Home Assistant
show_header_toggle: false
style: &entities-style |
ha-card {
box-shadow: none;
border-radius: 1em;
background: rgba(34, 38, 39, 0.9);
padding: 0.3em 1.25em 0.4em 0.5em;
}
.card-header {
margin-left: 0.4em;
margin-bottom: 0.1em;
font-family: sf text;
letter-spacing: 0.005em;
}
entities:
- entity: sensor.version_current
- entity: sensor.version_available
- entity: sensor.processor_use
icon: 'mdi:chip'
- entity: sensor.load_1m
icon: 'mdi:chip'
- entity: sensor.last_boot
icon: 'mdi:clock'
name: BigSister Uptime
- entities:
- entity: sensor.asuswrt_download_speed
name: Router Download Speed
icon: 'mdi:chip'
tap_action:
action: call-service
service: homeassistant.update_entity
service_data:
entity_id: sensor.asuswrt_download_speed
- entity: sensor.asuswrt_upload_speed
name: Router Upload Speed
icon: 'mdi:memory'
tap_action:
action: call-service
service: homeassistant.update_entity
service_data:
entity_id: sensor.asuswrt_upload_speed
positions: &bar_card_positions
icon: outside
indicator: 'off'
name: outside
severity: &bar_card_severity
- color: '#303435'
from: 0
to: 89
- color: '#6d2525'
from: 90
to: 100
decimal: 0
entity_row: true
style: &bar_card_style |
bar-card-iconbar {
padding-left: 0.23em;
}
bar-card-name {
padding-left: 0.25em;
}
bar-card-value {
margin-right: auto;
color: #e0e1e1;
text-shadow: none;
font-size: 1em;
font-weight: 400;
letter-spacing: 0.01em;
}
bar-card-background {
background: radial-gradient(circle, rgba(52, 57, 58, 0.1) 0%, rgba(17,18,18,0.2) 75%);
box-shadow: inset 0 0 25px #00000045;
border-radius: 0.3em;
}
bar-card-backgroundbar {
background: none;
}
unit_of_measurement: 'Mbps'
height: 2em
width: 55%
type: custom:bar-card
- type: custom:hui-horizontal-stack-card
style: &horizontal-style |
#root {
justify-content: space-evenly;
margin: 1.4em -0.7em 0.7em 0;
}
cards:
- type: custom:button-card
name: >
[[[ return
'<ha-icon icon="mdi:reload">
</ha-icon> Home Assistant'; ]]]
tap_action:
action: call-service
service: script.turn_on
service_data:
entity_id: script.homeassistant_restart
template: name_action
The info button is grayed out. If I remove this part - Info button is working as design.
- entity: switch.kitchen_light
hold_action:
action: none
state_image:
'off': /local/floorplan/apartment/transparent_square.png
'on': /local/floorplan/apartment/kitchen_1.png
style:
left: 50%
top: 50%
width: 100%
tap_action:
action: none
type: image
See attached image
[Here the button is grayed out]
This is a short video
Do you have any workaround ideas?
I really donāt know how to solve this issue.
Iād assume the kitchen light image somehow overlaps the button. width: 100% will likely make it very large, and clicks do not transfer through it even if itās transparent.
Actually, if transparent_square isā¦ squareā¦ it definitely overlaps the button in this case.
Iāve managed to get a symlink to follow through from homeassistant/www/file.mp3 but the browser_mod media player seems to be caching the file not playing the stream.
Any ideas?
@thomasloven, any plans to update this fantastic component to be .110 compliant. It still works for me but is generating a couple of errors in the logs (alongside quite a few other components that need updating).
Hi, What is wrong? Is it not possible to stack button cards in popup mode?
Thanks // Fredrik
type: 'custom:button-card'
color: 'rgb(44, 109, 214, 0.6)'
color_type: label-card
name: POPUP TEST
styles:
card:
- height: 30px
- width: 200px
- padding: 0px
- text-shadow: 0px 0px 5px black
tap_action:
action: call-service
service: browser_mod.popup
service_data:
title: Lamptest
type: horizontal-stack
cards:
- type: 'custom:button-card'
color_type: blank-card
- type: 'custom:button-card'
color_type: card
template: custom_button_light_active_glow
entity: switch.25803704d8f15b012287_2
name: Soffbord
icon: 'mdi:ceiling-light'
- type: 'custom:button-card'
color_type: blank-card
deviceID:
- this
The following works for me, I think youāre missing the first ācardā
tap_action:
#Pop-UP
action: call-service
service: browser_mod.popup
service_data:
card:
cards:
- type: custom:bar-card
entity: sensor.tempr_bedroom1
- type: 'vertical-stack'
cards:
- type: custom:mini-graph-card
entity: sensor.tempr_backyard
- type: custom:mini-graph-card
entity: sensor.tempbedroom1_humidity
type: 'horizontal-stack'
deviceID:
- this
large: true
style:
background: '#141414'
title: Temperatures
Done.
2 Likes
Thank you. Updated and all good. However HACS is showing it with title āhacsā as opposed to browser mod.
1 Like
Thank you sir
Whatās everyone doing to get around the constantly-changing iPhone deviceID? Iām planning on creating an appdaemon app to search for my phone. Before I do that, maybe someone has come up with another solution?
Total guess here because I donāt use IPhones.
I know that devices have started using randomized Mac addresses for wifi and BT. This has created a lot of issues for home automation that relies on Mac addresses. On my Samsung phone there is an option to disable the randomized Mac (per network). I disabled it on my home network so that my phone does not constantly pull a dhcp ip instead of my reserved one.
Again, not sure if this is even related to how browser mod assigns its device idās but thought Iād throw it out there anyway.