Hi @giovanni, I have 3 cards that only appear the evening before I have to place the garbage outside. By using the customStyles attribute their styles are updated based on a timestamp. One of the cards is shown below. The other two cards have the same position but different ids. Hope this helps!
{
position: [1,2],
width: 1,
id: 'sensor.rova_paper',
state: false,
title: 'Paper',
subtitle: 'Rova',
type: TYPES.SENSOR_ICON,
icon: 'mdi-recycle',
customStyles: function(item, entity) {
var date = Date.parse(entity.state);
var start = date - 3600000 * 12;
var stop = date + 3600000 * 12;
var now = Date.now();
if(!date || isNaN(date) || start > now || now > stop) {
return {
'opacity': '0%',
'display': 'none'
}
} else {
return {
'background-color': '#3498DB',
'opacity': '100%',
'display': 'inline'
}
}
}
}
Would it be possible to have a full screen flashing alert popup when the alarm is triggered, or even arming? Has anyone done anything like this?
I guess I could create a new page and flick to it everytime that happens if not.
Good day. I have just installed tileboard and I love it. I am trying to get an exit countdown timer working for my alarm system. I see this topic brought up earlier but I do not see a fix. Does anyone know how to configure a simple timer I can activate when the alarm is setting? I am running into the same issue as below:
a small step forward, now I see the remaining time but not the countdown. example for a 1 minute countdown, idle state = 0:00:00. when I turn on the timer I see: 0:01:00, but not the countdown
@devastar
Did you manage to work this out as I have the same issue.
The iframe I am bringing in is larger and therefore the scroll bars show up. Notice you are in Auckland. I am in Wellington
@resoai Hi there. I have been trying for hours and hours now to get the Weather on your Page to show the same. How to you get it like that please?
It is awesome and simple
@apop. I am still very new to TileBoard and loving the setup so far. I have a HADashboard at present and this is much more cleaner
I have read lots about Custom.CSS.
What is this and where or how do I add it to my Tileboard please?
I am not a programmer I am learning as I go from other peoples examples.
Thanks in advance
Bruce
Very nice project. I’m using it with a Google Home Hub. Works really well. I have modded the CSS a bit. See screenshot below. If there is interest I can clean up the CSS and share it.
Can you open a camera feed directly using events? I can now go to my general camera page in Tileboard, but that just gives me the thumbnails. When clicking on such a thumbnail I get a big pop up with all camera’s names shown in a left hand column, and the chosen camera video in the right pane. Is it possible to use events to navigate directly to one of these camera views?
I am now using the code below to go to a Tileboard page:
* Example: Open a specific TileBoard page
* Include a page field in the event_data from Home Assistant
* that matches the id: of a page in the TileBoard CONFIG
*/
{
command: 'open_page',
action: function(e) {
window.openPage(CONFIG.pages[e.page]);
}
}
Hi there @tman75
Could I please ask if there was any changes you had to do too the Default Weather_List tile? I have not been able to get this to work like everyone else seems to work.
I hope someone can point out what I am missing. I have copied the Example Code for weather_list tile and inserted into a page. This is what is happening with the tile?
Hey @resoai
Thanks for your quick reply. You were correct I did not have the sensor.dark_sky hi and low and forecast added in HA Dark Sky. I added them however sadly it did not work.
I must still be missed something. Here is the TILE CODE
{
position: [4, 2],
type: TYPES.WEATHER_LIST,
width: 5,
height: 3,
title: 'Forecast',
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: 'Wind',
list: [1,2,3,4,5].map(function (id) {
var forecast = "&sensor.dark_sky_overnight_low_temperature_" + id + ".state - ";
forecast += "&sensor.dark_sky_daytime_high_temperature_" + id + ".state";
forecast += "&sensor.dark_sky_daytime_high_temperature_" + id + ".attributes.unit_of_measurement";
var wind = "&sensor.dark_sky_wind_speed_" + id + ".state";
wind += " &sensor.dark_sky_wind_speed_" + id + ".attributes.unit_of_measurement";
return {
date: function () {
var d = new Date(Date.now() + id * 24 * 60 * 60 * 1000);
return d.toString().split(' ').slice(1, 3).join(' ');
},
icon: "&sensor.dark_sky_icon_" + id + ".state",
//iconImage: null, replace icon with image
primary: forecast,
secondary: wind
}
})
}
