Home Assistant HADashboard Skin Sharing

I could get the link in Grafana, but it doesn’t load. If I try the link in a browser, Grafana asks for user and password. How do you circunvent this? If I try the link in a browser that is already logged, then the image loads.
Has this something to do with API key?
Thanks for your help.

Yes, it only works loading hadashboard in a browser that had already logged in Grafana.
How to make it work everywhere?

Ah, yes. If you do not allow anonymous connections to Grafana, you must provide authentication mechanism for retrieving graph images. I wrote simple PHP script (Grafana Graph PHP Proxy · GitHub) which works like proxy between Grafana and HA. For setup instructions please read inside file. To retreive Grafana image just use same options as used in Direct Image. For example:

http://<your grafana url>/d-solo/Hbabhzha/home-assistant?panelId=9&width=250&height=125

Becomes:

http://<your graph.php file location>/graph.php?panelId=9&width=250&height=125

Additionally, you can provide w & h options to resize image:

http://<your graph.php file location>/graph.php?panelId=9&width=250&height=125&w=75&h=50

2 Likes

Thanks for sharing your code. It’s probably simple from now on, but I’m afraid that this is not the case for me. I will have to learn many things how to do it, which is not a bad thing. It will probably take some time though.
Great tip. Thanks!

Well, easiest way to do is to enable anonymous access to your Grafana, and your graph images will be accessible without authentication mechanism. Auth is not a big problem if you sitting behind NAT / Firewall and do not expose Grafana to public network. Unfortunately, this was not my case, so I had to use some auth proxy. Let me know if you’ll need more help.

I’m just starting to build my dashboard. I think it’s a good start. The camera on the right is actually an iframe with a url list of multiple dashboards that each show a different camera. That way the iframe cycles through the cameras like a carousel.

1 Like

My Dashboard is still very very much a work in progress, but one page i feel happy enough to post is my music panel. Again, still playing around with theme’s and layout, but this is currently how it stands, and probably wont stay like this for more than a week :smiley:

2 Likes

Very nice. It gives me an idea for a music panel. A few questions…

  1. What are you using for “Now playing”?
  2. What devices are you using for streaming? (each room)
  3. What is your Playlist tile controlling?

I currently use 7 chromecast audios, 1 Google Home, 1 Google Home Mini. And I’d like to come up with a similar concept.

It’s taken me a while to get it running like this, and how I want it, but something similar to your setup. I have 6 Chromecast’s running around the house, and am using Mopidy player to play the music (installed on the same Pi as HA), that streams it over to Icecast (same Pi), that the Chromecast’s then pickup and play around the house. Its not a super simple setup, but once its up and running, it seems to be awesome. Can create groups in the Google Home app, and then stream to those groups too. So to answer,

  1. Now playing is the Iris interface through Mopidy, it works as you seen it on a desktop, but its not quite perfect on a tablet, I need to speak to the developer to see if he can help me out, but it works ok on a tablet, just a doesn’t size the iframe correctly.

  2. Chromecast’s as above loading a feed from Icecast.

  3. its just a input_select that links to a script that then starts a playlist on Mopidy.

https://www.vittoriomonaco.de/home-automation-part-7.html <-- this link is what got me started playing around with this setup. Its a bit out of date now, so if you are going to follow it, be warned whoever wrote it did when rasbian jessie was out, its now on strech, so you will need to adapt for that.

Any other questions, just shout.

1 Like

Thanks. I’ll look into those. My issue is that I’m running hassio on a laptop running ubuntu server, so a lot of the pi specific stuff I don’t know how to get running with my configuration. But I’ll keep working at it. I would like to get the kind of control you have in your set-up. Thanks again.

1 Like

there shouldn’t be anything in there that is Pi specific, all the guides should work fine with just normal linux, you might just have to change a command here for there for that correct linux distro you are using :+1:

1 Like

Cool. Does Mopidy work with Google Play Music?

I think so, there is a handful of plugins for it, I am just using Spotify and Tunein.

1 Like

Just tweeked my music dash quickly to make a mobile version for my iPhoneX.

4 Likes

Your music panel has a similarity to my own music panel!

3 Likes

Can you tell me how you set the selectcontainer_style and select_style to have the sliders in that way? Cannot find any documentation about it… @Darbos

selectcontainer style and select style are for an input select widget.
you probably talk about slider_style and the documentation is on w3schools

Yes you’re right, about input_select… i don’t find any documentation about those options. I think they are related to the visual of the select options…

https://www.w3schools.com/howto/howto_custom_select.asp

the css you find there can be used in the select_style

How you set the weather widget in that way?

with CSS :wink:
with CSS you can control the place from elements inside a widget, the size the color etc.
but it could also be a custom widget.