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

Hey there.
Another great app Thomas, much appreciated.

Iā€™ve added the camera option and got it working on the IOS app, however on chrome on a windows tablet iā€™m not getting the request if i allow home assistant to use the camera. Can someone advise how this request pops up please? Iā€™ve F12ā€™d to clear cache and restarted multiple times but still not seeing anything.

Thanks

Iā€™m having the same issue with my alarm panel card no longer displaying in a popup. Iā€™m using browser mod called from Node-RED and I just get the red ā€œCustom element doesnā€™t existā€¦ā€ error. Everything has been updated to the latest (Home Assistant, Browser Mod, etcā€¦) but I canā€™t figure anything out to get it to work. Did you literally do nothing and it just started working for you?

The issue popped up for me again and I fixed it by clearing the cache on my browser and in the HA App. In the HA App I had to clear the frontend cache in the settings section. Give that a shot and see if it works.

Look at the documentation: https://github.com/thomasloven/hass-browser_mod#how-do-i-run-commands-from-a-scriptautomation
You are using the syntax for the lovelace part and not the script/automation part.

GV

Thanks for the response. I tried this and it didnā€™t seem to do anything (at least at first). I canā€™t pinpoint what the issue is as trying the browser_mod.popup service from Developer Tools works for some types of cards but not others. I was able to get my alarm-panel card to work on my PC (in Chrome), but itā€™s not working on my tablet in Fully Kiosk (even after clearing cache). I did notice that the deviceID seems to be at least part of the issue. When I removed that from my config it started working in Chrome.

I assumed it was clearing the cacheā€¦ the other thing I did right around the same time was deleting all the tokens associated with my user accounts. Maybe that was itā€¦ Iā€™m no expert on the tokens, so not sure if that could even be a possible solution.

Iā€™m having a real hard time figuring out the CSS injection to manipulate the more-info-dialog. Iā€™m trying to force a set height and width when @media (max-width) is a certain value.

What am I doing wrong?

.: |
"ha-more-info-dialog":
  $: |
    @media (max-width: 450px), (max-height: 500px)
    :host {
      width: 100px !important;
      border-radius: 10px;
      position: fixed !important;
      margin-left: 100px;
      }

Original CSS Iā€™m trying to overwrite:

@media (max-width: 450px), (max-height: 500px)
<style>
:host {
    width: 100% !important;
    border-radius: 0px;
    position: fixed !important;
    margin: 0;
}

Recently Iā€™ve started having an issue with a more-info popup using browser_mod, I have a button that toggles an input_boolean which turns my alarm clock automations on/off, with the hold_action being more-info.

There are 4 entities listed in the popup, now the first time I hold the button the popup opens with only the top 2 entities shown, if I close the popup and hold the button again it opens with all 4 entities listed.

Iā€™m not exactly sure when this started to occur as I donā€™t adjust the alarm clock very often but would appreciate any assistance.

path: bedroom
icon: mdi:hotel
popup_cards:
  input_boolean.alarm_clock:
    title: Alarm Clock
    card:
      type: entities
      style: |
        ha-card {
            background: rgba(0,0,0,0);
            box-shadow: none;
            font-family: var(--font-family);
            font-size: 14px;
            font-weight: bold;
        }
      entities:
        - entity: sensor.time
          name: Current Time
          icon: mdi:clock-outline
        - entity: sensor.alarm_clock_time
          name: Alarm Time
          icon: mdi:alarm
        - entity: input_number.alarm_clock_hour
          name: Hour
          icon: mdi:alarm
        - entity: input_number.alarm_clock_minute
          name: Minute
          icon: mdi:alarm

Those of you who have had problems with red cards or pieces of popups, please try release 25.

Better but not quite yetā€¦ I am having problems with markdown card.
Here is to repeat the issue at least in my situation:

  • install 25, clear cache, reload lovelace and refresh page: markdown displayed ok

  • reload lovelace and refresh page: popup KO with the red card

  • clear cache, reload lovelace and refresh page: popup OK

Using chrome 80.0.3987.149 on macos.

HTHā€¦

GV

Hi,

I test it. in my case it didnā€™t solve the problem.

  • install 25, clear cache, close chrome, reload lovelace and refresh page: popup with swipe card displayed ok
  • The following attempt no longer works.

I made a video:

Did u get this running with picture-glance card? Having same issue wanna show pop-up with camera live stream and buttons to open or close the door

Hi @thomasloven

will browser_mod support the new service reload_resources too? Use case: I have several buttons that execute these services directly, and that way dont face me to go to the menu triple dots. Would be really useful to add that service to browser_mod.
thanks for considering
nevermindā€¦ what was I thinking. Can simply use the core service for that. really sorry

Thank you for this excellent integration !!! Working perfectly with TV-card calling!!

Hi,

Is that possible, to set the popup windows to always open from above? (So, no size calculation, just open from above, not from the middle)

Iā€™m not sure if this is expected behaviour and I have to use the custom lovelace-card-preloader but I am getting an error using browser_mod.popup in an automation.

      - service: browser_mod.popup
        data:
          title: Guest Mode Schedule 1 has started
          card:
            type: entity-filter
            show_header_toggle: false
            entities:
              - timer.guest_mode_once_duration
              - timer.guest_mode_schedule_1_duration
              - timer.guest_mode_schedule_2_duration
            state_filter:
              - "active"

image

Hello everybody!
I was looking for a service that did exactly what the ā€˜refreshā€™ button did. However I am having difficulty making it work. I followed all the steps and simply displays the following message in the H.Aā€™s ā€œLogā€:

Component error: browser_mod - Integration ā€˜browser_modā€™ not found

Using Hassio HA 0.107.7 / SU 216 / HassOS 3.12.

Considerations:

  • The ā€œbrowser_mod.jsā€ is not included in resource.yaml, as I will not use it with Home Assistant Cast.

  • The ā€œbrowser_mod.jsā€ file is at: ā€œ/config/custom_components/browser_mod/ā€

  • I consulted in ā€œgitā€ all the ā€œissuesā€ and no react of this problem.

Configuration.yaml (relevant configurations)

# for hass-browser_mod settings
browser_mod:

# for hass-lovelace_gen settings
lovelace_gen:

lovelace:
mode: yaml
resources: !include lovelace/resources/resources.yaml

Tks!

looks like you donā€™t have the whole component there - preform step 1 properly and restart HA

Thankful!

I redid the process since downloading all the files and reinstalling them. However, just restarting the H.A. was unsuccessful. It worked perfectly after ā€œhassio.host_rebootā€.

maybe it could work if you cleared your browserā€™s cache.
anyway, glad it works for you.