TileBoard - New dashboard for Homeassistant

iOS 10.3.3, so it seems something changed after this

I think it has something to do with the new auth. method introduced in Home Assistant. When trying to log on to Home Assistant, I only get the logo together with the text “Initializing”, and it stops.

Hi,

This looks great! Is anyone using it with the Alarm tile and could share some screen shots of that? I wonder how it looks like for with arming/disarming the alarm. Does a keypad popup or something? It would be nice to have a keypad tile for the alarm component.

Thanks

Oh, that thing! I could also not log in on my old Nexus 7 (Android 4.4) This could be filed as a HA bug.

1 Like

I’m new to this, wondered if this view can be added to a device such as Lenovo smart display (or any Google assistant screen) or echo show…

Good to hear! To be honest I did not read through every 1127 posts :wink:
But I also see that post i from July 4 so when can we expect this? :slight_smile:

Last thing. I have not found a changelog. That could help to keep track of changes and to know what changed when.

Alarm tile has been implemented ages ago. We include a short description with every commit.

2 Likes

Aah sorry! I misunderstood your answer. Thanks!
And thanks @aidbish for your screenshot.

I’m trying to install Tileboard but I’m running in some issues you had too.
Whenever I’m trying to navigate to my tileboard; https:ha.duckdns.org/local/tileboard/index.html
I receive a 404: not found error.

My config.js:

serverUrl: "https://etc.duckdns.org",
wsUrl: "wss://etc.duckdns.org/api/websocket",
passwordType: PASSWORD_TYPES.MANUAL,
password: "my HA api pass",

I’ve also tried removing the passwordType line without success…
Is anyone able to help me out here?

I created a page just for map tracking and now I have 3 questions that I could not found here in all the thread:

  1. I created a big map (10x5) and now it does not show good resolution (commented ‘yandex’, since it shows blank. The only way to get a better resolution is to use google (with API)? The default home assistant map is ok for my needs (I think it is OpenStreetMaps).

  2. Is there a way I can drag the map around?

  3. Is there a way to show more than one device_tracker in the same map?

Thanks one more time.

You are trying to mix device tracker tiles with maps. If you want a dragable and zoomable map, simply use IFRAME tile and embed Google maps with pins or any other HTML page.

I was afraid it was a dumb question… LOL
I can’t think a best way to track many devices from HOme Assistant at once if not using its own map:

{
   position: [0, 0],
   width: 10,
   height: 5,
   type: TYPES.IFRAME,
   id: {},
   refresh: 300000,
   url: 'http://192.168.1.30:8123/map'
}

I know it is maybe not the best solution, but is the best solution I could find (Home Assistant map page). Google now needs a credit card to register an API, they make money tracking all of us, so I think it was not a good idea.
If any of you have a better solution, I would like to know.
Thanks resoai for your patience.
I have been learning a lot. Could not solve the transparent tile background / RGBA thing yet, already tried many thing without success. This weekend I will try a little more. :wink:

I personally find it much more informative to display maps on small tiles, especially since my family is often far away from me (sometimes even in different countries).

As for the RGBA you need to simply supply the colour value in Red, Green, Blue and a value of opacity (Alpha) in the third parameter:

https://www.w3schools.com/cssref/func_rgba.asp

I still have the small tiles as device trackers, but I like to follow frequent travels in my family, and this way I have a better view of it. Small tiles seems to be not as good for travels. I don’t use waze and google travel sensors.

About RGBA, I visited this url yesterday. I understood that, but still no success. So this was one of my codes:

     customStyles: function(item, entity){
     if (entity.state === 'closed') {
         return { backgroundColor: 'rgba(0,204,0,0.1)',
			 };
			 }
             else {
	            return { backgroundColor: 'rgba(255,0,0,0.1)',
            };
              }
	     },	

I was also confused because your original suggestions uses “backgroundColor” and this url uses “background-color”, which gave me errors every variation I did.
There are newbie mistakes in the above code, for sure, so you can laugh… :slight_smile: Anyway is where I ended up.
Any additional tip is appreciated. :wink:
Thank you.

1 Like

0.1 = 10% visible, 1 = 100%

customStyles: function(item, entity){
         return { backgroundColor: (entity.state === 'closed' ? 'rgba(0,204,0,1)' : 'rgba(255,0,0,1)') };
},
1 Like

Thanks!
It seems that I was way out of path. For sure there are many ways to implement it, maybe my approach could still succeed, but I think it would be a pain.
Anyway, it didn’t worked. It works with null theme though. But with transparent theme it remais transparent…

Because transparency is at the parent element. May I suggest that you right-click on the tile and choose “Inspect element”, you will be able to see the whole DOM tree and styles applied to each element.

I had to screenshot, since it is hard to copy.
You may saying about this. All related to the specific tile I am interested in change: