TileBoard - New dashboard for Homeassistant

Share your Projects! Dashboards & Frontend
3231

Just an fyi for anyone else trying to do the same. I was able to fix my function call to change the background color of the tile based on value. My first attempts I was not sending the entire line required in the return statement. Background: My goal was to set a bright color background if the slider had a value greater than 1 and dim the color if 0. This is the working code:

                        customStyles:  function (item, entity) {
                            if (entity.state >= 1) {
                                return {
									'backgroundColor' : '#0080ff',
									};
                            } else {
                                return {
									'backgroundColor' : '#003366',
									};
                            }
							},
2 Likes
3232

Hey guys I’ve been using TileBoard for sometime now and its awesome. I fixed the climate tile to show the hvac_modes and I made an on/off tile (switch) right by the climate tile.Now my question is is it possible to have attributes on that on/off tile so I can set the speed of the fan? Tried the fan tile its not working
here is my Tile Board

dash
dash1341×837 238 KB

3233

I think I’ve fixed hvac_mode in yesterday’s update. You would need to add useHvacMode: true to your climate tiles. I’m afraid I don’t fully understand your question about attributes. What exactly are you trying to do? Also, what exactly isn’t working in a fan tile?

3234

Hi guys,

I have just pushed a few updates to TileBoard dressing following issues:

  1. CAMERA tile was throwing 401 error after a few mins when access token of camera changed.
  2. CAMERA_STREAM tile did not close the stream whenever switching to different camera to another page
  3. Added hideFromList: true attribute to CAMERA, CAMERA_THUMBNAIL and CAMERA_STREAM tiles which allows you to hide particular camera from the list in the fullscreen popup.

Just a reminder, HA has deprecated camera_thumbnail API call so you should switch to CAMERA.

3235

What’s the trick to get the climate tile to show the current mode? I grabbed the latest code from github, added useHvacMode: true but nothing is displayed. I can click near the middle and change the mode, however.

image
image

1 Like
3236

Has anyone implemented a weather tile using WeatherBit to replace DarkSky? I am a couple days in with Tileboard and i have learned a lot. I just can not figure out how to use the WeatherBit HA integration with TileBoard. I know this is 100% due to my lack of js skills. The available entities are listed below if that helps. Any help/advice is greatly appreciated.

sensor.weatherbit_air_quality
sensor.weatherbit_apparent_temperature
sensor.weatherbit_beaufort_text
sensor.weatherbit_cloud_coverage
sensor.weatherbit__description
sensor.weatherbit_ddewpoint
sensor.weatherbit_forecast_day_1
sensor.weatherbit_forecast_day_2
sensor.weatherbit_forecast_day_3
sensor.weatherbit_forecast_day_4
sensor.weatherbit_forecast_day_5
sensor.weatherbit_forecast_day_6
sensor.weatherbit_forecast_day_7
sensor.weatherbit_humidity
sensor.weatherbit_icon_code
sensor.weatherbit_“city”
sensor.weatherbit_pressure
sensor.weatherbit_rain_today
sensor.weatherbit_snow
sensor.weatherbit_radiation
temperatureUnituv_index
sensor.weatherbit_visibility
sensor.weatherbit_wind_bearing
sensor.weatherbit_wind_direction
sensor.weatherbit_wind_speed

3237

Can you show me state dump for this entity from HA? TileBoard currently looks at hvac_modes for the list of modes and hvac_mode for current mode. It does same for presets: preset_modes -> preset_mode.

3238

The actual state of my climate.family_room_thermostat is the current mode.

image
image695×347 24.2 KB

3239

I can probably create a sensor with template_attributes: and an automation to match what’s required of the climate tile.

3240

For some reason your thermostat has hvac_modes but not hvac_mode, yet it has hvac_action, which in turn is not a value from the hvac_modes list :anguished:.

Can you please show me how thermostat UI is shown in HA (with selection open and closed)?

3241

Here are some screenshots. It’s a Radio Thermostat CT101 (Lowe’s Iris Branded)

image
image365×569 17.8 KB

image
image363×571 15.5 KB

image

3242

Please open main.js file in scripts->controllers directory, scroll down to line 1316 and replace the whole getClimateCurrentOption function with this:

   $scope.getClimateCurrentOption = function (item, entity) {
      if(item.useHvacMode) {
         ['hvac_mode', 'hvac_action'].forEach(function(attr){
            if(entity.attributes[attr]) return entity.attributes[attr];
         });
      }
      else {
         if (entity.attributes.preset_mode) return entity.attributes.preset_mode;
      }
      return 'Unknown';
   };

If it works I’ll push this as an update.

3243

@resoai please look at TileBoard - New dashboard for Homeassistant again. The current mode is exposed as entity.state - you can see the current hvac mode on the right of entity name.

3244

Indeed. I’m not really sure than how to handle this, since the state can be anything, including on/off.

3245

I don’t have any experience with thermostats but how I understand “hvac_action” is that it’s the current action that is progress. If you set mode to “heat”, the action will be probably “heating” but once it gets to the desired temperature the action might change to “idle” or something while mode will still mode “heat”.

3246

Makes sense. I wonder how state would change in this case and how HA maps values in the UI for such a thermostat.

3247

In my case, entity.state is going to be whatever I’ve selected from hvac_modes ( heat, cool, off or heat_cool ). hvac_action is going to be cooling, heating or idle.

No need to change any code. About the only time I change the mode is winter and late spring and I usually do that at the thermostat.

3248

My question is is there any way to control fan_modes or to put fan_modes on a separate tile?
fan_modes

3249

You could modify the index.html and main.js like in this post TileBoard - New dashboard for Homeassistant or if you don’t want to modify the application code, you could use input_select and some automations.

3250

I’m playing around with a function that returns an animated or stationary image for the background based on whether a fan is on or not.

If I use entity.state for comparison, it changes the background images as soon as I change the fan mode. This won’t work with the input_select because I need to base the background image on the state or attribute of another entity and input_select has no attributes that can be set.

entity.state code:

{
   position: [2, 1],
   type: TYPES.INPUT_SELECT,
   id: 'input_select.family_room_thermostat_fan_mode',
   title: 'Family Room',
   bg: function (item, entity) {
       return (entity.state == 'Auto Low' ? '/tileboard/images/fan5_off.gif' : '/tileboard/images/fan5_on.gif');
   },
   state: function (item, entity) {
       return (this.states['climate.family_room_thermostat'].attributes.fan_action);
   },
},

If I use this.states, the background image never changes unless I refresh the page. The state function, which uses the same this.states[‘climate.family_room_thermostat’].attributes.fan_action, updates properly when the fan mode is changed and the fan turns off or on (Idle or Running).

this.states code:

{
   position: [2, 1],
   type: TYPES.INPUT_SELECT,
   id: 'input_select.family_room_thermostat_fan_mode',
   title: 'Family Room',
   bg: function (item, entity) {
       return (this.states['climate.family_room_thermostat'].attributes.fan_action == 'Idle' ? '/tileboard/images/fan5_off.gif' : '/tileboard/images/fan5_on.gif');
   },
   state: function (item, entity) {
       return (this.states['climate.family_room_thermostat'].attributes.fan_action);
   },
},

Any ideas as to what the problem may be or any suggestions for alternate ways to accomplish this?