Update readme
This commit is contained in:
parent
fffb017287
commit
79cb58175b
15
README.md
15
README.md
@ -30,7 +30,7 @@ Browser Mod has a number of services you can call to cause things to happen in t
|
||||
### Calling services
|
||||
|
||||
Services can be called from the backend using the normal service call procedures. Registered Browsers can be selected as targets through their device:
|
||||
|
||||
|
||||
|
||||
In yaml, the BrowserID can be used for targeting a specific browser:
|
||||
|
||||
@ -78,6 +78,7 @@ card:
|
||||
[any parameter from the browser_mod.popup service call except "content"]
|
||||
```
|
||||
|
||||
> *Note:* It's advisable to use a `fire-dom-event` tap action instead as far as possible. Popup card is for the few cases where that's not possible. See [`services`](documentation/services.md) for more info.
|
||||
|
||||
# Browser Player
|
||||
|
||||
@ -89,6 +90,18 @@ Add it to a dashboard via the GUI or through yaml:
|
||||
type: custom:browser-player
|
||||
```
|
||||
|
||||
|
||||
# FAQ
|
||||
|
||||
### **Why doesn't ANYTHING that used to work with Browser Mod 1.0 work with Browser Mod 2.0?**
|
||||
|
||||
Browser Mod 2.0 has been rewritten ENTIRELY from the ground up. This allows it to be more stable and less resource intensive. At the same time I took the opportunity to rename a lot of things in ways that are more consistent with Home Assistant nomenclature.
|
||||
|
||||
In short, things are hopefully much easier now for new users of Browser Mod at the unfortunate cost of a one-time inconvenience for veteran expert users such as yourself.
|
||||
|
||||
### **Why does my Browser ID keep changing?**
|
||||
There's just no way around this. I've used every trick in the book and invented a handful of new ones in order to save the Browser ID as far as possible. It should be much better in Browser Mod 2.0 than earlier, but it's still not perfect. At least it's easy to change it back now...
|
||||
|
||||
---
|
||||
|
||||
<a href="https://www.buymeacoffee.com/uqD6KHCdJ" target="_blank"><img src="https://www.buymeacoffee.com/assets/img/custom_images/white_img.png" alt="Buy Me A Coffee" style="height: auto !important;width: auto !important;" ></a>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -43,15 +43,20 @@ If you are using [Home Assistant Cast](https://www.home-assistant.io/integration
|
||||
|
||||
This section is for settings that change the default behavior of the Home Assistant frontend.
|
||||
|
||||
Each setting has three levels, _Global_, _Browser_ and _User_.
|
||||
For each option the first applicable value will be applied.
|
||||
|
||||
- Changes made on the _Global_ tab will be applied for everyone on every browser.
|
||||
- Changes made on the _Browser_ tab will be applied for this _Browser_. The settings here override any _Global_ settings.
|
||||
- Changes made on the _User_ tab will be applied for the user you're currently logged in as - on any device. The settings here override any _Global_ or _Browser_ settings.
|
||||
In the screenshot below, for example, the sidebar title would be set to "My home" - the GLOBAL setting - for any user on any browser (even unregistered). For any user logged in on the "kitchen-dashboard" browser, the sidebar title would instead be set to "FOOD", except for the user "dev" for whom the sidebar title would always be "DEV MODE".
|
||||
|
||||
|
||||
Note that if a setting is set at a lower level but _cleared_ on a higher, it is not _undone_. It's just not overridden.
|
||||
### Title template
|
||||
|
||||
Also note that _User_ level settings can only be made when logged in as the user in question, and that the Browser Mod configuration panel is only available to administrators. If you need to change a setting for a non-admin user, you will need to temporarily make them admin for the setup, and then un-admin them.
|
||||
This allows you to set and dynamically update the title text of the browser tab/window by means on a Jinja [template](https://www.home-assistant.io/docs/configuration/templating/).
|
||||
|
||||
> Ex:
|
||||
>
|
||||
> ```jinja
|
||||
> {{ states.persistent_notification | list | count}} - Home Assistant
|
||||
> ```
|
||||
|
||||
### Favicon template
|
||||
|
||||
@ -67,17 +72,8 @@ This allows you to set and dynamically update the favicon of the browser tab/win
|
||||
> {% endif %}
|
||||
> ```
|
||||
|
||||
Note that this _only_ applies to the current favicon of the page, not any manifest icons such as the loading icon or the icon you get if you save the page to your smartphones homescreen. For those, please see the [hass-favicon](https://github.com/thomasloven/hass-favicon) integration.
|
||||
Note that this _only_ applies to the current favicon of the page, not any manifest icons such as the loading icon or the icon you get if you save the page to your smartphones homescreen. For those, please see the [hass-favicon](https://github.com/thomasloven/hass-favicon) custom integration.
|
||||
|
||||
### Title template
|
||||
|
||||
This allows you to set and dynamically update the title text of the browser tab/window by means on a Jinja [template](https://www.home-assistant.io/docs/configuration/templating/).
|
||||
|
||||
> Ex:
|
||||
>
|
||||
> ```jinja
|
||||
> {{ states.persistent_notification | list | count}} - Home Assistant
|
||||
> ```
|
||||
|
||||
### Hide Sidebar
|
||||
|
||||
@ -91,12 +87,23 @@ This will hide the header bar. Completely. It does not care if there are useful
|
||||
|
||||
> Tip: See the big yellow warning box at the top of this card? For some reason, it seems to be really easy to forget you turned this on. Please do not bother the Home Assistant team about the header bar missing if you have hidden it yourself. Really, I've forgotten multiple times myself.
|
||||
|
||||
### Sidebar order
|
||||
|
||||
Did you know that you can change the order and hide items from the sidebar? To do so, either go into your profile settings at the bottom left and click "Change the order and hide items from the sidebar", or click and hold on the "Home Assistant" text at the top of the sidebar.
|
||||
|
||||
Normally, the order and hidden items only applies to the current device, but this will make it persistent according to the levels described above.
|
||||
|
||||
### Default dashboard
|
||||
|
||||
Like the Sidebar order, the default dashboard (the page shown when you simply access `https://<your home assistant url>/` with nothing after the `/`) can be set in your profile settings but only applies to the current device. This fixes that.
|
||||
Set the default dashboard that is shown when you access `https://<your home assistant url>/` with nothing after the `/`.
|
||||
|
||||
> *Note:* This sort of works with other pages than lovelace dashboards, like e.g. `logbook` BUT there's currently a bug in Home Assistant which causes extra js modules (like browser_mod) to not load if you navigate to `https://<your home assistant url>/` and it does NOT redirect to a lovelace dashboard... Perhaps that will be fixed at some point. Perhaps you could live with it...
|
||||
|
||||
### Sidebar order
|
||||
|
||||
Set the order and hidden items of the sidebar. To change this setting:
|
||||
|
||||
- Click the "EDIT" button
|
||||
- Change the sidebar to how you want it
|
||||
- DO NOT click "DONE"
|
||||
- Either add a new User or Browser setting or click one of the pencil icons to overwrite an old layout
|
||||
- Click the "RESTORE" button
|
||||
|
||||
### Sidebar title
|
||||
|
||||
This changes the "Home Assistant" text that is displayed at the top of the sidebar.
|
||||
Accepts Jinja [templates](https://www.home-assistant.io/docs/configuration/templating/).
|
||||
@ -10,17 +10,17 @@ data:
|
||||
left_button: Left button
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
## Size
|
||||
|
||||
The `size` parameter can be set to `normal`, `wide` and `fullscreen` with results as below (background blur has been exagerated for clarity):
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## HTML content
|
||||
@ -34,7 +34,7 @@ data:
|
||||
<p> Pretty much any HTML works: <ha-icon icon="mdi:lamp" style="color: red;"></ha-icon>
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
## Dashboard card content
|
||||
|
||||
@ -50,7 +50,7 @@ data:
|
||||
- light.kitchen_lights
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
## Form content
|
||||
`content` can be a list of ha-form schemas and the popup will then contain a form for user input:
|
||||
@ -91,7 +91,7 @@ data:
|
||||
slider: true
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
## Actionable popups
|
||||
|
||||
@ -127,7 +127,7 @@ data:
|
||||
entity_id: light.bed_light
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
## Forward form data
|
||||
|
||||
@ -158,4 +158,4 @@ data:
|
||||
value: 12
|
||||
```
|
||||
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ export const AutoSettingsMixin = (SuperClass) => {
|
||||
class AutoSettingsMixinClass extends SuperClass {
|
||||
_faviconTemplateSubscription;
|
||||
_titleTemplateSubscription;
|
||||
_sidebarTitleSubscription;
|
||||
__currentTitle = undefined;
|
||||
|
||||
@runOnce()
|
||||
@ -69,12 +70,18 @@ export const AutoSettingsMixin = (SuperClass) => {
|
||||
|
||||
// Sidebar title
|
||||
if (settings.sidebarTitle) {
|
||||
selectTree(
|
||||
document,
|
||||
"home-assistant $ home-assistant-main $ app-drawer-layout app-drawer ha-sidebar $ .title"
|
||||
).then((el) => {
|
||||
if (el) (el as HTMLElement).innerHTML = settings.sidebarTitle;
|
||||
(async () => {
|
||||
if (this._sidebarTitleSubscription) {
|
||||
this._sidebarTitleSubscription();
|
||||
}
|
||||
this._sidebarTitleSubscription = undefined;
|
||||
this._sidebarTitleSubscription =
|
||||
await this.connection.subscribeMessage(this._updateSidebarTitle, {
|
||||
type: "render_template",
|
||||
template: settings.sidebarTitle,
|
||||
variables: {},
|
||||
});
|
||||
})();
|
||||
}
|
||||
|
||||
// Hide header
|
||||
@ -115,6 +122,15 @@ export const AutoSettingsMixin = (SuperClass) => {
|
||||
}
|
||||
}
|
||||
|
||||
_updateSidebarTitle({ result }) {
|
||||
selectTree(
|
||||
document,
|
||||
"home-assistant $ home-assistant-main $ app-drawer-layout app-drawer ha-sidebar $ .title"
|
||||
).then((el) => {
|
||||
if (el) (el as HTMLElement).innerHTML = result;
|
||||
});
|
||||
}
|
||||
|
||||
get _currentFavicon() {
|
||||
const link: any = document.head.querySelector("link[rel~='icon']");
|
||||
return link?.href;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user