Organisation des widgets entre ordi et gsm

Bonsoir @volta17,

Il y a des éléments de réponses dans ce post :

Mais j’ai aussi trouvé des choses sur le net, je ne sais plus trop où… :slight_smile:

Au final, voici le code d’un de mes thermomètres :

var temp_chambres = ((((datasources["IPX Status"]["response"]["analog1"])* 0.000050354) - 1.63)/0.0326).toFixed(1);
var presence = (datasources["IPX Status"]["response"]["vin8"]);
var min = 0;
var low = 10;
var high = 12;
var max = 30;
var color = "orange";
if (presence == 1) {
    low = 18;
    high = 22;
    color = "red"
};
 return `
<style>  
.thermometre {
  width: 248px;  /* 278px */
  height: 20px;  /* 25px */
  -webkit-appearance: none; 
  border: 1px solid #444444;  
  border-radius: 5px;  
  opacity:1;
  filter:alpha(opacity=100);    
  background-size: 100% 100%;  
  -webkit-box-shadow: inset 0 0 4px 0px #444444;
}  
.thermometre:-moz-meter-optimum::-moz-meter-bar {
  background:blue;
  opacity:0.5;
  filter:alpha(opacity=70);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
.thermometre:-moz-meter-sub-optimum::-moz-meter-bar {
  background:lime;
  opacity:0.6;
  filter:alpha(opacity=75);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
.thermometre:-moz-meter-sub-sub-optimum::-moz-meter-bar {
  background:${color};
  opacity:0.7;
  filter:alpha(opacity=80);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
</style>     
<br>
&nbsp;&nbsp;&nbsp;
Température coté chambres : <b>${temp_chambres} °C</b>
<br>
<!-- Présence = ${presence} -->
<br>
&nbsp;&nbsp;&nbsp;
${min} °C
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
${max} °C
<br>
&nbsp;&nbsp;&nbsp;
<meter class="thermometre" low=${low} high=${high} min=${min} max=${max} value=${temp_chambres} optimum="2"></meter>
<br>
`;

Ce n’est pas forcément super classe et je suppose que des pros du code feraient largement mieux et plus optimisé, mais ça marche.

NB1 : une source de données IPX Status, reprend les données de status.xml pour actualiser les valeurs
NB2 : je fais changer les valeurs limites et la couleur en fonction d’un indicateur d’occupation ou non de la maison, variable « presence » qui récupère la valeur de l’entrée virtuelle 8.

Bonne adaptation du code.

3 « J'aime »