Custom Header

mayker · January 24, 2020, 11:48pm

Made a fresh HA install, created 31 tabs ( 0 - 30 ) and added an input select named “mode” with 2 options:

input_select:
  mode:
    initial: Developer
    options:
      - Developer
      - Not Developer

Using this config:

custom_header:
  show_tabs: >-
    {% if is_state('input_select.mode','Developer') %}0 to 29{% else %}0 to 3,5 to 22,27,29{% endif %}
  exceptions:
    - conditions:
        user_agent: Chrome
      config:
        show_tabs: >-
          {% if is_state('input_select.mode','Developer') %}0 to 30{% else %}0 to 3,5 to 22,27,29,30{% endif %}

Results:

In Chrome and “Developer” selected: All tabs are shown
In Chrome and “Not Developer” selected: tabs 4, 23, 24, 25, 26, and 28 are hidden.
In Safari and “Developer” selected: tab 30 is hidden.
In Safari and “Not Developer” selected: tabs 4, 23, 24, 25, 26, 28, and 30 are hidden.

Using Templates:

Keeping everything else exactly the same, but only changing the condition from user_agent: Chrome to template: "{{'Chrome' in userAgent}}" produces exactly the same results. While using template: "{{'Chrome' not in userAgent}}" produces the opposite results as expected.

This all seems to be behaving as it should. Is there anything I’m missing? Anything else you’d like me to test while I have it set up?

Gif from results of template: "{{'Chrome' in userAgent}}" in Chrome:

Mariusthvdb · January 25, 2020, 10:27am

wow thanks Ryan, impressive user support!

what would be great if you could test additionally:

conditions:
  template: "{{'Chrome' not in userAgent}}"
config:
  hide_tabs: 30

and have the show_tabs template like:

{% if is_state('input_select.mode','Developer') %}0 to 30{% else %}0 to 3,5 to 22,27,29,30{% endif %}

or, maybe even more powerful:

show_tabs: >-
  {% if is_state('input_select.mode','Developer') %}0 to 30{% else %}0 to 3,5 to 22,27,29,30{% endif %}
hide_tabs: >-
  {% if 'Chrome' not in userAgent %}30{%endif%}

in the main config.

just so you know this is not all just for the sake of it: tab 30 houses the Cast setup, so is only to be shown on a Chrome browser. ( I know i can hide the cast entity when not available, but that would still show the card (albeit empty) on a non chrome browser)

if that keeps failing, maybe I should combine it to 1 template, which I can confirm to work alright:

  {% if is_state('input_select.mode','Developer') %}
  {%- if 'Chrome' in userAgent -%}0 to 30
  {%- else -%}0 to 29
  {%- endif -%}
  {%- else -%}0 to 3,5 to 22,27,29
  {%- endif -%}

btw, after refreshing Lovelace (three dots) I often see this in Safari inspector:

and after which the header simply shows as if CH isn’t loaded at all (none of the settings in the CH config apply)

seems refresh doesn’t work anymore on Safari browser… tested both ways: in Safari directly, but also in Chrome as master controller for the Safari browser to check what happens. Disabling CH in Chrome via the input_boolean, changes layout accordingly in Chrome, but kicks in the error in Safari. Even a reload page (not refresh Lovelace) doesn’t see the change, the error persists.

ptdalen · January 25, 2020, 5:03pm

I have a simple landing page with images that I use for navigation to send me to the cards I want. I have those cards hidden from the top nav and it has worked for so long I dont even know how long I’ve been using it (a year or so)

