TileBoard - New dashboard for Homeassistant


You can add ignoreErrors: true to the root of CONFIG variable which suppress all error notifications.


I know about https://github.com/resoai/TileBoard/issues/128
Has anyone tried to simply re-use the polymer color-picker ?
I’ve played with spectrum but it’s not really suitable for lights


Im trying to get this to work on a IPAD 1, because of it’s age it dosen’t load the HA UI - the authentication page. Anyway around this??


Authentication is HA’s part so we have no control over it. You can bypass it by specifying a long-lived token.


On the weather tile, is it possible to place the low and high temperatures on the same line as the humidity and wind? I don’t see an easy way to do this with CSS, but maybe I’m missing something.


How I can set better fonts/view for non retina ipad (1/2)?



Do I just specific a random character in the config.js or do I have to do something on HA side?



I would try making the tiles a little bigger, the Ipad 1/2 has quite a low res screen for it’s size (1024/768)


I’m using transition: TRANSITIONS.ANIMATED and also with transition: TRANSITIONS.ANIMATED_GPU, and I’m getting an empty space at the top when switching to other pages.


If I’m working without transition (SIMPLE) it appears aligned correctly.

How can I fix this?


I’m trying to embed a Google Maps, showing the route to working, in my Tileboard. In the Google Maps I have created this code

//<iframe width=“600” height=“450” frameborder=“0” style=“border:0” src=“https://www.google.com/maps/embed/v1/directions?origin=sorrentovej%2032%2C%20&destination=vantårnsvej%20110&key=AIzaSyCXXXXXXwicEouS11rqdEs4bSJhCPy6k” allowfullscreen></iframe>

To place it on tileboard

position: [0,0.5],
id: {},
width: 9.3,
height: 5,
refresh: 300000, // 10 seconds
url: ‘https://www.google.com/maps/embed/v1/directions?origin=sorrentovej%2032%2C%20&destination=vantårnsvej%20110&key=AIzaSyC6XXXXXXwicEouS11rqdEs4bSJhCPy6k

Running the TileBoard gives me this message
Google Maps Platform rejected your request. This API project is not authorized to use this API
Any idea how to fix this?


It is not a good idea to publicly share your API key. Also the error message is basically tells my you what is wrong :slight_smile: you would need to enable API for that project.


If you go to main.css and find the class “.-hide-scrollbar .page” Should be online 192. Change the percentage to 100% should fix your issue. At least it did for me


Thanks, it solved:



Other than google or yandex can we use another maps for device tracker? Eg openstreetmaps?


One could possibly implement it but why?


Please Help
I have problem with config


  base_url: xxxxxxx.duckdns.org:8123
  ssl_certificate: /ssl/fullchain.pem
  ssl_key: /ssl/privkey.pem
  ip_ban_enabled: false
  login_attempts_threshold: 3
  api_password: "xxxxxxxx"


   serverUrl: "https://xxxxx.duckdns.org/",
   wsUrl: "wss://xxxx.duckdns.org/api/websocket",
   password: "xxxxx",
   authToken: null,


Hi @resoai,

I´m trying to add my own Tile, a custom version of Alarm Tile. It will have the same functions as Alarm tile when you press it but I want to add more fields to the card. I’m trying to figure out where to put the code.
I have figured out that I can adjust current tiles in index.html and add divs to show more info but I rather add a new Tile.
Would you mind doing a quick write up the where that needs to be defined. I’m happy to contribute back with the Tile I come up with.


First of all you need to define your own tile type in /scripts/app.js:

var TYPES = {
   MY_TILE: 'my_tile',

You can than handle the clicks etc in:


Don’t forget to add appropriate CSS rules for your tile.


Man, your response time in this thread is impressive :smiley:
Thanks for this and I’ll test it later and most likely get back with a couple of questions.

I want to add more fields like the weather card. I found a field parser, getweatherfield. What’s your opinion here. Re-use it or copy it and rename it?