TileBoard - New dashboard for Homeassistant

Share your Projects! Dashboards & Frontend
3757

Got it

Updated the .yaml file and alls good.

Example configuration.yaml entry

sensor:

  • platform: time_date
    display_options:
    • ‘time’
    • ‘date’
    • ‘date_time’
    • ‘date_time_utc’
    • ‘date_time_iso’
    • ‘time_date’
    • ‘time_utc’
    • ‘beat’
3758

Is it possible to enable/disable an automation tile?
I want to keep it in the UI but without being able to activate it sometime based on different conditions.

1 Like
3759

If you really want to use images as background for the tile you can simply resize them and if I’m not mistaken you can play with bgSize: https://www.w3schools.com/cssref/css3_pr_background-size.asp

3760

I think there was a bug in previous versions which was fixed: https://github.com/resoai/TileBoard/pull/551

3761

Hey, quick question. Seems the gauge sensor rounds the central value with a decimal even tho. the fractionSize setting is set to 0 and the value in the top corner shows watts. Can this behavior be disabled via settings? I would prefer it to show watts and not kilowatts if possible without code modification.

Skärmavbild 2021-01-04 kl. 15.58.31

3762

This is not rounding, it’s the thousands separator. Maybe in your country, the comma is not used as a thousand separator and that’s why it confuses you. Which is fair but currently TileBoard runs in US locale only.

3763

could I just bump this a I am really struggling to find the answer?

3764

Maybe something like this in custom.css:

.item.-th-history {
    background-color: rgb(130, 156, 108);
}
3765

You can define a custom action for the automation tile:

action: function(item, entity) {
   if (false/* can not run */) {
      return
   }
   this.$scope.triggerAutomation(item, entity)
},
3766

Thanks, I’ll look into it
Ideally, I would have like the tile to be “disabled”, kind of like the arrows on the cover tile are handled
But thanks for the reply, that’s a great alternative

3767

Thanks, for the reply. My original post was unclear I meant the history tile line not the background.

3768

I’m also looking for a way to do this. Did you found a solution for this?

3769

You can define the timeout for closing popup like so: this.$scope.popupTimeout = 10; and also close popup by calling this.$scope.closePopup();

1 Like
3770

dear @resoai and @rchl , i need to make a gauge that have dynamic thresholds but i can manage to get the sensor state in to thresholds key.

{
							position: [5.35, 0],
							width: 1.9,
							height: 2.2,
							type: TYPES.GAUGE,
							id: "sensor.clima_1_temperature",
							settings: {
								size: 270,
								type: "arch",
								min: 0,
								max: 45,
								cap: "butt",
								thick: 3,
								append: "°C",
								labelOnly: false,
								thresholds: {
									0: {
										color: "green"
									},
									[xxxxx+5]: {
										color: "orange"
									},
									40: {
										color: "red"
									},
								},
								fractionSize: 1,
							},
						},

What i need is instead of xxxxx to get the sensor state.
this.parseFieldValue("&sensor.wanted_temp.state") will not give the sensor value.
i can replace xxxx with a function, but again, i dont know how to get the sensor value in that function and where to put that function.

Please give me some hints to make this work.

3771

Not getting into details, you probably need to convert this.parseFieldValue("&sensor.wanted_temp.state") to integer.

3772

i dont know how or where to convert it,
if i put :

thresholds: {
									0: {
										color: "green"
									},
									[Number(this.parseFieldValue("&sensor.wanted_temp.state"))-5]: {
										color: "orange"
									},
									40: {
										color: "red"
									},

i get error:
Uncaught TypeError: undefined is not a function

please please get into few details…

3773

Thanks @resoai, but how do you use that when using TYPES.POPUP? :thinking:

1 Like
3774

The thresholds needs to be a function.
Also, due to how AngularJS works, the computed return value needs to be cached or it will go into an infinite loop.
Something like this maybe (not tried so you might need tweak a bit):

         settings: {
            // ...
            thresholds: function(item, entity) {
               const wantedTemp = this.states['sensor.wanted_temp']

               if (!item._cached_thresholds) {
                  item._cached_thresholds = {
                     0: { color: 'green' },
                     [wantedTemp + 5]: { color: 'orange' },
                     40: { color: 'red' }
                  }
               }

               return item._cached_thresholds
            }
         },
1 Like
3775

Thank you very much @rchl, that is the solution. I did not know how to put the array in to cache so that it will not be readed by angluar as new array every time. Thank you again

3776

once more, i need youre knowledge @rchl, . the gauge will not chage the colors if the reference value, wanted_temp, is changed.

how cand i use detectChanges() of angular in a tile as action or any function that will reset the chacked function?