Comme annoncé, ce forum est passé en lecture seule au 1er janvier 2020. Désormais nous vous invitons à vous rendre sur notre nouvelle page communauté :
Image

A très bientôt !

Widget radiateurs

Réservé à l'utilisation et la création de widgets dans JEEDOM
Avatar de l’utilisateur
maxredphenix
Actif
Messages : 539
Inscription : 18 sept. 2015, 21:36
Localisation : Bourgogne

Re: Widget radiateurs

Message par maxredphenix » 23 janv. 2019, 13:59

Bonjour Winhex,

Maintenant que le petit refait ces nuits, je peux revenir vers toi :)

Bon décidément je suis nul et je n'arrive pas à appliquer tes consignes.

J'ai modifier le virtuel afin d'avoir une commande info :
virtuel.JPG
virtuel.JPG (211.44 Kio) Consulté 1808 fois
Comme tout est géré de façon automatique au quotidien par le plugin Agenda :
1) J'ai créé l'info "Mode" qui récupère l'état actuel de la commande fil pilote (Eco, HG, Confort-1 etc.) via la variable dédié à ce radiateur
2) Pour chaque commande de type Action soit les 6 ordres dans mon virtuel, j'ai mis une action après exécution pour MAJ de la variable
ActionAprèsCommande.JPG
ActionAprèsCommande.JPG (24.33 Kio) Consulté 1808 fois
Le widget pour le moment ressemble à ceci.
Avec dans le script le if / else if temp0=

Code : Tout sélectionner

<div class="tooltips cmd cmd-widget" data-type="info" data-subtype="string" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" style="display: block;">
	<center><span style="font-size : 12px;#hideCmdName#" class="cmdName">#name_display#</span> <strong class="state"></strong></center>
 <div class="Mode"></div>
 <div class="Temp"></div>
