Encore un grand merci à @ZogStriP pour le temps passé à la mise en forme et au nettoyage de nos posts .
Je ferais un post dans la soirée pour vous expliquer comment partager du code afin qu’il soit colorié syntaxiquement
C’est magique
Super ! Merci à vous @ZogStriP et @fgtoul pour votre aide, et tout le temps que vous consacrez à mettre sur la bonne voie, les rameurs de mon genre
Dans le même ordre d’idée, est-il possible de rassembler 3 visualisations de sorties virtuelles en une seule en utilisant du code et le widget HTML ?
Je m’explique :
Je suis en tarif tempo ( 3 couleurs Bleu, Blanc Rouge ) et pour visualiser la couleur du jour j’ai créé 3 widgets ( 1 par couleur, ça marche mais ce n’est pas très élégant ! ).
J’aimerai pouvoir afficher un texte indiquant la couleur du jour en fonction des 3 sorties virtuelles dans un seul widget, est-ce possible ?
Merci d’avance
Tout est possible
Pourriez-vous me donner votre code actuel pour que je me base dessus ?
Je n’ai pas de code, ce sont 3 widgets « Pilotage relais/Entrées virtuelles/Sorties virtuelles » utilisés pour visualiser la couleur du jour.
Merci à @ZogStriP @Aspro95 @fgtoul qui m ont permis de faire une présentation à mon goût j ai repris la présentation d @Aspro95 et agrandi mise à gras et changer un peu les couleurs
Non extérieure c est une tc4012,
Tableau et humidité un xthl
Et les autres sondes enocean
Ok, sans prétention graphique, je ferais quelque chose comme ça
let cssColor = "#005bbb"
let colorOfDay = "Bleue";
if (datasources["V4"]["response"]["vout"][0] == 1) {
cssColor = "#ebebeb";
colorOfDay = "Blanc";
} else if (datasources["V4"]["response"]["vout"][1] == 1) {
cssColor = "#ff001f";
colorOfDay = "Rouge";
}
return `
<div style="color: ${cssColor}">
<span class="glyphicons glyphicons-clock x2"></span> ${colorOfDay}
</div>
`;
Il vous faut créer une source de donnée qui s’appelle « V4
» avec pour URL /user/io.xml
de votre IPX.
Par défaut, c’est une journée bleu.
Si la sortie virtuelle 1 est allumée, alors ça sera blanc.
Si la sortie virtuelle 2 est allumée, alors ça sera rouge.
C’ est exactement ce que je voulais, ça donne envie de se plonger dans le html, css et autres …
Je vais essayer d’améliorer la mise en forme.
Encore merci pour le temps passé et la réactivité !
Patrice
Voila ce que sa donne ma version définitive,mais j’aimerais faire changer la couleur des gliphoticones automatiquement selon l êtas des relais chauffages (exp : lorsque le chauffage du couloir est en marche gliphoticones rouge ) mais je ne connais rien en formule html voila ?
bonjour @TRABAC
beau travail,
il y a erreur d’unité sur l’humidité extérieure.
bonjour @fmmomo
Voici un petit code repris de mon exemple précédent.
Il n’est pas optimisé ni joli, mais il est écrit de façon à être simplement réadaptable.
dans mon exemple je mets les couleurs par défaut en blanc, puis si température de sonde inférieure à 16, je passe l’icône en rouge. A toi de mettre tes propres valeurs.
let cssColor1 = "#ebebeb";
if (datasources["V4"]["response"]["enoA6"] < 16) {
cssColor1 = "#ff0000";
}
let cssColor2 = "#ebebeb";
if (datasources["V4"]["response"]["enoA7"] < 16) {
cssColor2 = "#ff0000";
}
let cssColor3 = "#ebebeb";
if (datasources["V4"]["response"]["enoA8"] < 16) {
cssColor3 = "#ff0000";
}
return `
<table width='100%'>
<tr>
<td align=left valign=middle width='10%'><span style='color: ${cssColor1}'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #ffff00'>Ambiante</span></td>
<td align=right valign=middle><span style='color: #ffff00;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog0"])*0.0050354)-49]/1).toFixed(1)} °C</span></td>
</tr>
<tr>
<td align=left valign=middle width='10%'><span style='color: ${cssColor2}'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #00ffff'>Extérieure</span></td>
<td align=right valign=middle><span style='color: #00ffff;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog1"])*0.0050354)-51]/1).toFixed(1)} °C</span></td>
</tr>
<tr>
<td align=left valign=middle width='10%'><span style='color: ${cssColor3}'class="glyphicons glyphicons-temperature x2"></span></td>
<td align=left valign=middle width='50%'><span style='color: #ff00ff'>Départ plancher</span></td>
<td align=right valign=middle><span style='color: #ff00ff;font-size: 20px;'>${([((datasources["XML_V4"]["response"]["analog3"])*0.0050354)-49]/1).toFixed(1)} °C</span></td>
</tr>
</table>
Merci beaucoup @fgtoul
À quel endroit dois je mettre cela dans le code source ?
Mes sondes affichées en violets gèrent le chauffage de chaque pièce,j aurais souhaitez que le gliphicone correspondant a chaque pièce se mette en rouge lorsque le relais correspondant est activé
Merci beaucoup pour ton aide
regarde mon script le petit code javascript se place au dessus du return
ensuite dans ton code existant sous la balise <table>
tu modifies le style de l’icone style='color: "
par celui que je donne en exemple aujourd’hui style='color: ${cssColor1}
pour conditionner selon le relai et non par rapport à la température, il faut changer les lignes avec datasources’ en t’inspirant du code donné par ZogStriP à Pat49700
si tu n’y arrives pas, envoie moi ton code en MP.
merci @fgtoul avec la température sa fonctionne très bien,mais avec les relais je n’y parvient pas voila ce que j’ai mis a la deuxième ligne:
datasources["V4"]["response"]["out"][0] == 1
mais sa donne rien
merci
fais bien attention aux accolades et parenthèses,
puis remplace l’indice [0] par le numéro de ta sortie -1
les points-virgules sont importants aussi.
merci pour tout @fgtoul cela fonctionne super bien l icone passe en rouge lorsque la zone concernée est en chauffe j’ai du mettre cela au debut:
let cssColor1 = "#ff0000";
if (datasources["V4"]["response"]["led1"] < 1) {
cssColor1 = "#ee82ee";
}
cela permet d’avoir un retour d’êtas des relais sympas sans prendre d’espace supplémentaire merci encore