cards:
  - cards:
      - entity: group.livingroom
        image: /local/custom_lovelace/images/living_room.jpg
        name: Living Room
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/livingroom/
        type: picture-entity
      - entity: group.kitchen_office
        image: /local/custom_lovelace/images/kitchen.jpg
        name: Kitchen and Office
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/kitchen/
        type: picture-entity
    type: horizontal-stack
  - cards:
      - entity: group.master_bedroom
        image: /local/custom_lovelace/images/master_bedroom.jpg
        name: Master Bedroom
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/master/
        type: picture-entity
      - entity: group.theater_room
        image: /local/custom_lovelace/images/frog.jpg
        name: Theater Room
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/frog/
        type: picture-entity
    type: horizontal-stack
  - cards:
      - entity: group.guest_rooms
        image: /local/custom_lovelace/images/guestroom.jpg
        name: Guest Rooms
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/guestrooms/
        type: picture-entity
      - entity: group.outdoor
        image: /local/custom_lovelace/images/outdoor.jpg
        name: Outdoor Lights
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/outdoor/
        type: picture-entity
    type: horizontal-stack
  - cards:
      - entity: binary_sensor.doors_unlocked
        image: /local/custom_lovelace/images/outdoor_doors.jpg
        name: Doors and Locks
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/locks_doors
        type: picture-entity
      - entity: group.thermostats
        image: /local/custom_lovelace/images/ecobee.png
        name: Thermostats
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/thermostats/
        type: picture-entity
    type: horizontal-stack
  - cards:
      - entity: group.thermostats
        image: /local/custom_lovelace/images/frontdoor.jpg
        name: Security Cameras
        show_info: true
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/cctv/
        type: picture-entity
      - entity: group.thermostats
        image: /local/custom_lovelace/images/routines.png
        name: Scenes and Routines
        show_info: true
        show_name: false
        show_state: false
        tap_action:
          action: navigate
          navigation_path: /lovelace/scenes/
        type: picture-entity
    type: horizontal-stack
type: vertical-stack

I recently removed the last lines of the old CCH from my lovelace using HACS, and now clicking on any navigation link that is hidden but custom header, results in an error, the tab pops up for a mili second, and then back to the home page. The error is pretty generic. I’m sure its somethnig that was removed from CCH that maybe needed to be there, but I’m not sure where>

https://myURLhere/lovelace/home:0:0 Uncaught

Any advice on where to start.

Also this only happens on my browser (chrome), but works fine on my iphone app

ptdalen · January 25, 2020, 5:30pm

Nevermind, I found it. Not sure if it was new or not, but hidden tab redirect was enabled. Turned it off and all is well

jncanches · January 25, 2020, 6:06pm

Same problem here. Thanks for the solution.
In my config hidden_tab_redirect was commented. I think its default has changed from false to true.
Explicitly writing hidden_tab_redirect: false and everything is good

Mariusthvdb · January 25, 2020, 7:32pm

not possible to create an issue out if this, please let me ask here, what this might be:

or even bigger:

Wouldn’t know where to start here. please me tag both @thomasloven and Ryan. Both errors, which appear in a ridiculous amount within a few blinks of an eye,

and are accompanied by disconnects apperntly start with card-mod and endup at custom header…

mayker · January 25, 2020, 11:28pm

@ptdalen & @jncanches

This was actually a fixed bug, you shouldn’t have been able to navigate to a hidden tab with hidden_tab_redirect on (which is the default). There were a few ways around it, including using navigation links in other cards (as you’ve found out), but now the redirect works as intended.

@Mariusthvdb For your hide/show tabs template questions:

Now I understand what you’re attempting, sorry I didn’t understand earlier. hide_tabs and show_tabs are not meant to be used at the same time. They are alternatives to each other. If they both appear in the same config then show_tabs will override hide_tabs. If one is used in an exception and the opposite one is in the default config, the exception will override the default config. This is by design. Try latest release for the typeError fix.

As for the crazy amount of failed calls appearing in your log, you’re going to need to try and narrow that one down yourself, unfortunately. I know that’s not something that anyone wants to hear, but it’s possible that none of the custom elements in those errors are responsible. One thing to check might be any devices that may need refreshed that haven’t been in a while.

mayker · January 25, 2020, 11:42pm

Thought of another helpful setting for your situation if you’re not using it yet. Click the user icon on the tablet in the sidebar (very bottom) and turn on “Always hide the sidebar”. That would at least add the extra step of them having to hit the menu button in time in order to even see the sidebar.