<style>
	table {
	background: transparent!important;
	}
  .nest__icon {
  content: "";
//  position: absolute;
 // left: 60%;
//  bottom: -8px;
  width:60px;
  height: 55px;
//  margin-left: 24px;
  background: url(plugins/widget/core/template/dashboard/cmd.info.numeric.nest1/nest-leaf.png) no-repeat center center;
  background-size: cover;
}
</style>
      <script>
		jeedom.cmd.update['#id#'] = function(_options){
			$('.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);
      
                var state = _options.display_value;
                 var stateListe = state.split(",");
                    var temp0 = stateListe[0].replace("\"","");
                var temp1 = parseFloat(stateListe[1]);
       $('.cmd[data-cmd_uid=#uid#] .Mode').empty().append(temp0);
  $('.cmd[data-cmd_uid=#uid#] .Temp').empty().append(temp1.toFixed(1) + '°C');
		}
		jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
        
        if ('temp0' == 'OFF') {
            $('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur arret.png">');
        } else if ('temp0' == 'HG') {
            $('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur hg.png">');
         } else if ('temp0' == 'Eco') {
            $('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur eco.png">');
        } else if ('temp0' == 'Confort-2') {
          	$('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur confort-2.png">');
        } else if ('temp0' == 'Confort-1') {
          	$('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur confort-1.png">');
        } else if ('temp0' == 'Confort') {
            $('#iconCmd#id#').append('<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.radiateur 6 ordres/radiateur confort.png">');
        }
	</script>
</div>
Mais le rendu ce n'est pas ça....
DashboardRadiateur.JPG
DashboardRadiateur.JPG (19.05 Kio) Consulté 1808 fois
DIY Intel NUC i5 7Gen(via Proxmox) - Jeedom 3.2.

IPX800 v4 + 2 modules X-4FP
Détecteur fuite d'eau + fumée fibaro
Divers modules Zwave

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 23 janv. 2019, 19:30

revoie la commande
le widget concerne id 3375
regroupant 3367 et 3374
Screenshot_20190123-192622_Chrome.jpg
Screenshot_20190123-192622_Chrome.jpg (574.31 Kio) Consulté 1799 fois
20190123_192921.jpg
20190123_192921.jpg (77.01 Kio) Consulté 1799 fois

Avatar de l’utilisateur
maxredphenix
Actif
Messages : 539
Inscription : 18 sept. 2015, 21:36
Localisation : Bourgogne

Re: Widget radiateurs

Message par maxredphenix » 24 janv. 2019, 10:31

Merci Winhex.

Du coup, j'ai tout corrigé suite à ton post.
Il me reste à comprendre pourquoi la variable ne s'affiche pas correctement pour la consigne :
variableConsigne.JPG
variableConsigne.JPG (36.03 Kio) Consulté 1785 fois
Alors que la 2eme pour "date de la prochaine consigne" fonctionne très bien
variableDateConsigne.JPG
variableDateConsigne.JPG (93.24 Kio) Consulté 1785 fois
Même si je clique sur une commande du virtuel pour changer manuellement la consigne : rien ça reste à zéro.

Au niveau du code du widget, comment je peux faire pour avoir le même affichage que précédemment
L'icone à gauche pour un côté plus visuel et les 2 états (Consigne et Température) à droite
winhexwidget.png
winhexwidget.png (24.6 Kio) Consulté 1785 fois
DIY Intel NUC i5 7Gen(via Proxmox) - Jeedom 3.2.

IPX800 v4 + 2 modules X-4FP
Détecteur fuite d'eau + fumée fibaro
Divers modules Zwave

Avatar de l’utilisateur
maxredphenix
Actif
Messages : 539
Inscription : 18 sept. 2015, 21:36
Localisation : Bourgogne

Re: Widget radiateurs

Message par maxredphenix » 24 janv. 2019, 10:36

maxredphenix a écrit :
24 janv. 2019, 10:31
Merci Winhex.

Du coup, j'ai tout corrigé suite à ton post.
Il me reste à comprendre pourquoi la variable ne s'affiche pas correctement pour la consigne :
variableConsigne.JPG

Alors que la 2eme pour "date de la prochaine consigne" fonctionne très bien
variableDateConsigne.JPG

Même si je clique sur une commande du virtuel pour changer manuellement la consigne : rien ça reste à zéro.
Pourtant la relation est correcte
Capture.JPG
Capture.JPG (54.84 Kio) Consulté 1780 fois
Et la variable est bien mise à jour :
variablescenario.JPG
variablescenario.JPG (33.74 Kio) Consulté 1780 fois
La seule chose bizarre c'est que dans la liste des équipements utilisant cette variable n’apparaît pas [radiateur (vers cuisine)][Etat] qui est pourtant la commande info Etat de mon virtuel récupérant cette valeur
DIY Intel NUC i5 7Gen(via Proxmox) - Jeedom 3.2.

IPX800 v4 + 2 modules X-4FP
Détecteur fuite d'eau + fumée fibaro
Divers modules Zwave

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: Widget radiateurs

Message par guims78 » 22 mars 2019, 23:03

Il est super ton rendu !
Pourrais-tu partager le code de ton widget ?
J'aimerais essayer de l'adapter à mon virtuel de choix de mode de chauffage.

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: Widget radiateurs

Message par guims78 » 13 avr. 2019, 17:24

un petit up !
Ou alors m'aiguiller un peu.

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 13 avr. 2019, 17:50

reproduit dans un virtuel pour test
ensuite ça te sera plus facile
de comprendre le pourquoi du comment

sinon
mon chauffage étant pour différente zone j'utilise
soit un input numérique (valeur pré régler) dans un tableau (pour gain de place)
Screenshot_20190413-174321_Chrome.jpg
Screenshot_20190413-174321_Chrome.jpg (163.97 Kio) Consulté 1659 fois
Screenshot_20190413-174341_Chrome.jpg
Screenshot_20190413-174341_Chrome.jpg (342.83 Kio) Consulté 1659 fois
ou dans un autre design
Screenshot_20190413-174507_Chrome.jpg
Screenshot_20190413-174507_Chrome.jpg (43.47 Kio) Consulté 1659 fois
qui sera remplacé prochainement
Dernière édition par winhex le 13 avr. 2019, 18:22, édité 1 fois.

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 13 avr. 2019, 17:53

par un truc comme ça :
dessus curseur de consigne
dessous températures (thermomerterIMG ou un autre)

enfin tous ça pour te dire qu'il ny a pas qu'une façon (regarde plug mode j ai aidé quelqu'un pour remplacement par image, ...)

et je pense avoir tous dit pour celui qui t'intéresse
j'utilise jamais les boutons de modes (confort,..)

maintenant et c est rare que je changes de modes (les scénarios presences le font pour moi)
si planning activé présences prédomine sur un changement de valeur manuel
si je désactive planning (du tableau de gestion chauffage) la présence ne ferra aucun changement de mode

et la présence :
auto = nut ou oui/non
..
Pièces jointes
Screenshot_20190413-182637_Chrome.jpg
Screenshot_20190413-182637_Chrome.jpg (259 Kio) Consulté 1642 fois
Screenshot_20190413-175202_Chrome.jpg
Screenshot_20190413-175202_Chrome.jpg (15.7 Kio) Consulté 1656 fois
Screenshot_20190413-174831_Chrome.jpg
Screenshot_20190413-174831_Chrome.jpg (61.08 Kio) Consulté 1656 fois

Avatar de l’utilisateur
Salvialf
Helper
Messages : 1334
Inscription : 24 févr. 2018, 09:37
Contact :

Re: Widget radiateurs

Message par Salvialf » 13 avr. 2019, 18:44

Salut @winhex,

Ils sont propres tes shoot écrans! Tu joues avec les jauges du coup en ce moment ;) !?
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)

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 13 avr. 2019, 20:12

