(RESOLU)Couleur mode actif
(RESOLU)Couleur mode actif
Bonjour
J'utilise le plugin mode pour de nombreuses actions aussi j'aimerai visualiser d'un seul coup d'oeil par une couleur, les actions en MARCHE et celles en ARRET
J'ai bien réussi à mettre un fond à la commande mais je souhaiterai voir :
MARCHE avec un fond vert
ARRET avec un fond rouge
etc
je précise que je suis assez nul en code donc merci de m'expliquer dans le détail
J'utilise le plugin mode pour de nombreuses actions aussi j'aimerai visualiser d'un seul coup d'oeil par une couleur, les actions en MARCHE et celles en ARRET
J'ai bien réussi à mettre un fond à la commande mais je souhaiterai voir :
MARCHE avec un fond vert
ARRET avec un fond rouge
etc
je précise que je suis assez nul en code donc merci de m'expliquer dans le détail
Dernière édition par MarcF le 13 mars 2019, 08:58, édité 1 fois.
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
-
- Timide
- Messages : 57
- Inscription : 29 nov. 2018, 11:24
Re: Couleur mode actif
Bonjour,
Je suis intéressé moi aussi par une réponse à ce questionnement.
Cordialement
Je suis intéressé moi aussi par une réponse à ce questionnement.
Cordialement
Re: Couleur mode actif
Bonjour
Je suis également intéressé par cette demande.
Salutations
Jean-Paul
Je suis également intéressé par cette demande.
Salutations
Jean-Paul
Re: Couleur mode actif
Bonjour
un petit up, ça doit pourtant etre possible mais je ne trouve pas
En plus, sur la version mobile la zone n'est pas en surbrillance vert
Si je pouvais faire sur les 2 modes :
un fond vert pour Marche et Rouge pour Arret se serait TOP
Merci de votre aide, en plus je vois que ça interresse du monde
un petit up, ça doit pourtant etre possible mais je ne trouve pas
En plus, sur la version mobile la zone n'est pas en surbrillance vert
Si je pouvais faire sur les 2 modes :
un fond vert pour Marche et Rouge pour Arret se serait TOP
Merci de votre aide, en plus je vois que ça interresse du monde
- Pièces jointes
-
- Screen Shot 02-11-19 at 02.52 PM.JPG (8 Kio) Consulté 4991 fois
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Re: Couleur mode actif
Bonjour
Personne n'a une piste
j'ai fouillé dans config avancée / commande Mode / Code
sur l'info MODE ou MARCHE, a priori les codes sont identiques
la seule chose que j'ai réussi a modifier c'est la couleur du fond et du texte mais mais ce que je souhaite faire
Personne n'a une piste
j'ai fouillé dans config avancée / commande Mode / Code
sur l'info MODE ou MARCHE, a priori les codes sont identiques
la seule chose que j'ai réussi a modifier c'est la couleur du fond et du texte mais mais ce que je souhaite faire
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Re: Couleur mode actif
Salut,
Il y a le widget ColorTuile qui fait ça. Par @skyline je crois
Il y a le widget ColorTuile qui fait ça. Par @skyline je crois
VM Jeedom 3.2.16 sous Proxmox 5.4 sur NUC5i5RYH (Debian 9.9)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)
Re: Couleur mode actif
Le widget info.numeric.Sky-colorTuile ne semble pas compatible avec la V3
Il a disparu du market c'est bien dommage
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Re: Couleur mode actif
Ah je ne savais pas... sinon y'a plusieurs posts sur le forum sur lesquels @winhex explique comment faire. Recherche: "mémoriser état bouton" ou "couleur bouton selon état". De mémoire ça doit pouvoir aider...
VM Jeedom 3.2.16 sous Proxmox 5.4 sur NUC5i5RYH (Debian 9.9)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)
Helper Officiel Jeedom
Widgets développés
Téléchargement d'icônes domotique (Topic Forum)
Re: Couleur mode actif
nada
il n'y a pas de #state#, value ou _options.display_value pour faire une comparaison via l'action
je regarderai par defi
edit
on passant par l'info ça marche
il n'y a pas de #state#, value ou _options.display_value pour faire une comparaison via l'action
je regarderai par defi
edit
on passant par l'info ça marche
Code : Tout sélectionner
<div style="min-width:90px;min-height:60px;" class="cmd #history# tooltips cmd-widget" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#">
<center>
<div style="font-weight: bold;font-size : 12px;#hideCmdName#">#name_display#</div>
<span style="font-size: 2em;font-weight: bold;margin-top: 5px;" class="state"></span><br/>
<span style="color: #666666;font-weight: bold;">#unite#</span>
</center>
<script>
jeedom.cmd.update['#id#'] = function(_options){
var val = _options.display_value;
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName[title="'+val+'"]').css('background-color', 'green');
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])').css('background-color', '#cmdColor#');
$('.cmd[data-cmd_id=#id#]').attr('title','Valeur du '+_options.valueDate+', collectée le '+_options.collectDate)
// $('.cmd[data-cmd_id=#id#] .state').empty().append(_options.display_value);
$('.cmd[data-cmd_id=#id#]').hide();
};
jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
</script>
</div>
Re: Couleur mode actif
je pense que vous n'avez pas vu
- Pièces jointes
-
- Screenshot_20190228-174518_Chrome.jpg (14.38 Kio) Consulté 4888 fois
Re: Couleur mode actif
Bonjour
Désolé mais je n'ai pas de connaissance en code...css et autre
J'utilise le plugin MODE et je souhaite modifier la couleur de fond de l'info ETAT
Fond vert si MARCHE
fond rouge si ARRET
j'ai essayé en partant du modèle PRESENCE mais je ne trouve pas
Pouvez vous détailler
Je n'ai pas spécialement besoin des icônes mais si elles y sont tant mieux
Merci
Désolé mais je n'ai pas de connaissance en code...css et autre
J'utilise le plugin MODE et je souhaite modifier la couleur de fond de l'info ETAT
Fond vert si MARCHE
fond rouge si ARRET
j'ai essayé en partant du modèle PRESENCE mais je ne trouve pas
Pouvez vous détailler
Je n'ai pas spécialement besoin des icônes mais si elles y sont tant mieux
Merci
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Re: Couleur mode actif
tu vas dans la configuration avancé
bouton du haut
paramètre de [mode]
icône de droite
onglet code
activé la personnalisation et
coller le code
bouton du haut
paramètre de [mode]
icône de droite
onglet code
activé la personnalisation et
coller le code
Re: Couleur mode actif
OK super
En plus de ton code, j'ai réussi a modifier le widget : tile_mode
Merci grâce au forum je m'améliore tout doucement
En plus de ton code, j'ai réussi a modifier le widget : tile_mode
Merci grâce au forum je m'améliore tout doucement
Jeedom smart zwave+ passée en stretch
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Modules FGD-212 + FGB-002 + Bypass + QUBINO ZMNHAD1 & ZMNHJD1 fil pilote + ZMNHEA1 + Sonde temp
plugins app mobile, mail, groupe, agenda, geoloc, info jour, mode, heliotrope, vigilance meteo, thermostat
Re: (RESOLU)Couleur mode actif
un petit up car c'est le genre de truc que je cherche.
Je dois raté un truc (avec le code ci-dessus)
Si je l'applique à un bouton du mode, tous les autres passent à la couleur "inactive" (bleu) mais le bouton modifié est invisible au lieu de rouge...
Si je l'applique à tous, je ne vois plus rien ....
Je suis preneur d'une piste. Merci
Je dois raté un truc (avec le code ci-dessus)
Si je l'applique à un bouton du mode, tous les autres passent à la couleur "inactive" (bleu) mais le bouton modifié est invisible au lieu de rouge...
Si je l'applique à tous, je ne vois plus rien ....
Je suis preneur d'une piste. Merci
Pi4/4Go +SSD 32Go (Wifi et bluetooth actifs) + Clé USB Z-Wave Everspring + rfxcom (RTS) + Google Home
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
Re: (RESOLU)Couleur mode actif
c'est un widget info et non pour une action (bouton)
Re: (RESOLU)Couleur mode actif
Mince j'ai pas fait gaffe à ça. Merci
Je vais essayer d'adapter mais html et css c'est pas mon truc
Je vais essayer d'adapter mais html et css c'est pas mon truc
Pi4/4Go +SSD 32Go (Wifi et bluetooth actifs) + Clé USB Z-Wave Everspring + rfxcom (RTS) + Google Home
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
Re: (RESOLU)Couleur mode actif
c'est pas le html ou css le plus chaud c'est le script jquery ou javascript
c'est en jouant, reproduisant, adaptant qu'on acquiert de quoi se débrouiller
vu que le plug mode n'as pas de retour d'info pour faire un changement de couleur sur l'action c'est l'info qui met la couleur aux actions du widget
dans le script après actualisation de l'etat
var val = _options.display_value;
met en variable val = le retour d'info (nom de ton boutons activé )
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName[title="'+val+'"]').css('background-color', 'green');
remonte à la source du widget (fonction jquery closest) et dans tous le widget recherche un bouton avec pour titre val et mes y la couleur verte
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])').css('background-color', '#cmdColor#');
idem ne contenant pas pour nom val en titre alors là couleurs de default
$('.cmd[data-cmd_id=#id#]').hide();
cache l'info
donc même si c'est les boutons action qui change d'apparence c'est un widget info qui fait le travail
t'inquiète même si pour moi ça me paraît simple à expliquer c'était pas le cas pour le faire.
c'est en jouant, reproduisant, adaptant qu'on acquiert de quoi se débrouiller
vu que le plug mode n'as pas de retour d'info pour faire un changement de couleur sur l'action c'est l'info qui met la couleur aux actions du widget
dans le script après actualisation de l'etat
var val = _options.display_value;
met en variable val = le retour d'info (nom de ton boutons activé )
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName[title="'+val+'"]').css('background-color', 'green');
remonte à la source du widget (fonction jquery closest) et dans tous le widget recherche un bouton avec pour titre val et mes y la couleur verte
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])').css('background-color', '#cmdColor#');
idem ne contenant pas pour nom val en titre alors là couleurs de default
$('.cmd[data-cmd_id=#id#]').hide();
cache l'info
donc même si c'est les boutons action qui change d'apparence c'est un widget info qui fait le travail
t'inquiète même si pour moi ça me paraît simple à expliquer c'était pas le cas pour le faire.
Re: (RESOLU)Couleur mode actif
Bon ça fonctionne si on l'applique au bon endroit ^^ mais je dois adapter par contre :
- J'ai plusieurs modes avec le même "nom" d'action (ex 'off'), donc le "find" sur le nom ne trouvera pas forcement le bon bouton à coloriser
- J'ai des boutons "déportés" ...
Le "truc" que je vois c'est de définir l'id de référence dans une variable personnalisée des boutons et d'utiliser le find sur ce nouveau champ
Merci en tout cas !
EDIT : en fait c'est plus simple... ça marche directement à condition d'avoir aussi l'info déportée
- J'ai plusieurs modes avec le même "nom" d'action (ex 'off'), donc le "find" sur le nom ne trouvera pas forcement le bon bouton à coloriser
- J'ai des boutons "déportés" ...
Le "truc" que je vois c'est de définir l'id de référence dans une variable personnalisée des boutons et d'utiliser le find sur ce nouveau champ
Merci en tout cas !
EDIT : en fait c'est plus simple... ça marche directement à condition d'avoir aussi l'info déportée
Pi4/4Go +SSD 32Go (Wifi et bluetooth actifs) + Clé USB Z-Wave Everspring + rfxcom (RTS) + Google Home
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
Re: (RESOLU)Couleur mode actif
@winhex : comment tu fais pour retrouver la bonne "structure" contenu dans le find et obtenir de quoi y ajouter une image ?
L'idée c'est d'avoir des images nommées 'val'-couleur.png et 'val'-nb.png
Le find affecte celle en couleur, le notfind celle en noir et blanc tout comme le changement de background aux boutons
Idéalement toutes dans un répertoire qui corresponds au nom du "mode" (à défaut avec une variable ça fonctionnera), comme ça quand on a plusieurs modes, on est tranquille
J'ai trouvé ça mais j'ai besoin de récuperer le texte du bouton (pour remplacer val) et de l'effacer
L'idée c'est d'avoir des images nommées 'val'-couleur.png et 'val'-nb.png
Le find affecte celle en couleur, le notfind celle en noir et blanc tout comme le changement de background aux boutons
Idéalement toutes dans un répertoire qui corresponds au nom du "mode" (à défaut avec une variable ça fonctionnera), comme ça quand on a plusieurs modes, on est tranquille
J'ai trouvé ça mais j'ai besoin de récuperer le texte du bouton (pour remplacer val) et de l'effacer
Code : Tout sélectionner
$btnact=$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName[title="'+val+'"]');
$btnact.append("<img src='plugins/widget/core/images/"+val+"-couleur.png' heigh=25px width=25px>");
$btninact=$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])');
Pi4/4Go +SSD 32Go (Wifi et bluetooth actifs) + Clé USB Z-Wave Everspring + rfxcom (RTS) + Google Home
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
7 Danfoss LC-13
2 velux module DIO
7 volets RTS
3 Sonoff
IFTTT
Capteur porte, de présence, et prise intelligente...
Re: (RESOLU)Couleur mode actif
j'ai pas tous compris voir aussi que je n'utilise pas mode, c'était un simple défit. je l'ai réinstallé
ta plein de manière pour le faire
d'abord un simple image fonctionne t il ?
le 1er c'est une construction html (style, class,,..)
si tu souhaites sinon le not que pour l'image
ensuite (je te laisse faire)
exemple
mode / action1 / action2
tous mettre en noir et blanc
ligne contenant [title="'+val+'"]
remplace par
[title=action1] et image1 nb
idem action 2
image couleur
dans un
if (option_display == action1)
[title=action1] image couleur1
if (option_display == action2)
[title=action2] image couleur2
il ny aura pas de find not
ta plein de manière pour le faire
d'abord un simple image fonctionne t il ?
Code : Tout sélectionner
<div style="min-width:90px;min-height:60px;" class="cmd #history# tooltips cmd-widget" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#">
<center>
<div style="font-weight: bold;font-size : 12px;#hideCmdName#">#name_display#</div>
<span style="font-size: 2em;font-weight: bold;margin-top: 5px;" class="state"></span><br/>
<span style="color: #666666;font-weight: bold;">#unite#</span>
</center>
<script>
jeedom.cmd.update['#id#'] = function(_options){
var val = _options.display_value;
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName[title="'+val+'"]').empty().html('<span><img src="plugins/widget/core/template/dashboard/cmd.info.numeric.thermometreIMG2/TempRouge.png" width=20 height=30/></span>');
// $('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])').css('background-color', '#cmdColor#');
$('.cmd[data-cmd_id=#id#]').closest('.eqLogic-widget').find('a.btn.btn-sm.btn-default.action.cmdName:not([title="'+val+'"])').empty().append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.thermometreIMG2/TempBleu.png" height=30/>');
$('.cmd[data-cmd_id=#id#]').attr('title','Valeur du '+_options.valueDate+', collectée le '+_options.collectDate)
$('.cmd[data-cmd_id=#id#] .state').empty().append(_options.display_value);
// $('.cmd[data-cmd_id=#id#]').hide();
};
jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
</script>
</div>
si tu souhaites sinon le not que pour l'image
ensuite (je te laisse faire)
exemple
mode / action1 / action2
tous mettre en noir et blanc
ligne contenant [title="'+val+'"]
remplace par
[title=action1] et image1 nb
idem action 2
image couleur
dans un
if (option_display == action1)
[title=action1] image couleur1
if (option_display == action2)
[title=action2] image couleur2
il ny aura pas de find not
Qui est en ligne ?
Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 5 invités