TileBoard - New dashboard for Homeassistant

Can you please give the example of how to implement temperature and humidity in one card?

I’m trying to create Google calendar to show me next 5 events as its for my Lovelace. I tried with list but in

I start with LIST but the problem is atomic_calendar have just one entity and loop across the days and im not sure how to do it with TileBoard ( java ).

For LoveLance its just a custom card with entity: calendar.google_calendar and the custom card is doing the next 5 upcoming envois. How i can create useful calendar in TileBoard ?

It is a tile with TYPE.TEXT_LIST

                  {
                     position: [0, 1],
                     width: 0.75,
                     type: TYPES.TEXT_LIST,
                     title: 'Спальня',
                     classes: ['-sensor-dual'],
                     id: {},
                     state: false, // hidding state
                     list: [
                        {
                            value: '&sensor.xiaomi_sensor_3_temperature.state',
                            unit: '&sensor.xiaomi_sensor_3_temperature.attributes.unit_of_measurement',
                        },
                        {
                            value: '&sensor.xiaomi_sensor_3_humidity.state',
                            unit: '&sensor.xiaomi_sensor_3_humidity.attributes.unit_of_measurement',
                        },
                     ],
                  },

just having custom style:

.-sensor-dual .item-list--item{
  margin: 3px 0;
  overflow: hidden;
  font-size: 24px;
  line-height: 48px;
  text-align: right;
}
.-sensor-dual .item-list--value {
  width: 100%;
}
.-sensor-dual .item-list--item:first-of-type {
  text-align: left;
}
.-sensor-dual .item-list--item:first-of-type .item-list--value span {
  vertical-align: super;
  font-size: 22px;
  margin-top: -8px;
}
.-sensor-dual .item-list--item:first-of-type .item-list--value span:first-of-type {
  vertical-align: inherit;
  font-size: 42px;
  margin-top: inherit;
}

1 Like

When I add the files for localization in index.html, it will only work on the header. But I would also like to get info I have in som tiles to be localized.

I have tried pretty much every possible combination, with local file, hoste, moment-with-locales.js, moment.js, both min and normal, but it will not change the locale for the tiles, only header…

Any ideas?

What do you mean by the header - datetime?
What data do you display in tiles?

A good night sleep can solve a lot of problems :slight_smile:

I had linked to angular-locale instead of moments locale…

Good to see you figured it out!

And just noticed you need to keep the angular-local för the HEADER_ITEMS to show your locale. Unless it is HEADER_ITEMS.CUSTOM_HTML who wants moment locale…

why couldn’t they join forces and just have one for all settings?

You can open an issue over at GitHub perhaps to address this.

1 Like

Garage cover via MyQ no longer working

Hi all. My garage tile will show if the garage door is open or closed, but will no longer work as a button to open/close the garage. Not sure when this stopped working. Possibly a month or less. Had been working with this code for over a year. The Lovelace card still works. Any ideas?

// GARAGE DOOR \\
                {
                    position: [1, 2],
                    type: TYPES.CUSTOM,
                    title: 'Garage Door',
                    width: 1,
                    height: 1,
                    id: 'cover.garage_door',
                    theme: ITEM_TRANSPARENT,
                    icons: {
                        'open': 'mdi-garage-open',
                        'closed': 'mdi-garage',
                        },
                    action: function(item, entity) {
		            var action = 'open_cover';
		            if(entity.state === 'open') {
		                action = 'close_cover';
                        }
		            Api.send({
			        type: 'call_service',
			        domain: 'cover',
			        service: action,
			        service_data: {
			        entity_id: 'cover.garage_door'
			                 }
		                 });
                  }
                },

Do you have any documentation re the modal dialog? Sounds interesting.

Hello,
Can you please share the code for the background change accordingly to the weather conditions?

Thanks

Somehow it stopped working as a button when I upgraded tilbeboard. I went back to an old version and it worked fine.

Has anyone found a working calendar function for Tileboard, that shows multiple appointments/events? For Lovelace i’m using a custom Google Calendar card to show multiple events, but in Tileboard i’m only able to have the next event showing :slight_smile:

Hi, I’ll see if I can hunt it down for you.

Instead of Api.send use this.apiRequest.

1 Like

Hi,

Is anyone suffering this annoying problem on amazon tablets " Web page not available " net:err_name_not_resolved

I only get this problem with tileboard, home assistant lovelace loads no problem i’ve tried different browsers ive tried three diffrent amazon tablets all the same error.
Tileboard works fine on all my computers and iphone its literally just the amazon tablets.

in addition ive tried with no success…
manually setting DNS
Factory reset on one amazon tablet
full reboot of my network

any help would be much appreciated ive been banging my head against the wall all night with this one

Thanks! I’ll go back to the update and try this on Jan 2nd

Just started playing with TileBoard to use on a wall mounted tablet, so impressed with this project!

Is there a way to show a simple line chart in a tile? I get it we can embed grafana with an iframe but that’s overkill and would ruin the UI simplicity.

1 Like

This may be possible, there is an example on the github page using the ‘history’ component:

   /* Object containing history settings */
   history: { // If this is present in a tile, a history popup is created on secondary action
      entity: 'sensor.temperatur_innen_gefiltert', // Entity ID (or an array of IDs) to render history for. Default: entity id of the tile itself
      offset: 24*3600*1000*5, // Start point of the history counting from now(). Default: one day
      options: { elements: {point: {radius: 3}}}, // Chart options. Refer to https://www.chartjs.org/.
      styles: { border: '1px solid red'}, // Styles to apply to the <div> containng the chart. Default according to main.css
      classes: 'clock--colon', // Classes to apply to the history popup. Default according to main.css
   },

I was never able to get it to work for me, it’s quite a new feature so I couldn’t see an example in the ‘TILE_EXAMPLES’ file.