Browser mod close pop-up after pressing button

[Lode1 (Lode Bongaerts)]

Hi,

I have an automation that uses browser mod to show a camera image when somebody presses my doorbell.
This all works fine.
I have a button on the pop-up that, when pressed, opens my gate.
After i press that button the pop-up disappaers and that’s not what i want.
I want to see the gate opening and visitors coming in.

I’ve been reading the documentation from browser mod but i can’t find anything how to do that (if it’s even possible)

dismissable: false
autoclose: false
title: Deurbel
size: fullscreen
timeout: 120000
deviceID:
  - Lenovo
content:
  camera_view: live
  type: picture-glance
  entities: []
  camera_image: camera.reolink_deurbel_fluent
right_button: Open gate
right_button_action:
  service: switch_turn_on
  data:
    entity_id: switch.open_gate

[Protoncek (Pavel)]

Did you try with “autoclose: false” ?
Edit: sorry, i missed that you have it already… but autoclose should work. Do you have it in correct position?
However, i’m not sure that you’ll be able to see anything… i didn’t try with image/camera, but these popups are not “live”, they don’t refresh when opened…

[Lode1 (Lode Bongaerts)]

Thx for your reply.
What do you mean by having it in correct position ?

[Protoncek (Pavel)]

Well, it’s just a long shot… so, i thought that you double-check if this command is where it needs to be (according to github page). You know… one indent too much left or too much right and it’s enough not to work…

i just tested it and it works here with latest browser mod… i have it like this:

tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    data:
      style: |
        --popup-border-color: lime;
        --popup-border-width: 40px;
        --popup-background-color: blue;
        --popup-max-width: 900px;
      autoclose: false
      timeout: 5000
      content:
        ....

[Lode1 (Lode Bongaerts)]

Thanks for your effort

@Protoncek

Well, it’s just a long shot… so, i thought that you double-check if this command is where it needs to be (according to github page). You know… one indent too much left or too much right and it’s enough not to work…

I see, i double checked that and that seemed to be ok.

I don’t understand how to implement your code since it is triggered when somebody presses the doorbell and not a tap_action or am i missing something here ?

I’ve been reading the documentation again and found this but it isn’t clear to me:

Look for browser_mod.sequence and browser_mod.delay

https://github.com/thomasloven/hass-browser_mod/blob/91741384df2dd2271c459e3c992bc04c814cee52/documentation/services.md

[Protoncek (Pavel)]

I just remembered…i did tinker with doorbell a while ago and i remember that i’ve had somewhat similar problems… however, my problem was that i used “doorbell pressed” as trigger and when i opened the door this sensor went from “pressed” to “released” (or similar), and that was the cause for popup to turn off. Sadly i don’t recall details anymore… i will need to do similar as you for my new (to be) doorbell, but only when spring comes…

but, i guess i’d go in a way that i would create a helper. “Doorbell pressed” would then set this new helper, and this helper would trigger popup. Then, this helper would be reset only when i press something (like close popup….)

Broser mod delay isn’t clear to me, too… i didn’t use it yet, to be honest i even didn’t see that it’s there…

[Lode1 (Lode Bongaerts)]

I took a different approach.
At the gate there is another camera.

Recap:
Pressing Reolink doorbell shows a pop-up with a button to open my sliding gate.
After i press that button the gate opens and the pop-up disappears.

Second step in the automation is to open another pop-up that shows the other camera that is pointed to the gate.

Problem : only the second pop-up shows up.

[cedricdelecole]

Were you able to find the solution ?
I also have the same problem … i want the button to execute a service, but not to close the popup … but it does …

[Lode1 (Lode Bongaerts)]

No not yet.
I’m going to try something with the bubble-card popup.
Did you make any progress ?
I’ll keep you informed when i figured something out.

[cedricdelecole]

The workaround I have found is that as clicking the right action or left action button, the initial popup closes, I am executing acgain, in the action button, a the same browser_mod.popup so that it re-opens, like this

 left_button_action:
                service: browser_mod.sequence
                data:
                  sequence:
                    - service: browser_mod.popup
                      data:
                        title: Caméra Extérieure
                        dismissable: true
                        content:
                          camera_view: live
                          type: picture-glance
                          entities: []
                          camera_image: camera.192_168_1_110
                        timeout: 60000
                        size: fullscreen
                        browser_id:
                          - Lenovo-tablette
                    - service: media_player.media_stop
                      data:
                        entity_id: media_player.lenovo_tab_m10_plus_3rd_gen

[Simsala91]

I think an easier solution would be to add a button to the content of the popup that executes the service you want.

[Lode1 (Lode Bongaerts)]

How can you add an extra button to a browser-mod pop-up ?

[Lode1 (Lode Bongaerts)]