je joues avec roundsliderui
hier le bleu avant hier le vert

je trouves les knob (traduction boutons "de volumes") soit trop simpliste (a se confondre avec un compteur ou jauge) soit à vouloir ressemblé au réel et c est pour ça que j essai plein de trucs.

j en ferai un sujet une fois mis en place

on peux aller très très loin avec
https://jsfiddle.net/soundar24/98pjyhv1/

fait 2 tours (orange passe à rouge)
clic sur les heures au milieu
Dernière édition par winhex le 13 avr. 2019, 20:15, édité 1 fois.

Avatar de l’utilisateur
Salvialf
Helper
Messages : 1334
Inscription : 24 févr. 2018, 09:37
Contact :

Re: Widget radiateurs

Message par Salvialf » 13 avr. 2019, 20:15

Bon bah pas besoin que je m'y remette alors tu vas faire tout le taf ;)
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)

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 13 avr. 2019, 20:17

mais ton widget kontrol2 je vais le revoir

mon sujet sera pour le faire soit même car je veux en faire un widget design (cercle vide) le tien suffit pour dashboard et design

Avatar de l’utilisateur
Salvialf
Helper
Messages : 1334
Inscription : 24 févr. 2018, 09:37
Contact :

Re: Widget radiateurs

Message par Salvialf » 13 avr. 2019, 20:31

Oula mon widget sera ridicule une fois que tu seras passé dessus ;) ! Hâte de voir ça...
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)

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 13 avr. 2019, 21:52

regarde ton github tu as une modif !

une minuterie dans le change (idem core slider button de memoire)
jetais partis sur
à la fin du script (hors update)
clic sur dial au lâché
exécute (slider valeur dial)
ça fonctionne aussi
mais tu perdais le scroll bouton de souris

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: Widget radiateurs

Message par guims78 » 15 avr. 2019, 11:56

winhex a écrit :
13 avr. 2019, 17:50
reproduit dans un virtuel pour test
ensuite ça te sera plus facile
de comprendre le pourquoi du comment

sinon
mon chauffage étant pour différente zone j'utilise
soit un input numérique (valeur pré régler) dans un tableau (pour gain de place)
Screenshot_20190413-174321_Chrome.jpg
Screenshot_20190413-174341_Chrome.jpg

ou dans un autre design
Screenshot_20190413-174507_Chrome.jpg

qui sera remplacé prochainement
Hello winhex,
quel widget utilises-tu pour avoir un menu déroulant sur la choix de température ?
Où est-ce un code que tu as développé ?

D'avance merci.

winhex
Actif
Messages : 3799
Inscription : 23 janv. 2015, 01:41

Re: Widget radiateurs

Message par winhex » 15 avr. 2019, 13:00

C'est le widget input number (via action curseur)

viewtopic.php?f=29&t=32321&p=703765&hil ... er#p703759
La modif est dans le sujet sinon la voici