mayker · January 26, 2020, 4:39am

I apologize for the amount of recent releases. Keep catching bugs that I’d like to squash right after release. Hoping to improve performance, kill a few pesky bugs, etc.

DavidFW1960 · January 26, 2020, 4:50am

Just got the latest… but again HACS pulls the old version. After a restart, a reinstall pulls the new one but you have to clear cache as well… odd

mayker · January 26, 2020, 4:54am

I’m not sure what’s going on with that. I haven’t had that issue, but many others have. Is there an issue posted on the HACS GitHub? If not, you should get one up there.

DavidFW1960 · January 26, 2020, 4:59am

I posted to @ludeeus about it on the HACS thread… I’ll open an issue now as well

Mariusthvdb · January 26, 2020, 2:00pm

Ok thanks! I kept trying but had to conclude it didn’t work good to know that by design . The combined template I posted does work alright, so Im not stuck!

Most of the time this happens when changing tabs. At that same time, I see the lost connection box slide in the window, and thousands of errors are shown in the blink of an eye…

have a new issue/question: when on a tab (my developer tab) that is normally hidden, and displayed when in the developer mode (you now know of the input_boolean), I stay on that tab, even when switching off developer mode. The view should then be hidden again, and the tab icon in fact isn’t visible in the tab menu, but the browser window remains unchanged. Is this a bug, of should I have a setting preventing this?

btw I am already using 1.3.0 so it happens in the latest release also.

jimz011 · January 26, 2020, 4:27pm

Hm yeah, I have a lot of issues too since 1.2.2

it loses connection very very often when switching between tabs (it shows a the yellow cog in the app and then reconnects). Not a major deal, but when reconnected often no button works anymore.
since last nights updates: if I go to a tab that is hidden (yes redirect_hidden_tabs are set to false) it starts to go full out crazy on me and flip the views back and forth, and back and forth. Like a disco machine. Makes the ui-completly unusable. Refreshing helps but not really (this is already an issue on github https://github.com/maykar/custom-header/issues/119) but instead of him saying sometimes, for me it does it constantly.
CH has become extremely slow in switching tabs post 1.2.2 I often have to press twice on a tab. And sometimes it would just do nothing and then suddenly after 5/7 seconds it would navigate.

I did found however that all of this is happening when using show or hide tabs. It only does this when navigating to a hidden tab!

Mariusthvdb · January 26, 2020, 4:34pm

yes! sorry to say, but glad you see the same … finally to know one is not alone…
just had this discussion on 🔹 Browser_mod - turn your browser into a controllable device, and a media_player because of the fact my browser id gets reset on these frontend refreshes… do you also get the errors in inspector I posted here ?

disabling CH makes the interface fly again, and as far as I can see now, stops the errors all together, feeding the suspicion at least the CH and card-mod error in my posts is relevant. Never know which causes which of course…

Even the constant refocussing the the top of the page is gone when CH is disabled.

jimz011 · January 26, 2020, 4:38pm

I will check it when I have a pc available.

PostSven · January 26, 2020, 4:55pm

Same issue reported here

jimz011 · January 26, 2020, 5:23pm

The update from a few minutes ago seems to have solved it!

klogg · January 27, 2020, 9:26am

@DavidFW1960
I can’t get v1.2.1 to update to v1.3.1 to install at all.

I have tried uninstall, restart, clear cache, install.
But it will only install 1.2.1

Is that the order you had success with?

RogTP · January 27, 2020, 10:45am

I’m getting this error, which I suspect maybe something I’ve added, but I’ve moved back two days on snapshots and the error still occurs, I’m pretty sure it didn’t, so not sure what the trigger is.

Anyone have any ideas?

https://hassio.local:8123/community_plugin/custom-header/custom-header.js:145:62297 Uncaught TypeError: Cannot read property 'current_view' of null

Also

https://www.mydomain.co.uk:8123/community_plugin/custom-header/custom-header.js:145:62838 TypeError: null is not an object (evaluating 'F().current_view')