🔹 Browser_mod - turn your browser into a controllable device, and a media_player

Nick4 · September 1, 2023, 4:16pm

Yes, it worked before with standard buttons but for some reason, starting with certain update, using custom buttons was the solution.

That’s because your code for the browser_mod.pop is not correct

From one of my working examples:

show_name: false
show_icon: true
type: button
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    data:
      title: Switches
      content:
        type: vertical-stack
        cards:
          - show_name: true
            show_icon: true
            type: custom:button-card
            tap_action:
              action: toggle
            entity: input_boolean.kitchenlightstayon
            name: Kitchen ON
            color: auto
            state:
              - value: 'on'
                color: rgb(255,193,7)

ibcm123 · September 1, 2023, 6:00pm

I’ve adjusted my code following your example, and it works! Thank you very, very much for the help, and have a great weekend!

jouster · September 1, 2023, 9:46pm

managed to fix the issue with the header not being hidden on FKB on two tablets…clearing cash and restrting FKB fixed that so thank you for the mentions above.

NOw there is one thing I am missing quite a bit since I recently upgraded from 2023.1 to 2023.8.

The ability so slide the sidebar from the left of the browser window (this is on a Windows 10 browser)

It still works on my IOS companion app…and when I check a snapshot, it still works on 2023.3…in fact I remember when 2023.4 first came out, I updated and this breaking was enough for me to initially wind things back…

For info, I am running the latest browser mod integration, 2.30, and the latest HASS of 2023.8.4

ASNNetworks · September 2, 2023, 10:52am

That feature has been disabled through frontend by HA team since I believe 2023.4. The reason it works on your iOS app is because it’s still cached. When you clear the frontend cache, it will also stop working there.

I don’t miss it myself, since I have a dedicated settings button on my dashboard that goes to the settings page, and from there I can press the hamburger menu on the top left to bring the sidebar.

There does seem to be a community project that re-introduces the swipe feature for sidebar if you want to test it. I haven’t used it myself, so judge for yourself See link below

breakthestatic/hass-sidebar-swipe: Toggle Home Assistant sidebar via swipe gestures (github.com)

jouster · September 2, 2023, 8:19pm

thanks I had stumbled across this but couldnt get it to work so have reached out there too

dragos · September 3, 2023, 8:06pm

Hi everyone!

Since the last few updates I’m having some issues with the pop-ups on my iOS device. Before the update, a pop-up would appear that would only cover the part of the screen which it needs in order to show all the entities in the pop-up; the background was dimming and I had the option to tap outside of it in order to close it.

Since the latest update, whenever I open the pop-up on my iPhone it covers the entire screen and I have no way to close it, other than completely closing the app.

I also don’t have an close (X) button in the corner, if I recall correctly this was by choice in order to keep it cleaner; but it wasn’t an issue back then. I should also mention that it works ok on the desktop dashboard. Is there a way to fix this? I’ll add a code snippet below:

type: custom:mod-card
card:
  type: custom:mushroom-title-card
  subtitle: ' Scenes'
  alignment: start
  subtitle_tap_action:
    action: fire-dom-event
    browser_mod:
      command: call-service
      service: browser_mod.popup
      data:
        deviceID: this
        content:
          square: true
          columns: 3
          type: custom:stack-in-card
          mode: horizontal
          cards:
            - type: custom:mushroom-template-card
              primary: Movie
              secondary: ''
              icon: mdi:movie-open
              fill_container: true
              entity: script.lights
              layout: vertical
              tap_action:
                action: toggle

Nick4 · September 3, 2023, 9:19pm

Hi, try by adding a title to your browser_mod.popup card:

show_name: false
show_icon: true
type: button
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    data:
      title: Switches
      content:
        type: vertical-stack
        cards:

DJI · September 4, 2023, 11:09am

Thanks for a great integration - I think its going to solve 2 big challenges I have, but I can’t work out how:

I want to share just one of my dashboards with friends via Home Assitant Cloud. I think I just need to disable the sidebar & header for all users other than me?
The dashboard in question uses a canvas-gauge within a picture-elements card but the size of the gauge needs to be determined by the size of the browser. I can see entities for browser height & width but not one that tells you which size is for the browser that is viewing the card. I can use card-templater to change the size of the canvas-gauge, but only if I know which browser size to use. How do I do this?

Rudd-O · September 5, 2023, 8:15am

It’s not possible to safely share just one dashboard with someone who controls the browser it’s displayed on.

DJI · September 5, 2023, 8:23am

Thanks, but I accept the risk as I trust the individuals. Plus I can’t see any other way of sharing the dashboard which will be really useful to this small group.

dragos · September 5, 2023, 7:43pm

Hi!

Thabks fir the reply. Seems that I’m able to close the pop-up this way, however I am not getting the functionality that I used to

Nick4 · September 5, 2023, 8:54pm

Have you seen that you can control the size of the popup, have a look at the GH repo and the documentation there.

kisel · September 6, 2023, 8:52pm

For anyone just starting with Browser Mod, here’s a collection of examples for creating custom popups and replacing the default more-info dialog window.

With yaml for each to copy-paste and adapt to your instance

cloudbr34k · September 7, 2023, 10:18am

Im going to post anyway as im not sure if the solution to my problem

On the Android, the popup does fit on the screen, can someone help point me in the right direction to get this sorted pls??

Nick4 · September 7, 2023, 11:10am

Have you seen that you can control the size of the popup, have a look at the GH repo and the documentation there.

cloudbr34k · September 7, 2023, 2:40pm

tried that, see code below

tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    style: |
      --popup-min-width: 480px;
      --popup-border-radius: 20px;
    target:
      device_id:
        - xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
        - xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    data:
      dismissable: true
      autoclose: false
      size: normal
      content:
        type: vertical-stack

Nick4 · September 7, 2023, 5:41pm

From https://github.com/thomasloven/hass-browser_mod/blob/89bec37383bc307bec4b302af19d32120e684641/documentation/services.md#browser_modpopup

  [size: <NORMAL/wide/fullscreen>]

cloudbr34k · September 8, 2023, 6:39am

ok so i updated it and still no change…

  tap_action:
    action: fire-dom-event
    browser_mod:
      service: browser_mod.popup
      target:
        device_id:
          - 4064f034b49bd0d728645f51df0ec321
          - 2615813c7af26d27771116d33cd7399a
      data:
        dismissable: true
        autoclose: false
        size: NORMAL
        content:

thorshammer · September 10, 2023, 10:44am

Unfortunately not.

saadbashir · September 14, 2023, 2:12pm

I am trying to use browser_mod to popup camera feed when bell is pressed on entrance door. My configuration is as follows:

dismissable: true
autoclose: false
title: Front Door Camera
size: fullscreen
timeout: 120000
deviceId:
  - home-desktop
content:
  camera_view: live
  type: picture-glance
  entities: []
  camera_image: camera.entrance_camera_onvif_profile000
  aspect_ratio: "4:3"

The issue occurs when I have RTSP camera feed running in full screen mode, then the popup remains hidden underneath that full screen instead of showing on top of it. Any idea on how I can show this popup on top of that feed? Or that feed gets closed for a few minutes and the feed on the popup is showed and when it times out the earlier feed gets maximized again.