I tried this but it doesn’t work for me ?
However the second service call at the bottom is executed but the popup doesn’t show up.
What am i doing wrong ?

right_button_action:
  service: browser_mod.sequence
  data:
    sequence:
      - service: browser_mod.popup
        data:
          dismissable: true
          autoclose: false
          title: Poort
          size: fullscreen
          browser_id:
            - Lenovo
          content:
            camera_view: live
            type: picture-glance
            entities: []
            camera_image: camera.camera_poort_vloeiend
          right_button: Sluit poort
          right_button_action:
            service: switch.turn_on
            data:
              entity_id: switch.poort_half_open
          left_button: Sluiten
          left_button_action:
            service: browser_mod.close_popup
            data:
              browser_id:
                - Lenovo
      - service: switch.turn_on
        data:
          entity_id: switch.poort_half_open

[Lode1 (Lode Bongaerts)]

It’s all about indentation
Two browser_mod.sequence instances nested.
Thanks @cedricdelecole

dismissable: true
autoclose: false
title: Deurbel
size: fullscreen
deviceID:
  - Lenovo
content:
  camera_view: live
  type: picture-glance
  entities: []
  camera_image: camera.reolink_deurbel_vloeiend
left_button: Sluiten
left_button_action:
  service: browser_mod.close_popup
  data:
    deviceID:
      - Lenovo
right_button: Open poort
right_button_action:
  service: browser_mod.sequence
  data:
    sequence:
      - service: browser_mod.popup
        data:
          dismissable: true
          content:
            camera_view: live
            type: picture-glance
            entities: []
            camera_image: camera.camera_poort_vloeiend
          size: fullscreen
          deviceID:
            - Lenovo
          left_button: Sluit scherm
          left_button_action:
            service: browser_mod.close_popup
            data:
              deviceID:
                - Lenovo
          right_button: Sluit poort
          right_button_action:
            service: browser_mod.sequence
            data:
              sequence:
                - service: browser_mod.popup
                  data:
                    dismissable: true
                    content:
                      camera_view: live
                      type: picture-glance
                      entities: []
                      camera_image: camera.camera_poort_vloeiend
                    size: fullscreen
                    deviceID:
                      - Lenovo
                    right_button: Sluit scherm
                    right_button_action:
                      service: browser_mod.close_popup
                      data:
                        deviceID:
                          - Lenovo
                - service: switch.turn_on
                  data:
                    entity_id: switch.poort_half_open
      - service: switch.turn_on
        data:
          entity_id: switch.poort_half_open

[cedricdelecole]

I a very glad I could help … I am posting A LOT of questions, sometimes because it is easier than looking on the internet, I admit.
But at the end the community is very helpful, so glad my code could help in here !!

[Lode1 (Lode Bongaerts)]

@cedricdelecole
Hi,
I found an even better, less complicated solution.
It’s just so simple.
Why didn’t i think about that before ?

Just add a view to your dashboard with your camera entity.
Then just place as many button-cards on that page as you wish
My setup:

Automation → If the doorbell is pressed goto view with camera.
On that view you can choose other camera’s or open/close the gate by adding button-cards.
That’s it !! No need for complicated nested browser-mod.

[cedricdelecole]

But still if someone rings the door, browser_mod need to be used to popup the page you want, right ?
I continue to use my automation and it is working perfectly … when someone rings the bell, a browser_mod pops up with the camera stream with 2 buttons … the one on the right closes everything … the one on the left stops the ring but let the camera view opened for a few minutes

[Protoncek (Pavel)]

No, you just use “browser_mod navigate” service and go to desired page.

[Lode1 (Lode Bongaerts)]

No, @Protoncek is right.
Just use browser_mod navigate to go to the desired view

Here is my code, supereasy…

alias: Deurbelknop ingedrukt test
description: ""
trigger:
  - type: turned_on
    platform: device
    device_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    entity_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    domain: binary_sensor
condition: []
action:
  - device_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    domain: button
    entity_id: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    type: press
  - service: browser_mod.navigate
    metadata: {}
    data:
      path: /dashboard-thuis/camera-deurbel
    target:
      entity_id: media_player.xxxxxxxxxxxxx
mode: single

What it does:
When someone presses the doorbell, the automation wakes up the tablet (if sleeping) (using fully kiosk).
Then it just navigates to the view…that’s it !!

And using this view:

Here you can add just as many buttons as you want.
In my case:
Go back to the “Homeview”
Go to camera “Doorbell”
Go to camera “Gate”
Open the gate.
You can keep on navigating between those views where browsermod closes the view and you can’t place the butons where you want ( as far as i know)
But if you’re happy with your setup, that works perfect as well.
It’s just that this setup gives you much more flexibility.