TileBoard - New dashboard for Homeassistant

[Jonde]

Please do that, I think it might help a lot!

[cgarwood (Charles Garwood)]

I use the following config for my 8" Kindle Fires:

customTheme: CUSTOM_THEMES.COMPACT,
tileSize: 140,
tileMargin: 6,
groupMarginCss: '32px 24px', //vert,horiz

That lets me fit 2 groups two tiles wide & 3 tiles tall , and 1 group 1 tile wide and 3 tiles tall without scrolling.
I’m not using a header yet, but there’s enough space i should be able to bump everything down a bit to fit it in when I do add it.

[J_IO_B]

My configs below, I didn’t like the menu item size with compact theme on but I might revert back as I add more pages. Looks great on all my Fires.

customTheme: null,
tileSize: 150,
tileMargin: 6,
groupMarginCss: '125px 10px 10px',

And my header

header: { // https://github.com/resoai/TileBoard/wiki/Header-configuration
    styles: {
        padding: '10px 130px 0',
        fontSize: '22px'
    },

[Jonde]

I now have compact theme and changed settings according to J_IO_B’s and it just fits with 2 tiles width and 3 on height per group.

I forget to mention that I have the old Fire HD 10 (5th gen). On that device the long hold for tile does not work. It does work on my phone and PC so the fault is Fire HD. And the lousy Silk browser does not support full screen without installing another browser witch is not so easily done on this old one since it has too old Android.

But thanks for these! I think that I order Kindle Fire 8 since it is a bit faster and more responsive than this old Fire HD 10.

Has anyone added color changing to light bulbs? I have the brightness and color temp but would be great to have some sort of color picker too

[J_IO_B]

I’d definitely get rid of the silk browser, even if you do change to a Fire 8. Look into Fully Kiosk Browser, they do a special version for Amazon Fire Tablets now. Although some functionality is still not present its a HUGE improvement from a normal browser.

https://www.ozerov.de/fully-kiosk-browser/

[franzuu (Franz)]

@e1miran

Just wanted to share my first attempt with this dashboard after a day of working with it. There are still some customizations to go regarding icons, bg colors and other detail-type stuff. Especially figuring out icon positioning for the half-size tiles - can I somehow place icons within the subtitle or title fields?

Has anyone figured out how to make and align micro size switch tiles? (like in the screenshot of post 388, the little green and blue switches).
I would like to add them as quick switches and align them vertically to the right side of my 10" tablet running a kiosk browser .

[JoRoCoBo]

@J_IO_B

125px 10px 10px

Ah, this just got rid of my header overlapping issue. I’ve adjusted to ‘80px 10px 10px’ and it’s perfect for me.
Now, if I could just get date and time on the same row on the left of the HEADER, life would be complete.

[JoRoCoBo]

hi @franzuu, you need to specify the tile height, width, and position as fractions, and you can also use customStyles to change any style for the tile.

            {
                position: [2.5, 1],
                height: .5,
                width: .5,
                type: TYPES.SWITCH,
                id: 'group.g_fans',
                customStyles: {
                    'backgroundColor': 'orange'
                },
                states: {
                    on: "On",
                    off: "Off"
                },
                icons: {
                    on: "mdi-fan",
                    off: "mdi-fan"
                },
            },

[e1miran]

Here’s my most recent iteration on a small tablet.

And a phone layout.

[JoRoCoBo]

These look excellent, I’ll have to up my game.

[cgarwood (Charles Garwood)]

If we’re sharing dashboard layouts, here’s mine for my main living room tablet (8" Kindle Fire)

Got some updates to make still on the first page (specifically the Quick Access and Test columns), and the Media, Security, and Maintenance tabs still need some work. Also need to finish the interface for our master bedroom tablet and get interfaces made for tablets in the other two bedrooms.

[vegard (Vegard S)]

@e1miran : What type of tile did you use for the media part (the “now playing”)?

[Maaniac (Yoav Tigelman)]

@e1miran how did you set the icon size for the small tiles. I changed them globally in my instance the light bulb icon still seems too big for the small tile size.

[e1miran]

It’s an iframe tile. I use MPD (mopidy) for media streaming, following this guide: https://www.vittoriomonaco.de/home-automation-part-7.html. The iframe is pointing to the mopidy client.

[e1miran]

classes: [CLASS_MICRO]

[joq3]

Just installed TileBoard on a webserver (nginx) which I run locally on my NAS. I can see the example switches, and it looks like it has access to my Home Assistant config.
But I get this error at every refresh:

Entity "updater.updater" not found

[resoai (Alexey)]

You need to edit the config and add tiles, remove updater tile since you don’t have updater component.

[vegard (Vegard S)]

I have been playing around with this project a few hours now and I really enjoy it. I have a little question tough.
The media player tile is showing the album art trough the bgSuffix parameter. Is it possible to have one tile showing only the album art, and another tile showing all the controls for the same media player? So far I haven’t been able to figure this one out. Any advice or approaches is greatly appreciated

[joq3]

I have a light which is controlled via IR. Turning it on and off with two specific IR codes, and setting it’s brightness with two other codes. I have made two switches in Home Assistant to control this.
I was able to use the switch to turn on and off the light in the LIGHT Tile Example.
But would it be possible to turn on or off the brightness switch with the slider part?

     {
         title: 'Brightness',
         field: 'brightness',
         max: 255,
         min: 0,
         step: 5,
         request: {
            type: "call_service",
            domain: "light",
            service: "turn_on",
            field: "brightness"
         }
      }

[resoai (Alexey)]

I’m not sure I fully understand what you are trying to do however light tile only works within one entity. Why not use template light control to make a single light entity?

Template Light