TileBoard - New dashboard for Homeassistant


Vacuum Type.
I noticed in the tileboard code there is a vacuum type. Where can I find instructions on how to set that up?



Does anyone know how to (or if it’s even possible) to do the following:

  1. Provide a direct link to a page (for example link to page 2)
  2. link from an element. Because this is written in Angular, I can’t really use good old html.

Basically the goal is to have a selection of core lights on the homepage but with a link to go to see a page of all lights.



I’m using the Tileboard onan Samsung Tablet with fully kiosk browser. When I approaching the tablet the screen turns on fine, but when I push a Tile, I mostly need to push three times to get started. After that it works perfectly.

I not really sure if the is related to Tileboard or Fully Kiosk Browser, but any hints on how to fix this is appreciated.


For your first question:


@resoai has development stopped for TileBoard?


Everything that had to be implemented has been implemented so in a way, yes.


Any future plans? or… phase it out?


Hi… trying to add some human logic into the header so it reads better for the weather. Reusing some code… but can’t seem to get it to work correctly… Be good to to solve this :slight_smile:

This is what I currently have in Index.html…

And in the config:

  icon: '&sensor.dark_sky_icon.state',
     icons: {
        'clear-day': 'clear',
        'clear-night': 'nt-clear',
        'cloudy': 'cloudy',
        'rain': 'rain',
        'sleet': 'sleet',
        'snow': 'snow',
        'wind': 'hazy',
        'fog': 'fog',
        'partly-cloudy-day': 'partlycloudy',
        'partly-cloudy-night': 'nt-partlycloudy'
     fields: {
        summary: '&sensor.dark_sky_summary.state',
        temperature: '&sensor.dark_sky_temperature.state',
        temperatureUnit: '&sensor.dark_sky_temperature.attributes.unit_of_measurement',
        precipitation: '&sensor.dark_sky_precip_probability.state',

Anyone help?


I have the same issue. Samsung tablets with fully. Have you tried using a different browser? I’m curious to see if it’s that’s


TileBoard is great! I’ve been loving it so far, though is there a way to get the equivalent of the Logbook component? https://www.home-assistant.io/components/logbook/


I never understood why people think that developers abandon the project only because they don’t see any new code being added every day :slight_smile: TileBoard does what it was intended to do hence you don’t see any frequent updates.


But I’d love the ability to change the Hue light colours via a long press :joy:


You can’t please everyone :slight_smile: but I’ll try to find some time to look into it (can’t make any promises).

               	  summary: function() {
               	  	var precip = this.parseFieldValue('&sensor.dark_sky_precip_probability.state');
               	  	var out = 'XXX';
               	  	if (precip < 20) {
               	  		out = 'YYY';
               	  	return 'Whatever ' + out;


That’d be awesome!! :slight_smile: thank you


Do I just add this to the .js file and not the index?


Yes, you should only make changes to the config.


Thanks for posting this – this is an awesome start. I just spend sometime picking it apart and seeing how I can work this out and into the config file but seem to be having trouble. I did however manage to pick the original code and I think it is essentially saying…

Look in the ‘summary’ field and look for the rain and snow words
<span ng-hide="match(getWeatherField('summary', item, {}),'rain|snow')">

AND IF ‘precipitation’ is less than 25 THEN show “it’s unlikely to snow” (show the word ‘snow’ and ‘hide’ the word rain)

<span ng-show="getWeatherField('precipitation', item, {}) > 5 && getWeatherField('precipitation', item, {}) <= 25">It's unlikely to 
<span ng-show="getWeatherField('summary', item, {}),'snow')">snow</span><span ng-hide="getWeatherField('summary', item, {}),'snow')">rain</span>

Here are my values I am aiming to get it to react upon. I guess I am just having the issue with the snow and rain matching.

‘precipitation’ > 95">It’s going to ‘summary’ (rain) later
‘precipitation’ > 75 and <= 95">Strong chance of ‘summary’ (rain)
‘precipitation’ > 50 and <= 75">Good chance of ‘summary’ (rain)
‘precipitation’ > 25 and <= 50">Good chance of ‘summary’ (rain)
‘precipitation’ > 5 and <= 25">It’s unlikely to ‘summary’(rain)
‘precipitation’ > <= 5">No ‘summary’ (rain) forecast

‘precipitation’ > 95">The ‘summary’ (snow) is going to keep coming
‘precipitation’ > 75 and <= 95">Likely this ‘summary’ (snow) will be on for a while
‘precipitation’ > 50 and <= 75">Chance this ‘summary’ (snow) might ease up soon
‘precipitation’ > 25 and <= 50">Looks like this ‘summary’ (snow) will stop soon
‘precipitation’ > 5 and <= 25">The ‘summary’ (snow) will stop very soon
‘precipitation’ > <= 5">No ‘summary’ (snow) forecast after this shower.

Thanks in advance…


In case anyone else is interested, I made a change to index.html to support the hidden property on screensaver or header items. My use case was that I wanted to show my Waze commute time on the screensaver, but only during the morning hours before I left for work. I updated line 361 to read as follows:

<div class="header-item" ng-class="'-' + item.type" ng-style="item.styles" ng-if="!isHidden(item,'null')">

I also added this as a pull request.

@resoai, you did great work on TileBoard and I’m absolutely loving it! This is exactly what I was looking for and has made my HASS experience that much better.


Not sure if you were able to figure this out using the CUSTOM_HTML type, but you can use the weather type to pull in data from any entity, not just weather. So, I ended up adding a weather type item and just used the temperature field to pull in the sensor I wanted:

		fields: {
            temperature: 'Time to work: &sensor.travel_time_to_work.state min'
		styles: { fontSize: '19px' },
		hidden: function() { 
				if (this.parseFieldValue("&input_boolean.show_commute.state")==="on") {
					return false;
				} else {
					return true;

This is for the screensaver but the same would work in the header.