šŸ”¹ Browser_mod - turn your browser into a controllable device, and a media_player

nothing wrong with code seems to work ok
did you register browsers

Thanks for the suggestion, when I went to check the integration page, it showed Browser_Mod failed to loadā€¦A reboot cured it.

ā€“dialog-backdrop-filter: blur(2em) brightness(0.75);
you can start from this ā€¦

1 Like

Iā€™m having trouble specifying an action from the additional right and left buttons. I canā€™t call the navigate service.
right_button_action:
action: navigate
navigation_path: /lovelace-tablet/server_ha

      right_button_action:
        service: browser_mod.navigate
        data:
          path: /lovelace-tablet/server_ha

Resolved!

with version 2.1.1 its working the blur

        data:
          card_mod:
            style:
              ha-dialog$: |
                div {
                  backdrop-filter: blur(3px) !important;
                  background-color: transparent !important
                }
                .mdc-dialog .mdc-dialog__surface {
                  box-shadow: none;
                }
3 Likes

Having trouble porting over from 1.x. Iā€™m calling browser_mod from my frontend like this:

tap_action:
  action: fire-dom-event
  browser_mod:
    service: script.mudroom_lights_menu_test
    data:
      browser_id: THIS
      groupID: group.mudroom_lights

And invoking the pop-up from a script like this:

mudroom_lights_menu_test:
  sequence:
    - service: browser_mod.popup
      data:
        title: TITLE
        content:
          type: entities
          entities:
            - entity: sensor.motion_count
            - entity: sensor.door_count
    - service: system_log.write
      data:
        message: "Popup was clicked in {{browser_id}}"

Nothing ever pops up, however the log entry is written correctly, so I know the script is getting called.

If I embed the pop content directly on the client, the popup works just fine. What am I doing wrong? This is the same pattern I used in 1.x. Iā€™ve tried various of combinations, but havenā€™t been able to figure this one out.

Thank you!

@kbed what is your expected outcome? Is it something like this?

Lights button to control multiple lights -
image

when pressed it calls more info and a pop up appears

clicking one light turns on All Lights
image
image

Hi,
Since last update things are working great. Thanks!
One small issue I am still having.
I am using the below card mod configuration in theme to remove the top padding inside popup.
It works fine on all the browsers, PC and Android tablets, however on iOS an iPadOS it behaves strange, it works the first time I open the popup, but next time the padding is back. If I just refresh the page it work again, and then next time padding is back again. As if I did not clean the cache, but I did of course.

    ha-dialog$: |
      .mdc-dialog .mdc-dialog__content {
          padding-top: 0px !important;
          -webkit-padding-before: 0px !important;
      }

I think there is some inconsistency here only on iOS/iPadOS.

Yes. I have a button that represents every room in the house, when clicked it brings up the popup similar to your second screenshot where I can control on/off the individual light in the room. Works perfectly with the old browser_mod.

Have you tried a pop-up card?

type: custom:popup-card
entity: light.all_lights
title: All Lights
dismissable: true
card:
  type: entities
  entities:
    - light.all_lights
    - light.adelynns_closet_light
    - light.adelynns_room_light
    - light.backyard_security_light
    - light.basement_light
    - light.cafe_lights
    - light.chandelier_light

So I use 2 cards

type: custom:mushroom-template-card
icon: mdi:lightbulb-group
primary: Lights
icon_color: |-
  {% if is_state('light.all_lights', 'on') %}
    orange
  {% endif %}
layout: vertical
multiline_secondary: false
tap_action:
  action: more-info
double_tap_action:
  action: more-info
entity: light.all_lights
secondary: ''

and

type: custom:popup-card
entity: light.all_lights
title: All Lights
dismissable: true
card:
  type: entities
  entities:
    - light.all_lights
    - light.adelynns_closet_light
    - light.adelynns_room_light
    - light.backyard_security_light
    - light.basement_light
    - light.cafe_lights
    - light.chandelier_light
    - light.dinning_room_light
    - light.entryway_light
    - light.family_room_light
    - light.front_yard_lights
    - light.garage_light
    - light.guest_bathroom_light
    - light.guest_bedroom_closet_light
    - light.guest_bedroom_light
    - light.kids_bathroom_light
    - light.kitchen_island_light
    - light.kitchen_main_light
    - light.kitchen_sink_light
    - light.laundry_room_light
    - light.living_room_light
    - light.master_bathroom_main_light
    - light.master_bathroom_shower_light
    - light.master_bathroom_water_closet_light
    - light.master_bedroom_light
    - light.mudroom_light
    - light.office_of_mike_light
    - light.pantry_light
    - light.stairs_to_upper_level_light
    - light.upstairs_hallway_light

This makes it fire the popup

The second way is as a browser call. This is when the service is called from a dashboard fire-dom-event action, as a part of a browser_mod.sequence call or as a browser_mod.popup _action

Whats nice is 90% is through the gui now

Thanks. I was hoping I could use my existing setup with minimal tweaks. I make use of scripts and anchors and call the scripts with a parameter so to generalize the code. Would love to keep it this way as it is super clean, and would be a couple of hours of work to try and change it, to something like you mention above.

If Iā€™m reading the documentation correct, it should be possible to call from server side and automations. If for some reasons I canā€™t do that in 2.x, I might just revert back until this can be done.

After updating to the newest browser mod the other day my popup is no longer workingā€¦ anyone run into this?

           tap_action:
              action: fire-dom-event
              browser_mod:
                service: browser_mod.popup
                title: John's Location
                icon: mdi:car
                card:
                  type: map
                  default_zoom: 15
                  entities:
                    - device_tracker.sm_f926u1
                    #- device_tracker.john_wade
                  aspect_ratio: 16:9
                  hours_to_show: 4
                  deviceID:
                    - this
                    - dashboard

Hi,

Iā€™m stuck, please help. Want to insert a background imge in this popup card:

tap_action:
  action: fire-dom-event
  browser_mod:
    command: call-service
    service: browser_mod.popup
    data:
      title: DOOR
      dismissable: false
      timeout: 3000
      style: |-
        --popup-min-width: 500px; --popup-max-width: 670px;
        --popup-border-radius: 10px;

        --popup-background: url("/local/door.jpg");
        --popup-border-width: var(--ha-card-border-width, 10px);
      right_button: NO
      right_button_action:
        service: browser_mod.close_popup
        data:
          browser_id: tablet_nappali
      left_button: Door Open/Close!
      left_button_action:
        service: switch.toggle
        service_data:
          entity_id: switch.electrodragon_rele1

This one is not working: --popup-background: url("/local/door.jpg");
So how to do that?

Thank You.

1 Like

Since the upgrade I am geeting this in the log

Logger: homeassistant.config_entries
Source: config_entries.py:349
First occurred: 09:47:51 (1 occurrences)
Last logged: 09:47:51

Migration handler not found for entry Browser Mod for browser_mod

Any ideas

Hi some yaml items are renamed. You should change this:

to

                content:
                  type: map
1 Like

This is the complete setupā€¦so still confused why itā€™s not workingā€¦

           tap_action:
              action: fire-dom-event
              browser_mod:
                service: browser_mod.popup
                title: John's Location
                icon: mdi:car
                content:
                  type: map
                  default_zoom: 15
                  entities:
                    - device_tracker.sm_f926u1
                    #- device_tracker.john_wade
                  aspect_ratio: 16:9
                  hours_to_show: 4
                  deviceID:
                    - this
                    - dashboard
            multiline_secondary: true

missing data?

  service: browser_mod.popup
  data:
    content:
1 Like

Second line in ā€œInstallation instructionsā€ in the readme.

1 Like