You can use long-lived token as a workaround.
@resoai, thank you for replying!
I checked the documentation but couldn’t get my head around it. Do you have any guidance (articles/documentation) on how to use it, please?
how can I manage a xiaomi vacuum in tileboard?
Go to your profile in HA and click on the button as shown on the screenshot. This shall be towards the very bottom of the page.
Oh I see… I should have read tileboard’s documentation on top of hass… Sorry about that, but thank you very much!
Hello all,
I am having an issue with the door entry tile, i cannot get it to work here is my config:
top of the config file:
var DOORENTRY_TILE = {
position: [0, 3],
type: TYPES.DOOR_ENTRY,
id: {},
icon: ‘mdi-phone’,
title: ‘Door entry’,
state: false,
doorEntryTimeout: 30,
layout: {
type: TYPES.CAMERA_THUMBNAIL,
id: ‘camera.front_door’,
refresh: 1500,
bgSize: ‘cover’
},
page: {},
}
My Events:
events: [
{
command: ‘open_doorentry’,
action: function(eventData) {
this.$scope.openDoorEntry(DOORENTRY_TILE, DOORENTRY_TILE.id);
}
}
],
Here is where put the variable:
title: ‘Nest’,
bg: ‘images/bg2.png’,
icon: ‘mdi-security’,
groups: [
{
title: ‘’,
width: 2,
height: 3,
items: [
DOORENTRY_TILE,
And finally the Homeassistant script to test it:
I think I modified the code correctly to add the new d value in dark sky, but now not having the weather_list show up as two lines is coming back to bite me. Do I modify the styles/main.css? The only thing I see for weather_list is this.
.item.-weather_list {
overflow: hidden;
}
Here is my corrected code for the dark sky d.
{
position: [0, 2],
type: TYPES.WEATHER_LIST,
width: 3.4,
height: 1.75,
title: '',
id: {},
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'
},
hideHeader: false,
secondaryTitle: 'Summary',
list: [0,1,2,3,4,5,6].map(function (id) {
var weekday = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ];
var forecast = "&sensor.dark_sky_overnight_low_temperature_" + id + "d" + ".state - ";
forecast += "&sensor.dark_sky_daytime_high_temperature_" + id + "d" + ".state";
forecast += "&sensor.dark_sky_daytime_high_temperature_" + id + "d" + ".attributes.unit_of_measurement";
var wind = "&sensor.dark_sky_summary_" + id + "d" + ".state";
return {
date: function () {
if ( id === 0 ) {
return "Today";
}
else if ( id === 1 ) {
return "Tomorrow";
}
var d = new Date(Date.now() + id * 24 * 60 * 60 * 1000);
return weekday[d.getDay()];
},
icon: "&sensor.dark_sky_icon_" + id + "d" + ".state",
//iconImage: null, replace icon with image
primary: forecast,
secondary: wind
}
})
}
]
},Try adding the following to your custom.css, filling in the width that you want the summary column to be. The text should then wrap accordingly.
.weather-list--secondary {
width: 100px;
}
1 Like
I created a custom.css file in my styles directory and entered in the text above. I then reloaded page. No change. I increased my height for my tile. No change. I rebooted HA. No change. Any ideas what I am doing wrong?
Thanks again.
Edit: I also increased the width to an insane amount (200px, then 300px) and still no change.
@OP: I want to say a big thanks for creating this project. It’s a great way to control my HA instance on my wall mounted Raspberry Pi tablet. 
I have a simple device tracker in HA for my phone that detects whether I’m home or away via nmap. In TileBoard, I have a DEVICE_TRACKER tile that says if my phone is “Home” or “Away”, that also shows the entity picture I set in HA.
My goal is to have the entity picture on my tile turn grey when I’m “away” and back to normal when I am “home”. Can this be done in TileBoard? Would it be something like changing the opacity when the state changes, or maybe use a different picture entirely? Right now, the entity picture stays the same regardless of my phone presence in HA.
Here is what I have for my tile:
{
title: 'People',
bg: 'images/hawaii.jpg',
icon: 'mdi-account-multiple', // home icon
groups: [
{
title: 'People',
items: [
{
position: [0, 0],
type: TYPES.DEVICE_TRACKER,
id: 'device_tracker.myphone',
states: {
home: "Home",
not_home: "Away",
},
bgSuffix: '@attributes.entity_picture',
}
]
} // end groups
]
}, // end people pageHey.
I was wondering if there was any chance that a RGB option might be on your agenda for lights?
I’m not a web dev so don’t know much CSS, but I think there is a ‘line-height’ CSS setting, you may be able to do something like
line-height: 50px;
just to see if it does something, then get the number of pixels you want after using the debug tools in your browser.
EDIT: Does anyone have a working Vacuum tile example? I’m trying to add one and I can see the status, but there are no controls to start/stop/pause/etc.
Thanks
@Algorithm_Dude I use this:
type: TYPES.DEVICE_TRACKER,
id: 'device_tracker.dan_presence',
map: 'yandex',
title: '',
bgSuffix: '@attributes.entity_picture',
slidesDelay: 2,
zoomLevels: [ 9 ],
customStyles: function (item, entity) {
if (entity.state !== 'Home') {
return {
'opacity': 0.8,
'filter': 'grayscale()',
};
} else {
return {
'opacity': 1,
'filter': '',
};
}
}
I haven’t done a ton of CSS the last few years, so some of this is trial and error on my part, but let’s try making the property more specific:
.weather-list--secondary div {
width: 100px;
}There’s an open request on the GitHub repo for it. @resoai has indicated it’s not a priority for him, but anyone is free to code it and submit a PR. @lolorc indicated he was working on something upthread, but I’m not sure of the progress on it.
Tried both. Still no luck. I have tried each individually and all together. Currently I have it like this with no change.
.weather-list--secondary {
width: 100px;
}
.weather-list--secondary div {
width: 100px;
}
.weather-list-secondary {
line-height: 50px;
}@tman75 you will also have to fix it so the text wraps, try adding this:
white-space: normal !important;
the !important might not be needed
1 Like
Thanks!!! that was the ticket. When I put !important in the file it yelled at me, so I left it out. It is wrapping and looking great.
1 Like
My header contains time and date on the left corner and rest of top screen is items. Items on header hight are not clickable.
my configuration worked perfectly on a tablet with 1200x800 resolution. on the new tablet with 1920x1080 resolution everything looks huge.
original: (1200*800)
new: (1920*800)
I tried to reduce tilesize:
the tiles become smaller, but their contents remain enormous.
furthermore the HOME key cannot be clicked