I’m a new user to HA and HADashboard, migrating over from SmartThings. So far, I have to admit, I’m impressed with what I see (but then again, I am a geek, and this is my current interest).
I’ve got a series of dashboards setup, using a common navigation bar, and I’m wondering if there’s anyway I can tell the system to mark a navigate widget as active if it’s the current page?
I’ve tried adding a partial definition to that page with a new style, also tried adding a full definition for that navigate widget, but neither one seemed to work.
I have a couple of other questions, but I’ll do some more searching before I post those.
navigate widgets are no sensors, so there is no easy way.
you really need to get very, very creative for that.
for example:
create an input_boolean for every dashboard
create an app that listens to all those input_booleans and when 1 is set to on, turn the others off
create a custom widget that listens to the state from the input_booleans (like the switch widget) but when clicked it does the function from the navigate widget.
use those widgets for all your dashboards in the navibar.
not an easy task.
using a label widget in the main dashboard and naming the navigate widgets would be more easy and also show you which dashboard you are on
maybe a little simpler example:
create an input_select with all your dashboards
create a custom widget that navigates to the dashboard and changes the input_select
you would get a pulldown that navigates.
another option i can think of:
in the skin you use you can add extra html and scripting, for head and body.
so you could create a skin that has a navibar for your dashboard on top, that is fully customisable.
I have done this by modifying the basejavascript widget.
With dash_name = window.parent.location.pathname.substr(1).toLowerCase() you will get the filename of the currently loaded dashboard.
with nav = widget_id.substr(8).toLowerCase(), you will get the navigate widget’s dashboard entry. If nav and dash_name are equal, you can set the style of the navigate icon.
For this to work, the title of your dashboard must be the same as the filename of the dashboard.
In the basejavascript.js file, add this: https://hastebin.com/urekipucok.js just after the WidgetBase.call(self, widget_id, url, skin, parameters, monitored_entities, callbacks) line. If you don’t want to modify the basejavcript widget, just copy the widget folder to your custom widget directory and make your own navigate widget.
thanks, ill try to replicate this in a custom widget myself, if it works i will make a PR to add this option to the widget, so it gets included as option in a next version from AD.
there are more people wanting this, so its usefull.
I actually took a similar but different approach to the issue. I replaced lines 150 and 151 with a small check and set the icon and style appropriately.
I also added a parameter to allow a navigation link to “opt-in” to the new behaviour. I’ll post the updated lines this evening for a comparison.
Here’s the code I used, as I said I replaced the two lines that set the icon and icon style by default. Seeing the way that @tjntomas did the compare, I’m not sure how safe/accurate mine is.
if (
// allow widgets to opt out
("show_active" in parameters) &&
(parameters.show_active) &&
// Only for navigating to a dashboard
("dashboard" in parameters) &&
// the dashboard parameter equals the current url (is this safe?)
(location.pathname.endsWith(parameters.dashboard))
)
{
self.set_icon(self, "icon", self.icons.icon_active);
self.set_field(self, "icon_style", self.css.icon_active_style);
}
else
{
self.set_icon(self, "icon", self.icons.icon_inactive);
self.set_field(self, "icon_style", self.css.icon_inactive_style);
}
It should be okay in Python if you use ‘and’ and ‘or’ instead of & and | (assuming I remember Python properly). The main difference is the short-circuiting. Since the ‘“show_active” in parameters’ check would fail, there is no need to go on and test anything else.
