[SALVIALF] Widget SliderButton (Action/Curseur)

snoopyfb · Mai 8, 2020, 5:06

Période horaire d’autorisation de fonctionnement : Pour éviter qu’Alexa ou Google Home parle le matin tôt ou le soir
Réglage du niveau du volume
Possibilité de désactivé la synthèse voale

Je fait parler JEEDOM, sur le départ des occupants, la sortie des poubelles, la fermeture des stores le soir, la fermeture partielle des stores sur présence soleil (suntracking), arrêt général du chauffage …

axelpg · Mai 8, 2020, 5:08

Excellent !

kristobal · Mai 8, 2020, 5:12

je le savais c’était pour plaisanter

Domotech · Mai 10, 2020, 8:50

Super @Dankoss & @Salvialf!

Heurex de voir l’aboutissement après avoir vu l’évolution sur le Discord!

Yasu · Mai 10, 2020, 3:57

Salut Salvialf,
Beau travail avec @Dankoss, c’est un widget qui va me servir.
Je n’ai donc pas pu m’empêcher d’aller voir ton code pour le mettre à ma sauce
et donc j’ai chercher une solution pour cette histoire d’option de couleur de texte.
Voici ce que j’ai fais de mon côté pour que cela fonctionne chez moi si cela peux aider.

Mon option supplémentaire

var couleurInfo#uid# =('#couleurInfo#' !='#'+'couleurInfo#') ? '#couleurInfo#':'rgba(255,255,255,1)';

Et la partie qui va modifier la variable CSS

// modification de la variable couleur !important
let inputSB#uid# = document.querySelector('input.input-SB#uid#');
inputSB#uid#.style.setProperty('--txt-color', couleurInfo#uid#);

P.S: Pour éviter les conflits lors de plusieurs widgets sur une même page, j’ai été obligé de modifier le input-SB en input-SB#uid#

Bonne continuation

Salvialf · Mai 10, 2020, 5:30

Salut,

Je fais volontairement en sorte de ne pas avoir de remplacements d’ #id#/#uid# donc je ne passerai pas un #uid# sur la classe ni sur la variable c’est voulu.

Au pire ça passera en perso CSS avancée, par exemple:

.cmd-widget[data-cmd_id="3"] input:not(.btn):not(.dial):not([type="radio"]):not([type="image"]):not(.expressionAttr):not(.knob):not([type="checkbox"]).input-SB {
  color: red!important;
  }

Mais je comptais déjà y regarder de plus près en pur javascript je suis juste sur autre chose en ce moment.

Merci beaucoup pour ton retour

Yasu · Mai 10, 2020, 5:37

Salut,

Du coup, je verrais bien ta façon de faire, car je n’ai pas trouvé comment insérer ma variable dans cette ligne

.cmd-widget[data-cmd_id="3"] input:not(.btn):not(.dial):not([type="radio"]):not([type="image"]):not(.expressionAttr):not(.knob):not([type="checkbox"]).input-SB {
  color: red!important;
  }

De rien pour le retour

Salvialf · Mai 10, 2020, 5:42

Pas de variable à passer ça cible directement la commande par son numéro d’id. Il suffit de renseigner la couleur voulue

Yasu · Mai 10, 2020, 6:16

Curieux d’avoir un exemple afin que je comprenne le mécanisme

Salvialf · Mai 10, 2020, 6:43

J’suis pas sur le Pc là mais c’est dans Réglages → système → personnalisation avancée => case de droite CSS

Pascal_Mauclere · Mai 10, 2020, 6:57

Bonsoir, je confirme c’est vraiment un super taf ce que vous avez fait .
Question de débutant, comment mettre % ou °C à côté de la valeur?
Merci d’avance et encore bravo.

Salvialf · Mai 10, 2020, 6:59

Salut,

Il faut renseigner l’unité dans la case prévue à cet effet sur la commande info numérique liée

Pascal_Mauclere · Mai 10, 2020, 7:01

Cool merci beaucoup. Ce forum est incroyable quelle réactivité.

Yasu · Mai 10, 2020, 8:47

Je n’aime pas passer par là ( Réglages → système → personnalisation avancée => case de droite CSS) tout simplement car au vu du nombre de widgets que j’ai, cela deviendrais vite incompréhensible.

iPapy · Mai 14, 2020, 4:11

Hello @Salvialf

J’ai enfin trouvé le temps de tester ce magnifique widget mais et oui tu me connais si je ne veux faire apparaitre aucune valeur entre le plus et le moins (genre + je monte mon volet, - le baisse mon volet) est ce possible?

Merci d’avance pour ta réponse