[SALVIALF] Widget Consigne_Thermostat (Action/Curseur)

Ok c’est noté il faut que je revois le code de ce widget de toute façon y’a plusieurs choses qui ne me plaise pas dedans

1 « J'aime »

En tout cas le résultat est beau. Comme d’hab bon boulot de ta part.

Heu il ne s’agit pas du widget dont il est question dans ce sujet… tout simplement car il ne contient pas d’images

oups, dsl je supprime

Merci Salviaf pour le widget ! :wink:
Peut on modifier la police pour y mettre la police Montserrat ?

Merci

Bonjour,

Pour info @Salvialf car ce n’est que du cosmétique (donc no pression sur la revue du code car cela peut venir de moi :wink:)

Depuis mon dernier post je suis revenu en tableau sur la disposition du widget. Ma température de consigne est parfois tronquée (ça revient/ça repart au gré des refresh sans que je n’ai pu l’expliquer). Le redimensionnement du widget depuis le dash n’y change rien.

Capture d’écran du 2020-12-14 07-11-03

La Disposition tableau (avec ou sans param css sup ça ne change rien) :

Jeedom v4.0.61

Salut,

Merci beaucoup pour le code de ce Widget, c’est exactement ce que je cherchais.
Je l’ai modifié pour qu’il soit dans le même thème que mon design, mais je n’arrive pas à aligner verticalement la consigne de température; je voudrais que la consigne de température soit alignée avec la température de la pièce qui est juste à droite.
image

Ci dessous mon code que j’ai modifié (soyez tolérant je n’y connais pas grand chose…)

<div class="cmd cmd-widget" data-type="action" data-subtype="slider" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
<!-- ########## Consigne Thermostat ##########
********* Paramètres Optionnels ********* 
step = valeur du pas de chgt de valeur (0.5 par défaut) 
########## by @SALVIALF ;) ############# -->

 <div class="title #hide_name#">
   <div class="cmdName">#name_display#</div>
 </div>
 <span id="thermo_icon"></span>
 <p id="displayConsigne" class="text-right">
 <i style="font-size: 30px; font-style: normal; font-weight: bold; color: white; vertical-align: middle">
   <span id="valeur#id#"></span><sup>°C</sup>
   </i>
  </p>
  <div id="boutons">
   <a class="btn-sm bt_plus"><i class="fas fa-2x fa-plus-square"></i></a>
    <br />
   <a class="btn-sm bt_minus"><i class="fas fa-2x fa-minus-square"></i></a>
  </div>
