Please post your config
Hi @resoai just wondering how the door entry tile works… is it activated by pressing that tile?
I was wondering if there is a way to have it activated via a state change of another component. For example, i have a raspberry pi zero with a camera on it that i am setting up as a door bell. I will use the GPIO inputs on it to attach a button which will be connected to HASS as a binary input. So when the door bell is pressed, the state change of the binary sensor will trigger the door entry tile to pop up for ‘x’ amount of seconds showing the camera??
It is activated by taping on the tile but old also have mine which popup up for 30 seconds when doorbell rings. We have implemented events which allows you to do pretty much anything now from opening door entries, activating different pages to showing toast notifications.
Oh this is great!! The speed that this is all developing at is amazing and all the things I have been wanting are coming to life with Tileboard. This was literally the last piece to the puzzle.
Is there any documentation on how to use events etc to achieve exactly what you’ve mentioned?
2 Likes
There are some examples of events and notifications in the README:
We’ve played around with various options and figured that the best and the most logical way would be to fire custom events directly from HA which can be used to do stuff withing the TileBoard. For instance, if you are using Fully Kiosk Browser and want to make it say something (TTS) you do the following to things:
- Define event withing TileBoard:
{
command: 'tts',
action: function(eventData) {
if (typeof fully !== undefined) {
fully.textToSpeech(eventData.text);
}
}
- Fire an event from HA:
- event: tileboard
event_data:
command: tts
text: "Attention! Rear gate is now opening"
For the door entry (which in fact is simply a fullscreen camera popup with a set of tiles you define, I have a Open gate, Toggle outdoor light and Toggle intercom tiles) you do the following:
- Define a tile in config as a variable:
var DOORENTRY_TILE = {
position: [0, 2],
type: TYPES.DOOR_ENTRY,
id: {},
icon: 'mdi-phone',
title: 'Door entry',
state: false,
layout: {
type: TYPES.CAMERA_THUMBNAIL,
id: 'camera.front_gate',
refresh: 1500,
bgSize: 'cover'
},
page: {},
tiles: [
// Define your tiles (door-entry buttons) here if required
]
}
};
- Define an event using that variable:
{
command: 'open_doorentry',
action: function(eventData) {
this.$scope.openDoorEntry(DOORENTRY_TILE, DOORENTRY_TILE.id);
}
},
3.Fire in the hall! Fire the HA event:
- event: tileboard
event_data:
command: open_doorentry
You can also optionally define doorEntryTimeout: 30 in config to automatically close the popup after 30 secs.
3 Likes
It’s possible to work with “input_datetime” somehow?
I want to be able to change the time from “TileBoard”, not just see the time that set through HA.
Thanks.
Tile Size Config:
customTheme: null, //CUSTOM_THEMES.TRANSPARENT
transition: TRANSITIONS.ANIMATED_GPU,
tileSize: 67,
tileMargin: 4,
Tile Config:
{
position: [0, 4],
width: 4,
height: 1,
id: 'input_number.google_volume',
type: TYPES.SLIDER,
title: '',
slider: {max: 10, min: 0, step: 0.5},
customStyles: {'background-color':'#667584'},
classes: [CLASS_MICRO],
filter: function (value) {return null},
},
This is way too small, it should work ok with 80.
This is great, thanks so much for posting. It is hurting my brain a little bit as i’m still only learning python let alone JS haha
Can you just explain one thing for me if you dont mind and i can try and work the rest out myself… To fire an event in HASS is that using automation triggers, for example
automation:
trigger:
platform: event
event_type: MY_CUSTOM_EVENT
and then from there i define the events in the tileboard config under
events: [],
Okay, I got it working by firing an event using a script just to test it all using some of the example events and it works great. Very excited!
Good! I was typing you a message right now 
1 Like
I’m using the following function in a state parameter in order to display brightness as a percentage. How do I implement it so that a percentage is also displayed for the slider of the light tile? Thanks.
switchPercents('brightness', 255, true)
{
position: [0, 2],
title: 'Floor lamp',
subtitle: 'Lounge',
id: 'light.lounge_floor_lamp',
type: TYPES.LIGHT,
states: STATE_MAPS.SWITCH_MAP,
icons: STATE_MAPS.LIGHT_ICONS,
state: switchPercents('brightness', 255, true),
sliders: [
{
title: 'Brightness',
field: 'brightness',
max: 255,
min: 0,
step: 5,
formatValue: function (conf) {
var value = parseFloat(conf.value);
if(isNaN(value)) return conf.value;
value = Math.round((value / conf.max * 100));
return value + '%';
},
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "brightness"
}
},
{
title: 'Color temp',
field: 'color_temp',
max: 588,
min: 153,
step: 15,
request: {
type: "call_service",
domain: "light",
service: "turn_on",
field: "color_temp"
}
}
]
},
1 Like
Great! Thanks.
And now I have the door_entry working after automating an event ie, when my front door opens(binary sensor) the door_entry tile pops. Sooo very cool thank you!
I did have one question. I’ve never really thought about using TTS but since im running fully on one of my tablets is there anything further I need to do to get it working other than what you have listed? I have the PLUS license, I create the event in HA and in the tileboard config but when I run it, nothing seems to happen. Am I missing anything?
I have only played with fully for about a day. I can assume that tablet needs to wake up to actually do that. You might try something like this:
{
command: 'tts',
action: function(eventData) {
if (typeof fully !== undefined) {
fully.stopScreensaver();
fully.bringToForeground();
fully.textToSpeech(eventData.text);
}
}
}
Yeah I tried pretty much that minus the waking up part cause I had the tablet awake already but didn’t seem to work. Thats okay, I’ll leave that for another time.
I seem to be having an issue with the door_entry opening when I fire the event in HA. I thought I had it working before but mustve got confused. I think the part im missing is defining the tile as a variable. It works fine in the tileboard when I press the tile but not when I fire the event. Do I literally do that in the location I would normally add that tile but adding var DOORENTRY_TILE = or do I add this somewhere else and refer the tile to that variable?
Sorry to be a pain with all the questions.
No, you define it outside (above) var CONFIG. You than simply use that variable instead of actual tile definition:
{
items: [
FRONT_GATE_TILE,
{
position: [0, 0],
type: TYPES.SCRIPT,
.........
}
Ahh I thought it might be that. Just updated it now and it works like a charm. Thank you so much
No problem! Would you mind showing off your current setup (screenshot)?