You can define a camera tile as a variable and open if via CUSTOM tile like this:
action: function() {
this.$scope.openCamera(yourCameraVar, yourCameraVar.id);
}
1 Like
I believe this should do it:
action: function(item, entity) {
this.$scope.openPopupHistory(item, entity);
}
I presently only have access via mobile phone so I’m typing from memory.
1 Like
Thank you so much. I will give it a try…
CAMERAS: {
position: [0, 2],
width: 2,
height: 1,
title: 'Kameras',
id: {},
type: TYPES.CUSTOM,
state: false,
action: function() {
this.$scope.openCamera(GROUP1.POPUP_CAMERA, GROUP1.POPUP_CAMERA.id);
}
},
POPUP_CAMERA: {
position: [0, 2],
width: 2,
height: 1,
title: 'Kameras',
id: {},
type: TYPES.CAMERA,
state: false,
bgSize: 'cover',
refresh: function () { // can also be a function
return 3000 + Math.random() * 1000
},
filter: function (item, entity) {
return 'http://homeassistant.fritz.box:8801';
},
fullscreen: {
type: TYPES.CAMERA,
objFit: 'contain',
id: 'camera.wohnzimmer',
refresh: 1500
}
},
The popup shows up but is empty.
can this function be used to show the attributes value? like for weather, right now history show last states… cloudy, sunny… i will be nice to show the latest temps recorder by attribute temperature.
@resoai how can we hide a row from TEXT_LIST? i whant to show a row whit some values only if the state is on for a sensor.
hidden:true is not working on only one element from this list.
regards
I’m presently traveling and can’t respond to every message, you can form the list dynamically, a bit like I’ve shown a few days in this post:
1 Like
Hi all, I love Tileboard so far and have been able to scrap together the start of a dashboard used to control lights. I’m confident I can also get scenes to work which is next. I’d also like full ecobee thermostat control (currently, it only displays current status, no ability to change the temp or mode). I’d also love to bring in a few vid feeds. I have wyze cams setup in motionEYE. Anyways, I’m not good at JS, and was curious if someone had a full dashboard with these types of devices, that I could just copy and paste and change the entities to my own??? Any help would be great!
There is probably a better way to do this but I couldn’t figure it out. So for now what I did was update index.html for the TEXT_LIST to only show items that do not have the ‘off’ state.
The html for the TEXT_LIST has a line for ng-repeat. Currently is set to this:
ng-repeat="line in item.list track by $index">
If you update this line you can have it check the ‘value’ of the list item using ng-if. In my case, I don’t want to show if the value is off. So I changed it to this:
ng-repeat="line in item.list track by $index" ng-if="listField('value', item, line) !== 'off'">
What this should do if I understand correctly is loop through the list, but only render the html for list items that don’t have a value of off. This will break lists where you want to show items with the state of off, so to work around that, you can have your value function return something like ‘!hideme’ and instead of checking for ‘off’ check for ‘!hideme’.
Example:
list: (function() {
l = [];
for (i = 1; i < 4; i++) {
l.push({
title: 'Title ' + i,
icon: 'mdi-school',
value: function () {
let currentState = this.states['sensor.bedroom_light'].state;
if (currentState === 'off') {
return '!hideme';
}
return currentState;
}
});
}
return l;
})(),
index.html (original)
<div ng-if="item.type === TYPES.TEXT_LIST"
class="item-entity-container">
<div class="item-list">
<div class="item-list--item"
ng-repeat="line in item.list track by $index">
<div class="item-list--name">
<i class="mdi" ng-class="listField('icon', item, line)" ng-if="line.icon"></i>
<span ng-bind="listField('title', item, line)"></span>
</div>
<div class="item-list--value">
<span ng-bind="listField('value', item, line)"></span><!--
--><span ng-bind="listField('unit', item, line)"></span>
</div>
</div>
</div>
</div>
index.html (modified)
<div ng-if="item.type === TYPES.TEXT_LIST"
class="item-entity-container">
<div class="item-list">
<div class="item-list--item"
ng-repeat="line in item.list track by $index" ng-if="listField('value', item, line) !== 'off'">
<div class="item-list--name">
<i class="mdi" ng-class="listField('icon', item, line)" ng-if="line.icon"></i>
<span ng-bind="listField('title', item, line)"></span>
</div>
<div class="item-list--value">
<span ng-bind="listField('value', item, line)"></span><!--
--><span ng-bind="listField('unit', item, line)"></span>
</div>
</div>
</div>
</div>
On device tracker tile is there a way to display large map when clicked? Interactively if possible?
Edit: Nevermind, i used action function to dynamically insert your popup_iframe html code with google maps direction iframe, used from location lat/long as users current location and to location from zone.home lat/long. Now when you click device tracker tile it opens google maps directions iframe in a popup which shows users current location, directions to home and travel time… Just what i wanted…
thanks for replay man but is not what i need.
my simple need is to show only if the status is on. i don’t want to make changes to html.
the request i think is not that difficult. if one light is on, in that box it will show the number of lights are on, if one or two temp i above a limit, the warning will be in that text box… and so on…
the code i try is this:
list: (function() {
l = [];
// this.parseFieldValue throw errors
entities = this.parseFieldValue('&group.light.attributes.entity_id', item, entity).split(',');
var count = 0;
for (var i in entities){
//// again this line cant be used
if (this.parseFieldValue('&' + entities[i] + '.state', item, entity) == 'on') count++;
}
if(count){
l.push({
title: 'Lights: ',
icon: 'mdi-school',
value: count+' lights are on '
});
}
})(),
but i cant get the sensor status in order to push in to the list the values i need to show.
i dont know the right javascript code to get the status of entity in that loop. right now it give errors.
please advice @resoai
tileboard not pharse attributes from json type.
my code:
title: 'Recently added on PLEX',
id: 'sensor.plex_recently_added',
type: TYPES.TEXT_LIST,
state: false,
list: [
{
type: TYPES.SENSOR,
id: 'sensor.plex_recently_added',
title: function(item, entity) { return entity.attributes.data[1].title; },
icon: function(item, entity) { return entity.attributes.data[1].icon; },
value: function(item, entity) {return entity.attributes.data[1].airdate;},
},
attributes:
data:
- title_default: $title
line1_default: $episode
line2_default: $release
line3_default: $number - $rating - $runtime
line4_default: $genres
icon: 'mdi:eye-off'
- airdate: '2020-08-10T19:51:17Z'
aired: '2019-02-15'
release: '$day, $date $time'
flag: false
title: The Umbrella Academy
......
just empty rows.
in a simple tile it works, but not in TYPE.TEXT_LIST
problem reported here TileBoard - New dashboard for Homeassistant but with no solution.
Your entities variable should be an array of entities, this.parseFieldValue accepts only one parameter.
You can not put SENSOR tile into TEXT_LIST tile.
can i use a workaroud?
Dear @resoai , please be kindly and point me in the right direction… how to get the state of an entity in this function:
height: 0.6,
title: false,
type: TYPES.TEXT_LIST,
id: {},
state: false, // disable state element
list: (function() {
l = [];
.....
i have try this twho lines and i get errors…
if (this.parseFieldValue('&light.light_2.state') == "on") alert('da');
//or
if(this.states["light.light_2"].state == 'on') alert('da');
i just dont know how to get the state inside of list: function…
No, parsing a group does not give you list of entities. this.parseFieldValue accepts one parameter only.
You are n to providing the full code and not saying which error your getting.
here is the full code:
type: TYPES.TEXT_LIST,
id: {},
state: false, // disable state element
list: (function() {
l = [];
var count = 0;
if(this.states["light.light_2"].state == 'on') count++;
if(!count){
l.push({
title: 'Lights: ',
icon: 'mdi-school',
value: count+' lights are on '
});
}
})(),
the error is the generic one wrote by you: “Please meke sure you have…”
You need to open browser console to see what actual JS error says. However this will now work inside (function(){ … }); Make a function outside config that will return the list you need and assign it to list like this:
list: myFunction()
I’m traveling and only have access via my iPhone so I can’t really help with any code at the moment.
@resoai, thanks so much for all your help. I hope you had a good vacation.
So this seems to have fixed a few bugs. Tileboard now doesn’t crash that often on my iPad gen3 using kiosk pro. So thank you!
However, and this is weird, it seems like my image only refreshes every hour. So let’s say I start at at 12:15. It will continue showing my every second of my cam until about 12:20 (5 minutes). Then it will stay on that image until 1:15, and show me another 5 minutes, and stay on the last image from 1:20 until 2:15, and so on. Any ideas?
Thanks