You can use an IFRAME tile to display any remote content.
Great. Thanks. To anyone interested:
{
position: [0, 0],
type: TYPES.IFRAME,
id: {},
width: 4,
height: 3,
refresh: 3600000, // 1h
url: 'https://embed.windy.com/embed2.html?lat=33.013&lon=-79.893&zoom=7&level=surface&overlay=wind&menu=&message=&marker=&calendar=&pressure=&type=map&location=coordinates&detail=&detailLat=33.013&detailLon=-79.893&metricWind=default&metricTemp=default&radarRange=-1%22%20frameborder=%220%22'
},
You can change it to clouds, rain, etc…
Now, I will try to use it as a screensaver.
1 Like
It would be nice to be able to replace the generic map: with it.
Too sad - I have my own OAuth2 Auth in front of HASS as I want to log in using Google 2FA. It was working better with stored password. Anyway, there are plans to add support for tokens instead of legacy api password, will you be supporting them as well?
Anyway, I want to say - good job, the project looks really good. Did you consider updating tech stack to new Angular or React, throwing in build tooling (minified sources) and support for Progressive Web App? Your project looks so much better than lovelace, it might be a valid alternative to the UI embedded in HASS.
New authentication actually allows you to have two factor auth. To be frank I simply had to do it. A lot of people simply don’t read the manual, type the password in plain text and share the config openly on github along with the duckdns address.
I’m eagerly waiting for tokens for apps as I have a lot of devices which update HA via the API. I never thought of sharing the code on github initially as TileBoard was created for internal use 
I tried to change date in the header to a my own language, but couldn’t get it to work.
I created a sensor template with the date.
When commenting “dateFormat: ‘EEEE, LLLL dd’,” the english date also does not disappear.
How can I change the english date by my “sensor.date” keeping the clock?
Thanks.
Thank you. Why with Node Red and not a simple web?
I have a couple of 7" 1024x600 tablets hanging on the wall for Home Assistant and a PC with a touch screens (1920*1080).
Ideally I would like optimize the tileboard or both screen sizes. What would be the best approach to do this?
It all depends how many tiles you want to see there and how big or small you are happy to make them. This is all very personal so you just need to play around with sizes, groups, margins to see what works best for you.
Some people want to see more information from the distance but have bad eyesight, so they need bigger tiles, others just want to cramp as many tiles as possible.
Thanks - From a technical perspective - how to I get 2 versions of the Dashboard. Create a copy for config.js for each version?
that’s what worried about. I know nothing about Java coding
Java !== JavaScript
Hi there,
Is there a way for a tile to turn an automation on or off? I can obviously trigger an automation - but I want a tile to toggle the automation on/off whilst displaying it’s status.
Any ideas?
Yes, just define it as a SWITCH tile.
1 Like
Doh! Thanks for that - I was making it way overcomplicated lol
My weather icons are not showing up in the tile, yet the files are there. Also, when I click on a camera to bring up the full screen, the image flashes on and off.
- How did you define weather tile?
- How did you define camera tile?
Weather:
position: [0, 0],
width: 2,
height: 2,
type: TYPES.WEATHER,
id: {}, // using empty object for an unknown id
state: '&sensor.dark_sky_summary.state', // disable state element
iconImage: '&sensor.dark_sky_icon.state',
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'
},
fields: { // most of that fields are optional
summary: '&sensor.dark_sky_summary.state',
temperature: '&sensor.dark_sky_temperature.state',
temperatureUnit: '&sensor.dark_sky_temperature.attributes.unit_of_measurement',
windSpeed: '&sensor.dark_sky_wind_speed.state',
windSpeedUnit: '&sensor.dark_sky_wind_speed.attributes.unit_of_measurement',
humidity: '&sensor.dark_sky_humidity.state',
humidityUnit: '&sensor.dark_sky_humidity.attributes.unit_of_measurement',
list: [
// custom line
'Feels like '
+ '&sensor.dark_sky_apparent_temperature.state'
+ '&sensor.dark_sky_apparent_temperature.attributes.unit_of_measurement',
// another custom line
'Humidity '
+ '&sensor.dark_sky_humidity.state'
+ '&sensor.dark_sky_humidity.attributes.unit_of_measurement',
// yet another custom line
' Chance of rain '
+ '&sensor.dark_sky_precip_probability.state'
+ '&sensor.dark_sky_precip_probability.attributes.unit_of_measurement'
]
}
},
and Camera
position: [0, 0],
id: 'camera.front_door',
type: TYPES.CAMERA_THUMBNAIL,
bgSize: 'cover',
width: 2,
state: false,
fullscreen: {
type: TYPES.CAMERA,
refresh: 1500, // can be number in milliseconds
bgSize: 'contain'
},
refresh: function () { // can also be a function
return 3000 + Math.random() * 1000
}
},Why did you uncomment following line?
//iconImage: '&sensor.dark_sky_icon.state', // use this one if you want to replace icon with image
It is either icons or iconImage which overrides icons.
Camera image can flicker in Firefox which is something we can’t control. It appears to be working fine in Chome and other Webkit browsers.
I must have misunderstood about the iconimage. I’ll put it back. As for the camera, I am using Chrome. Don’t even have FireFox installed.
edit: So, I commented iconimage back out but I still get nothing. Exactly where should the .svg files go? Currently they are in www/tileboard/images/weather-icons/white AND www/tileboard/images/weather-icons/black. I have tried moving them up 1 and 2 directory levels. But they do not appear regardless.