Announcement: HADashboard v2 Beta!

thundergreen · March 7, 2017, 5:56pm

That’s awesome! Would be an idea Yeah

aimc · March 7, 2017, 6:03pm

That’s expected behavior - what is the contents of compiled/javascript/default/<you dashboard name>_init,js?

aimc · March 7, 2017, 6:03pm

Also, are you getting any errors on your javascript console?

joyrider3774 · March 7, 2017, 8:38pm

just got it installed on windows no need to modify anything works out of the box without a problem. Install went much easier than the 1st hadashboard version i was using. Now i have to start rebuilding my old dashboard in the new version.

So windows install has no problems as far as i could see in case anyone is using windows as well.

lordsiris · March 7, 2017, 11:02pm

@Tyfoon I posted a working copy of my custom skin at:

https://github.com/arraylabs/hadashboard-skin-clear_sky

Some basic details in the readme file, and zip download available in the releases area.

joyrider3774 · March 7, 2017, 11:40pm

Got it running on my android tablet / converted It’s not completly fullscreen as i have not found a way to hide the lower bar in android but seems to display the same as hadashboard v1

i do notice that the obsidian theme does not display units with my dashboard while other themes do, not sure if it’s due to me having unit_style tags to change font color and size (it was a bit too big for the tile and only changing size, changed the color somehow in the default skin)
edit: it’s due to me adding font-size and color tags with unit_style in the widgets i removed them and it displays fine now in the skins. I do think the default font size for the sensors might be a bit too big but i’ll make a copy of a skin and modify the values there for my own needs so i have a seperate skin

Mattier · March 8, 2017, 9:47am

Installed the Dashboard and managed to get it up and running using the instructions without any issues. Few things:

is there a reason that aiohttp should be the specified version? I’ve newer version and seems to work fine with it.
the weather widget shows the data using imperial units although the actual values shown in HA are SI (metric) units. I’d expect that I’d reference the same unit format as the darksky api is called with. (See ‘units’ from here: https://darksky.net/dev/docs/forecast)
-I can’t find a ‘gauge’ style widget from the documentation, but some people have posted screenshots that make me think there might be some available? I’d like to show for example humidity as value but also as gauge (0-100%) and similarly power (0-20kW) with possibly some color changes within the range (for example for power 0-8k is green, 8k-15k yellow and above would be red). Similar as Gauge outputs on Node Red dashboard would be super-cool

aimc · March 8, 2017, 12:18pm

It was the latest when I started work, but later should be fine, I’ll change the docs and installer.

I’m going to rework the Weather widget soon, I’ll do what you suggest - I am planning on doing that for other devices too - sensors should get the units from HA rather than have the user specify them.

The old version of HADashboard had a meter widget which is probably what you have seen.There isn;t one yet in v2 but it is coming for sure

fversteegen · March 8, 2017, 12:22pm

The contents are below. I do not get any javascript errors in my browser’s console.

$(function(){ //DOM Ready

$(document).attr("title", "HADashboard");
content_width = (120 + 5) * 8 + 5
$('.gridster').width(content_width)
$(".gridster ul").gridster({
    widget_margins: [5, 5],
    widget_base_dimensions: [120, 120],
    avoid_overlapped_widgets: true,
    max_size_x: 8,
    shift_widgets_up: false
}).data('gridster').disable();

// Add Widgets

var gridster = $(".gridster ul").gridster().data('gridster');



var widgets = {}
// Initialize Widgets


// Start listening for HA Events

ha_status('ws://192.168.1.5:5050/stream', "HADashboard", widgets);

});

aimc · March 8, 2017, 12:50pm

I copied your dash file exactly and got 2 widgets. The only way you would be seeing what you are is if you had ommited or misspelled the layout directive.

Rynoman2k3 · March 8, 2017, 4:04pm

Looks nice. Quick question though. What did you use to get the “Git” command to work on your android tablet.

aimc · March 8, 2017, 4:07pm

This is a web application that runs on a server, and serves the dashboard to a tablet, no need for any code on the tablet.

Rynoman2k3 · March 8, 2017, 4:13pm

Oh, well I feel stupid now.

Ok, will look more into this when I get home. I was trying to program my tablet on break.

Thanks!

scadaguru · March 8, 2017, 5:24pm

Did you mange to use material design icons? If yes how it was like icon: md-fire or icon: mdi-fire?
I couldn’t get it working for switch widget as shown below:

fireplace:
  widget_type: switch
  title: Fireplace
  icon: mdi-fire
  icon_on: mdi-fire
  icon_off: mdi-fire
  entity: switch.fireplace_switch_9_0

rpitera · March 8, 2017, 5:29pm

I just tested and mdi-fire is working fine for me. Try removing the line “icon: mdi-fire” as that is not a valid option.

switch

A widget to monitor and activate a switch

Mandatory Arguments

entity - the entity_id of the switch

Optional Arguments:

title - the title displayed on the tile
title2 - a second line of title text

Cosmetic Arguments

icon_on
icon_off
widget_style
icon_style_active
icon_style_inactive
title_style
title2_style

scadaguru · March 8, 2017, 5:38pm

Thanks a lot. I found the issue. I had widget correctly defined but in the layout I was using entity id rather than widget.
It is working now thanks a lot.

Now I will have to figure out how to have color changed of that fire icon when it is on as material design has only one icon fire no colors. I want to keep HA and Dashboard same look and feel.

I like the customization of icons in AppDaemon Dashboard to be different from HA but it would be really nice if we could just reuse the icons which are already customized in HA, so basically same UI in both applications, not sure though it’s possible or not.
Thanks again.

rpitera · March 8, 2017, 5:40pm

Change the color here:

icon_style_active
icon_style_inactive

If you for instance wanted the color to change to red when it is on, do this:

icon_style_active: “color: red”

rpitera · March 8, 2017, 5:42pm

It would add a bit of overhead in processing as AD would have to cycle through each entity to figure out what icon was used in HA and if a customization was in place.

Personally I like the flexibility - super important in my opinion - of using Font Awesome icons. Most of the skins in the beta use a combination of MDI and FontAwesome icons. Having access to both is a critical improvement on HA, which is limited to MDI only.

scadaguru · March 8, 2017, 5:48pm

Yay! It worked! Learnt something new.
Thanks a lot.

rpitera · March 8, 2017, 5:49pm

As @aimc said, the SimplyRed does this already, changing the color of the background from light to dark depending on the time of day. But I am working on a similar script to change the background based on the weather and hope to get it finished soon. When I do, it will probably be in a new skin.