TileBoard - New dashboard for Homeassistant

Thanks @resoai I’m so excited about this, got my first few tiles up!
Is there a way to call 2 scripts on the light entity instead of increase / decrease of brightness?

1 Like

I don’t think I fully understand what you are trying to do with the scripts and brightness to be honest. There is a template light component which allows you to define actions manually

Great work so far Resoai!

I’m trying to change the header, but running into a small problem (probably my lack of CSS knowledge tbh…)
In the left part of the header, I added a logo. Next to that I would like to have the time/date. However, this hets aligned under the logo. How can I align it to the right of the logo (but still in the left header section)?

Please note, I’m working on a 7" display, so I made everything smaller :wink:

header: { // https://github.com/resoai/TileBoard/wiki/Header-configuration
  	   styles: {
         padding: '0px 5px 0', //was '30px 130px 0'
         fontSize: '14px'
  	    },
  	    right: [],
        left: [
        {
          type: HEADER_ITEMS.CUSTOM_HTML,
          html: '<img src="images/logo.png" width="50" height="50">',
          styles: {
            margin: '5px 0 0' // was '40px 0 0'
          }
        },
        {
          type: HEADER_ITEMS.DATETIME,
          dateFormat: 'EEEE, LLLL dd', //https://docs.angularjs.org/api/ng/filter/date
    }
        ]
     },

find the date and time divs, and add float:left to their css.

It looks like tileboard doesn’t support a floorplan? Has anyone got a floorplan to work? or can you use a lovelace picture card on tileboard?

Wow - Tileboard is great stuff.
I’ve got a simple question. I have created a tile for device_tracker and it’s working fine. I would like to show different pictures based on the state (One for Home and another for not_home). How can I do that?

		   {
					position: [1, 3],
					type: TYPES.SENSOR_ICON,
					theme: ITEM_TRANSPARENT,
					title: 'Jannie',
					id: 'device_tracker.7867d73ef197',
					states: {
						home: "Hjemme",
						not_home: "Ude"
					}		
				},

You would need something like this:

      type: TYPES.GENERIC_ICON,
      icons: { ... },

Thanks, that helped a bit. I’m able to change mdi icons based on the state. Can I use my own pictures instead of mdi?

					icons: {'not_home':'mdi-lightbulb-off','home':'mdi-lightbulb-on'},

Is it possible to implement a timer on off widget?
Similar to this

That helped a lot, thank you!

I am in the process of implementing something similar using a Node Red dashboard widget in an IFRAME from within TileBoard.

4 Likes

In such case you might need to revert back to DEVICE_TRACKER tile and use anonymous function for bg or bgSuffiux.

Thanks resoai. Not sure I know what anonymous function is. Can you elaborate?

You will find a lot of information on our Wiki. Here is a direct link to the anonymous functions:

We have just pushed an update implementing new authentication system and completely dropping support for legacy api_password so please make sure you have HA 0.77 installed prior to the update.

Unfortunately moving to oauth 2.0 also means that it is no longer possible to access TileBoard via file:// protocol .

Hi @resoai
Other than copying the files over, do we need to change anything in the config to make use of new auth system

Nope. You can remove password and PASSWORD_TYPE from config since they are no longer needed.

thanks mate, works perfectly

Thanks, I realized what the real issue is - my lack of javascript skills :slight_smile:

Anyway I found a video “Learn JavaScript in 12 min” and I managed to make my first few lines of JavaScript. The device tracker looks like this.

The code looks like this if anybody wants it.
indent preformatted text by 4 space
{
position: [0, 2],
type: TYPES.DEVICE_TRACKER,
theme: ITEM_TRANSPARENT,
title: ‘Jannie’,
id: ‘device_tracker.c0d3c01c0bed’,
states: {home:‘Hjemme’, not_home:‘Ude’},
bg: function (item, entity) {
if (entity.state === ‘not_home’) {
return ‘/local/tileboard/images/jannie-red.png’;
} else {
return ‘/local/tileboard/images/jannie-green.png’
}
}
},

7 Likes

Is there a way to show in tileboard a radar like this from www.windy.com?

Maybe it would be also nice to use it as a screensaver.

1 Like