TileBoard - New dashboard for Homeassistant

slim0287 · August 24, 2020, 8:24am

@resoai
Apparently “ask and you shall receive;” the history tile showed up right after I asked for the functionality. On the main TileBoard github page, you probably should add HISTORY to the “At the moment following entity types have been implemented:” section.

@akloeckner
In TILE_EXAMPLES, you write “The variable MINIMAL_CHART_OPTIONS defines options for a minimal chart suited to be displayed in a tile.” I gather we can go “hog wild” modifying those options that we see in app.js to change the chart because you use chart.js?

akloeckner · August 24, 2020, 8:55am

You can change that variable. Or you can use angluar.merge( MINIMAL_CHART_OPTIONS , { ... your options taking prioritiy here }).

PS: Yes you can go wild with any option, Chart.JS will accept.

akloeckner · August 24, 2020, 8:58am

@resoai, I believe, we should get rid of that section and point to the TILE_EXAMPLES instead. Otherwise, we’ll have to update too many places. We already have two (README and TILE_EXAMPLES). Ideally, we would get rid of one of the two as well.

Will_Fezz · August 24, 2020, 4:11pm

I too have just found this (thank you all would have worked on this). Like @danmarotta5 I would like to know if it is possible to change the line colour?

moelito · August 24, 2020, 9:29pm

Nope… didn’t find anything to solve it.

Will_Fezz · August 25, 2020, 1:09pm

@danmarotta5 I think I have found a nice way to change the line colour.

In your main.js line 1587 below:

data.forEach(function (states) {

add

var borderColor = $scope.itemField(‘color’, config, entity);

in your config.js on your history tile add:

color: ‘rgba(xxx, xxx, xxx ,1 )’,

there might be a cleaner way of doing this but it seemed to work.

Will_Fezz · August 25, 2020, 1:21pm

I missed:

main.js

line 1650:

           datasetOverride.push({
              label: seriesUnit ? (seriesName + ' / ' + seriesUnit) : seriesName,
              yAxisID: yAxisId
           });

Add:

borderColor

slim0287 · August 25, 2020, 1:37pm

@akloeckner Thanks, the History tile works great for my Air Quality sensor purposes. It turned out quite nicely.

tman75 · August 25, 2020, 6:31pm

same issue as before. After awhile the camera image becomes a solid blue rectangle.

danmarotta5 · August 25, 2020, 6:56pm

to change yaxis font color

copy DEFAULT_CHART_OPTIONS variable to your config.js and rename MY_CHART_OPTIONS
add “fontColor: ‘yellow’”, after ticks in yAxes
reference new var in TYPES.HISTORY options: MY_CHART_OPTIONS

boutXIII · August 28, 2020, 1:45pm

Hello Dudu, Could you share your tileborard configuration (weather management) with the dynamic background? Thank you

grui · August 29, 2020, 9:08pm

Hello,

I am looking for help about the climate type card.
I can’t figure out how to start or stop air conditioner from this card with my current config. I can only increase or lower the air conditioner temperature :

in config.js :

   position: [0, 2],
               id: "climate.climatisation_appartement",
               customStyles: {'fontSize': '15px', 'background-color': 'purple'},
               type: TYPES.CLIMATE,
               unit: 'C',
               useHvacMode: false,  // Optional: enables HVAC mode (by default uses PRESET mode)
               state: 'Actuelle :' + '&sensor.salon_temperature.state' + '°C',

in configuration.yaml

climate:
  - platform: smartir
     name: Climatisation Appartement
     unique_id: appartment_ac
     device_code: 1260
     controller_data: 192.168.1.76
     temperature_sensor: sensor.salon_temperature
     humidity_sensor: sensor.salon_humidity
     power_sensor: binary_sensor.ac_power

screenshot from tileboard :

screenshot from homeassistant where all is working fine :

Do you know why I don’t have the ability to stop of start the air conditioner from this tileboard card (something I can do with the homeassistant card)?

Thank you

EDIT : OK, I found how to change the air conditioner mode. I have to click under the target temperature. I think there is a label missing where I have to click because I click on an empty space

Do you know how to display correctly the missing label (I think it should display the current air conditioner mode) ?

Here the air conditioner entity details :

NightShaman · August 29, 2020, 10:35pm

Hoping someone can help, I have searched this thread but it’s a pretty lard thread. I am using the Vertical menu, I notice each page I scroll down the tiles shift down as well, a little more with each page.

wheindl · August 30, 2020, 2:58pm

I’m new to Home Assistant, migrating from SmartThings due to some concerns with the state of its future. So far, so good; but even with a lot of experience with WebCore it’s been quite a learning curve.

While Lovelace has some neat tricks, this looks a lot like Action Tiles, which was my go-to dashboard for SmartThings. I’m very intrigued; but hoping for a more user-friendly (i.e. not a coding whiz) front end for this. This shows a very great deal of promise.

khouse75 · August 31, 2020, 12:24am

Your thermostat is like mine where the state of the climate device is what needs to be used to display the status. The tileboard code uses one of the attributes. I had to modify the code. I think it was main.js but I’m away from my system at the moment. I’ll post more info when I get back.

UPDATE:

At line 1317, I changed entity.attributes.hvac_action to entity.state

I couldn’t find a way in HA to add a custom attribute to climate and set it to state. If that’s possible, all you would need to do is add a custom attribute of hvac_action and set the value to state. If anyone knows a way to do this in HA, please chime in.

    $scope.getClimateCurrentOption = function (item, entity) {
       //return item.useHvacMode ? entity.attributes.hvac_action : entity.attributes.preset_mode;
       return item.useHvacMode ? entity.state : entity.attributes.preset_mode; 
    };

grui · September 1, 2020, 9:54am

Thanks @khouse75, it has fixed my issue !

resoai · September 1, 2020, 10:47am

Please open an issue on GitHub describing the behaviour.

UBT · September 1, 2020, 1:28pm

Hey guys. I just started using tileboard with fully kiosk a few days ago. I’m having trouble getting it to work right after screen is turned on.
I’ve been searching for answers and up until now no success, so let me as here.

I set fully kiosk to enter screensaver after 30 seconds and after 1m it turns off screen.
But when I turn the screen on again the tile board is not functional for a few seconds.
The screen turns on, the tiles disappears then appears again.
It shows a message on the bottom right corner saying “Ping unsuccessful” for a moment. Then it disappears and shows a “Reconnection” message. And just then I can use the buttons.

I have ping option set to true on the config file.

Any ideas? Does tileboard support turning the screen on/off besides screensaver?

khouse75 · September 1, 2020, 6:19pm

Check that battery optimization is off and allow background activity is on for fully kiosk app. That’s my best guess.

UBT · September 1, 2020, 9:25pm

Thanks for the hint. I tried that but no luck.

I realized that if I reload the page from the fully kiosk remote admin the delay upon turning the screen on is smaller. The tileboard buttons just blink for a second and they are back.
But I would like to be imediately responsive, just like when returning from screensaver.

I know this thread is for TileBoard, not Fully Kiosk Browser, but I don’t think the problem is on FKB. When I use lovelace instead of tileboard it seems to be working ok. I guess it has something to do on how tileboard works.

If anyone has any ideas…