Code : Tout sélectionner

    <div class="tooltips cmd cmd-widget" data-type="action" data-subtype="slider" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" style="width:80px;">
     <center> <span style="font-style: oblique;font-size : 13px;#hideCmdName#;" class="cmdName">#name#</span></center>
      <div class="input-group">
        <input list="limittimeslist#id#" style="width:75px;height: 33px;border-radius: 5px;font-size : 16px;font-weight: Bold;background-color:#e4e2c2;text-align: right;" class="form-control input-sm value execute" type="number" step="0.5" min="12" max="30" placeholder="#state#" value="a" data-cmd_id="#id#"/>

            <datalist id="limittimeslist#id#">

  <option value="12.0" data-id="1">Stop</option>
  <option value="18.0"data-id="2">Eco</option>
    <option value="19.0"data-id="3">Nuit</option>
        <option value="20.5"data-id="4">Confort</option>
</datalist>
</div>
<style>
    /* Firefox */
input[data-cmd_id="#id#"] {
    -moz-appearance: textfield;
}

/* Chrome */
 input[data-cmd_id="#id#"]::-webkit-inner-spin-button,
input[data-cmd_id="#id#"]::-webkit-outer-spin-button { 
	-webkit-appearance: none;
	margin:0;
}

/* Opéra*/
input[data-cmd_id="#id#"]::-o-inner-spin-button,
input[data-cmd_id="#id#"]::-o-outer-spin-button { 
	-o-appearance: none;
	margin:0
}
</style>
	<script>

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
$('.cmd[data-cmd_uid=#uid#] .execute').on("change", function () {
        jeedom.cmd.execute({id:'#id#', value: {slider: $('.cmd[data-cmd_uid=#uid#] .value').val().replace("#unite#", "").replace(" ", "")}});
                });
             } else {
$('.cmd[data-cmd_uid=#uid#]:last .execute').keypress(function( event ) {
           if(event.which == 13) {
        jeedom.cmd.execute({id:'#id#', value: {slider: $('.cmd[data-cmd_uid=#uid#] .value').val().replace("#unite#", "").replace(" ", "")}});
                }});
}

	</script>
</div>

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: Widget radiateurs

Message par guims78 » 15 avr. 2019, 20:04

Merci des infos, je vais tester ça.

desloges
Timide
Messages : 25
Inscription : 28 févr. 2016, 13:58

Re: Widget radiateurs

Message par desloges » 26 juin 2019, 14:03

bonjour guims78 et winhex,

je parcours ce post et plusieurs autres car j'essai de savoir s'il est possible de modifer l'aspect d'un bouton en fonction d'une info pour obtenir exactement ce que vous montrer: le bon bouton du Qubino fil pilote qui reflète l'état du radiateur. Je dois dire que je ne sais toujours pas si on peut le faire simplement depuis le seul equipement Qubino.

J'ai remarqué que vous utilisez un Virtuel. Est-ce vraiment nécessaire ou est-ce qu'on peut simplement ajouter un IF (dans le widget des commandes Action de l'equipement Qubino,) basé sur la valeur de la commande Info "Etat".

Je pensais créer un widget pour les commandes Action et me baser sur quelque chose comme, SI valeur de l'Info Etat=0 et Nom du bouton="Arret" ALORS fond blanc SINON SI Etat=99 et Nom du bouton ="Confort"....

Merci de m'éclairer ou en tout cas de m'indiquer la direction, parce que malgré toutes mes lectures, je ne vois toujours pas.
Pour info, je n'ai pas de virtuel chauffage, j'utilise l'équipement par défaut Qubino (mais j'aimerai masquer l'Info Etat et la remplacer par le changement de couleur des boutons Action.

Merci à vous (et vraiment cool les widget !!!)

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: Widget radiateurs

Message par guims78 » 26 juin 2019, 17:21

Hello,
je ne suis pas expert, mais si tu veux masquer l'info ETAT et faire un changement de couleur des boutons, tu dois passer par un virtuel.

Je pense que tu dois pouvoir retrouver dans le forum les infos pour y parvenir.
benj29 est aussi une bonne source d'inspiration de part le travail effectué et le partage.

Répondre

Revenir vers « [Plugin officiel] Widgets »

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités