Get sensor in javascript

Third party integrations HADashboard
1

Hi,

I wan’t to know if it’s possible to get sensor information in javascript function (in head_includes from skin/variables.yaml).
Actually, I can change skin with a custom widget containing an input_select and a javascript command wich modify args on http adress.

Now, I want a head javascript can check if my input_select is in “auto mode skin” and if sun is down or up to load the good skin

I tried to add jinja code :

- "{{ states.input_select.skin_list.state }}"
 - "{{ input_select.skin_list }}"

But jinja doesn’t load information and if I remove quotes I have an error :

2018-07-26 10:53:24.412827 WARNING Error loading CSS variables
2018-07-26 10:53:24.413664 WARNING parser says
2018-07-26 10:53:24.414649 WARNING   in "<unicode string>", line 15, column 5:
     - {{ states.input_select.skin_list. ...
        ^
2018-07-26 10:53:24.415364 WARNING found unhashable key while constructing a mapping

Any idea ?

2

i dont think that the entities are available like that.
but i think it is possible to read out the html element containing the input_select.

3

Thank you for the answer but I don’t want to have my input_select loaded in all my dashboards

Finally i tried a other solution Home Assistant API :

 <script>
    
        var request = new XMLHttpRequest(); request.open('GET', document.location.origin + '/api/states/input_select.skin_list', true); 
    
        request.onload = function () {
    
          var data = JSON.parse(this.response);
    
          if (request.status >= 200 && request.status < 400) {
    
            console.log(data);console.log(data.state);
    
          } else { console.log('error'); }
    
        }
    
         request.send();
    
        </script>
4

thats an option too that i didnt think about.
did it work as you expected?

5

Yesss It work very well, here is my javascript in html head checking evrey 10 minutes if skin might be changed :slight_smile:

- "<script>"
 - "const day_skin = 'light';"
 - "const night_skin = 'dark';"
 - "const skin_list = 'input_select.skin_list';"
 - "function searchParam(key){"
 - "  key = encodeURI(key);  var kvp = document.location.search.substr(1).split('&');  var i=kvp.length;  var x;"
 - "  while(i--){"
 - "      x = kvp[i].split('=');"
 - "      if (x[0]==key){"
 - "          return x[1];break;"
 - "      }"
 - "  }"
 - "  return '';"
 - "}"
 - "function get_state(entity){"
 - "  var request = new XMLHttpRequest(); request.open('GET', document.location.origin + '/api/states/' + entity, false);var ret;"
 - "  request.onload = function () {"
 - "    var data = JSON.parse(this.response);"
 - "    if (request.status >= 200 && request.status < 400){"
 - "      // console.log(data);console.log(data.state);"
 - "      ret = data.state;"
 - "    } else { console.log('Ge_state for ' + entity + 'error'); }"
 - "  }"
 - "  request.send();"
 - "  return ret;"
 - "}"
 - "function insertParam(key, value){"
 - "  key = encodeURI(key); value = encodeURI(value); var kvp = document.location.search.substr(1).split('&'); var i=kvp.length; var x;"
 - "  while(i--) {"
 - "    x = kvp[i].split('=');"
 - "    if (x[0]==key) {"
 - "      x[1] = value; kvp[i] = x.join('='); break;"
 - "    }"
 - "  }"
 - "  if(i<0) {"
 - "    kvp[kvp.length] = [key,value].join('=');"
 - "  } "
 - "  document.location.search = kvp.join('&'); "
 - "}"

 - "function verify_skin(){"
 - "  var skin_selected= get_state(skin_list);"
 - "  if (skin_selected =='AUTO'){"
 - "    var skin_actual= searchParam('skin');var sun= get_state('sun.sun');"
 - "    if ((sun == 'above_horizon') && (skin_actual != day_skin)){"
 - "      insertParam('skin',day_skin);"
 - "    } else if ((sun == 'below_horizon') && (skin_actual != night_skin)){"
 - "      insertParam('skin',night_skin);"
 - "    }"
 - "  }"
 - "  setTimeout(verify_skin,600000);//10minutes"
 - "}"
 - "verify_skin();"
 - "</script>"

And all is on my github :
https://github.com/kugan49/HA_Config

6

just a question:
do you use a password in HA?
i love your get_state but i wonder how it would be with a pw.

7

I have no password but it’s possible to give one as explained here :
https://developers.home-assistant.io/docs/en/external_api_rest.html

for javascript you need to add after request.open :

request.setRequestHeader("x-ha-access", "mypassword")
request.setRequestHeader("Content-Type", "application/json")

(not tested)

More in this doc :
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader

1 Like