<style>
<!-- MBD
@font-face {
   font-family: "liquid";
 	src:	url("data/fonts/LiquidNormal.ttf") format("truetype");
}
-->
#thermo_icon { font-size:4em;}
#displayConsigne { display:inline; width:85px;} <!-- font-family:"liquid";}
#valeur#id# { font-size:3.5em; } -->
#boutons { display:inline-block; }
</style>  
 <script>
   var sbjs_Timer#id#;
                   
   /***** + *****/
   $('.cmd[data-cmd_id=#id#] .bt_plus').on('click', function () {
     var cmd = $('.cmd[data-cmd_uid=#uid#]')
     	var step = (isNaN(parseFloat('#step#'))) ?  0.5 : parseFloat('#step#');
     	cmd.find('#valeur#id#').text(parseFloat(parseFloat($('#valeur#id#').text()) + step ).toFixed(1) );
                  
   	clearTimeout(sbjs_Timer#id#);
   	sbjs_Timer#id# = setTimeout(sbjs_Save#id#, 1500);              
   });      
                        
   /***** - *****/
   $('.cmd[data-cmd_id=#id#] .bt_minus').on('click', function () {
     var cmd = $('.cmd[data-cmd_uid=#uid#]')
     	var step = (isNaN(parseFloat('#step#'))) ?  0.5 : parseFloat('#step#');
   	cmd.find('#valeur#id#').text(parseFloat(parseFloat($('#valeur#id#').text()) - step ).toFixed(1) );
     
   	clearTimeout(sbjs_Timer#id#);
   	sbjs_Timer#id# = setTimeout(sbjs_Save#id#, 1500);
   });

   /***** Envoi de la nouvelle consigne *****/
   function sbjs_Save#id#() {
   	jeedom.cmd.execute({ id: '#id#', value: { slider: parseFloat( $('#valeur#id#').text() ) }
       });
   }
   
   /***** MAJ Automatique *****/
   jeedom.cmd.update['#id#'] = function(_options){
     var cmd = $('.cmd[data-cmd_uid=#uid#]')
     cmd.find('#valeur#id#').text(parseFloat(_options.display_value).toFixed(1));
     
     if (_options.display_value < 10) {
         cmd.find('#thermo_icon').html('<i class="icon_blue jeedom-thermo-froid"></i>');}
     	else if (_options.display_value <= 16) {
         cmd.find('#thermo_icon').html('<i class="icon_green jeedom-thermo-moyen"></i>');}
     	else if (_options.display_value <= 22) {
         cmd.find('#thermo_icon').html('<i class="icon_yellow jeedom-thermo-chaud"></i>');}
       else {
         cmd.find('#thermo_icon').html('<i class="icon_orange jeedom-thermo-chaud"></i>');}
   }
   jeedom.cmd.update['#id#']({display_value:'#state#'});
 </script>
</div>

Bonjour !
Super boulot ! j’aime beaucoup.
je sais pas si tu as fait la mise a jour pour les butées maxi et mini , j’ai testé et ca marche pas .
Merci beaucoup !

Bonjour.

Je me suis permis deux évolutions :

  1. Bloquer le + et le - avec les bornes définies dans la commande
  2. Le double clic sur l’icone pour mettre au min ou au max
<div class="cmd cmd-widget" data-type="action" data-subtype="slider" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
<!-- ########## Consigne Thermostat ##########
 ********* Paramètres Optionnels ********* 
 step = valeur du pas de chgt de valeur (0.5 par défaut) 
 ########## by @SALVIALF ;) ############# -->

  <div class="title #hide_name#">
    <div class="cmdName">#name_display#</div>
  </div>
  <div id="boutons">
	  <!--<span id="thermo_icon"></span>-->
    <a class="btn-sm thermo_icon"><span id="thermo_icon"></span></a>
  </div>
  <p id="displayConsigne" class="text-right">
    <span id="valeur#id#"></span>% 
   </p>
   <div id="boutons">
    <a class="btn-sm bt_plus"><i class="fas fa-2x fa-plus-square"></i></a>
     <br />
    <a class="btn-sm bt_minus"><i class="fas fa-2x fa-minus-square"></i></a>
   </div>
<style>
@font-face {
    font-family: "liquid";
  	src:	url("data/fonts/LiquidNormal.ttf") format("truetype");
}
 #thermo_icon { font-size:4em;}
 #displayConsigne { display:inline-block; width:85px; font-family:"liquid";}
 #valeur#id# { font-size:3.5em; }
 #boutons { display:inline-block; }
</style>  
  <script>
	var sbjs_Timer#id#;
                    
    /***** + *****/
	$('.cmd[data-cmd_id=#id#] .bt_plus').on('click', function () {
      var cmd = $('.cmd[data-cmd_uid=#uid#]')
      	var step = (isNaN(parseFloat('#step#'))) ?  0.5 : parseFloat('#step#');
		if ((parseFloat($('#valeur#id#').text()) + step)>= #maxValue#){
			cmd.find('#valeur#id#').text(#maxValue#);
		} else {
			cmd.find('#valeur#id#').text(parseFloat(parseFloat($('#valeur#id#').text()) + step ).toFixed(0) );
		}
                   
		clearTimeout(sbjs_Timer#id#);
		sbjs_Timer#id# = setTimeout(sbjs_Save#id#, 1500);              
	});      
                         
	/***** - *****/
    $('.cmd[data-cmd_id=#id#] .bt_minus').on('click', function () {
      var cmd = $('.cmd[data-cmd_uid=#uid#]')
      	var step = (isNaN(parseFloat('#step#'))) ?  0.5 : parseFloat('#step#');
      	if ((parseFloat($('#valeur#id#').text()) - step) <= #minValue#){
			cmd.find('#valeur#id#').text(#minValue#);
		} else {
			cmd.find('#valeur#id#').text(parseFloat(parseFloat($('#valeur#id#').text()) - step ).toFixed(0) );
		}
		
      
		clearTimeout(sbjs_Timer#id#);
		sbjs_Timer#id# = setTimeout(sbjs_Save#id#, 1500);
	});



	/***** double clic sur icon *****/

    $('.cmd[data-cmd_id=#id#] .thermo_icon').on('dblclick', function () {
      var cmd = $('.cmd[data-cmd_uid=#uid#]')
      if (parseFloat($('#valeur#id#').text())>0){
      	cmd.find('#valeur#id#').text(#minValue# );
      } else {
        cmd.find('#valeur#id#').text(#maxValue# );
      }
	  clearTimeout(sbjs_Timer#id#);
	  sbjs_Timer#id# = setTimeout(sbjs_Save#id#, 1500);              
	});
    

    /***** Envoi de la nouvelle consigne *****/
	function sbjs_Save#id#() {
		jeedom.cmd.execute({ id: '#id#', value: { slider: parseFloat( $('#valeur#id#').text() ) }
        });
	}

Hello @Salvialf, bonjour à tous
J’ai testé ce plugin qui me semble parfait il y a un an mais ce n’est qu’aujourd’hui que je veux l’utiliser, venant d’installer le plugin Thermostat.
Tout est parfait quand je mets le widget dans la commande du plugin.
Le problème, c’est quand j’importe ensuite l’équipement dans un virtuel. il me récupère bien entendu en copie conforme la commande action Thermostat, mais dans le virtuel il m’affiche NAN à la place de la température de consigne…
Capture

Je ne sais pas d’où ça peut venir. Bien entendu avec ce NAN, les boutons + et - n’ont aucune action.

Merci d’avance, j’ai vraiment besoin du virtuel pour mes designs…

1 « J'aime »

Salut,

Il faudrait voir les commandes de ton virtuel mais dans l’idée je dirais qu’il faut récupérer la commande action/curseur ainsi que la commande info/numérique liée (consigne)

1 « J'aime »

Hello @Salvialf, merci pour la réponse.
En fait, j’ai juste fait "Importer Equipement " et ensuite supprimé du virtuel les commandes et états dont je n’ai pas besoin dedans.
Bien entendu, l’Action/Curseur « Thermostat » est conservé de même que la consigne.

Mais je vois qu’aucune info ne remonte et qu’aucune action ne fonctionne. Pourtant le virtuel est bien sauvegardé et actif …
Du coup, j’ai essayé de créer la commande action et la commande état à la main, en leur indiquant l’équipement, mais idem, les valeurs ne remontent pas, en tous cas la valeur de la consigne reste à 0 alors qu’elle est à 20 sur l’équipement.

Donc le plugin n’est pas en cause. Ca doit être moi, ou une particularité du plugin Thermostat (les commandes ne sont pas visibles dans un onglet, c’est bizarre).
Si quelqu’un sait sur ce fil, je suis preneur, sinon je vais poster ma question sur le plugin Thermostat.
Merci d’avance

Il faudrait montrer la liste des commandes de ton virtuel.

Les commandes du plugin Thermostat sont accessibles en cliquant sur le bouton Configuration avancée des équipements thermostat.

Oui, j’ai bien vu où étaient les commandes. De toutes façon, importer l’équipement les trouve et les copie à l’identique.
J’ai fini par y arriver, je crois, sans comprendre ce que j’ai fait (à tâtons).

J’ai du rajouter le nom de l’info consigne (« Consigne ») dans la case en bas à gauche de la commande action/curseur.
Je peux comprendre qu’elle en ait besoin pour savoir que ça fait bouger la consigne, mais du coup je ne comprends pas pourquoi la même commande n’en a pas besoin directement dans l’équipement…

A vrai dire, ça fait 50 fois que je relis la doc du plugin Virtuel, et je n’ai toujours pas vraiment compris quelle info doit aller où, à part sur un On/off avec état. J’y vais toujours un peu au hasard, et pourtant j’en ai plus de 50 !
En tous cas merci de m’avoir répondu alors que j’étais hors sujet

Hello @Salvialf et bonjour à tous
Ce plugin est vraiment génial.
Toutefois, voulant de ce fait l’employer à toutes les sauces, j’ai un souci pour son utilisation en tableau (Disposition dans mon virtuel)…
J’ai un tableau dans lequel j’ai mis toutes les consignes jour / nuit, chauffage / refroidissement de mes 3 clims.
Autant je parviens à diminuer la taille du chiffre de la consigne (avec un font-size), autant je n’y arrive pas pour le plus et le moins qui donnent une très grande hauteur à la case concernée. Du coup, le tableau prend sensiblement plus de place que mon tableau actuel (beaucoup moins esthétique).
Y a-t-il un moyen de réduire la taille du widget dans un tableau (surtout en hauteur) ?

Autre question (au point où j’en suis…)
Y a-t-il un moyen de supprimer l’icône du thermomètre ? Autant elle est parfaite sur le widget tout seul, autant de la voir se répéter pour un tableau de consignes, c’est de la place perdue. Je comprends bien que le widget n’a pas été conçu pour ça et que je veux en faire une utilisation détournée, mais vu mes compétences, si je ne pose pas la question je ne le saurai jamais…
Merci d’avance

Bonjour,

Merci de créer un sujet dédié avec l’étiquette #widget-tiers dans la catégorie Widgets pour toute demande ou remontée concernant ce widget.

Ce sujet a été automatiquement fermé après 24 heures suivant le dernier commentaire. Aucune réponse n’est permise dorénavant.