Affichage de la consigne et des boutons « plus » et « moins » pour thermostat

En réponse à un commentaire sur mon design, je vais détailler du mieux possible comment afficher la consigne du thermostat, ainsi que l’affichage et l’utilisation d’un bouton « plus » et « moins » pour modifier la consigne de 0.5 °C dans mon cas.

Pour cet article, il vous faudra acheter et installer le plugin Thermostat ainsi que le plugin Widget.

Afficher la consigne :

Pour l’affichage de la consigne, j’ai utilisé le Widget « dashboard.info.numeric.Cercle_Temperature » développé par Sartog.

Je l’ai donc appliqué à l’affichage de la consigne de chaque thermostat (Configuration de la commande Consigne) :

Plus qu’à ajouter la commande à son Design !

Afficher les boutons « Plus » et « Moins » :

Ici deux opérations sont à faire.

La première consiste à créer un mode nommé « plus » et un second nommé « moins » dans le plugin thermostat :

Il faut indiquer dans le champ valeur que l’on souhaite ajouter ou soustraire 0.5 °C au thermostat en cours : #[monthermostat][Consigne]#+0.5 ou #[monthermostat][Consigne]#0.5

La seconde opération consiste à utiliser un Widget que j’ai crée moi-même dont je vais partager le code.

J’ai donc crée un Widget nommé « Plus_Moins » :

<—————– code à copier coller —————–>

<div style="width:60px; height:50px; " class="cmd reportModeHidden cmd-widget" data-type="action" data-subtype="other" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#">
<a class="btn btn-sm action cmdName tooltips" title="#name#" style="border-color:rgba(0,0,0,0)!important"></a>
<!-- Ne Pas Supprimer -->
<script class="createWidgetInfo" type="text/javascript">//<![CDATA[{"type":"1","version":"1","image1":"moins.png","image2":"plus.png"}]]></script>
<!-- Ne Pas Supprimer -->
<script>
var srcImgPlus = 'plugins/widget/core/template/dashboard/cmd.action.other.Plus_Moins/plus.png';
var srcImgMoins = 'plugins/widget/core/template/dashboard/cmd.action.other.Plus_Moins/moins.png';
var taille = 'widht=40px height=40px';

if(jeedom.cmd.normalizeName('#name#') == 'plus'){
$('.cmd[data-cmd_uid=#uid#] .btn').append('<img src="'+srcImgPlus+'" '+taille+'>');
}
if(jeedom.cmd.normalizeName('#name#') == 'moins'){
$('.cmd[data-cmd_uid=#uid#] .btn').append('<img src="'+srcImgMoins+'" '+taille+'>');
}
$('.cmd[data-cmd_uid=#uid#]:last .action').on('click', function () {
jeedom.cmd.execute({id: '#id#'});
});
</script>
</div>

<—————– fin du code à copier coller —————–>

Il faut y ajouter les fichiers plus.png et moins.png en cliquant sur le bouton « Fichiers » en haut de la configuration du Widget.

https://www.monjeedom.fr/wp-content/uploads/2018/12/plus.png
https://www.monjeedom.fr/wp-content/uploads/2018/12/moins.png

Il reste plus qu’à appliqué ce Widget « Plus_Moins » sur les commandes « plus » et « moins » de vos modes du thermostat.

J’ai crée cet article en réponse d’un commentaire et ai fait au plus vite pour donner une réponse qui je l’espère sera assez claire. Je reviendrai certainement sur cet article pour y apporter des précisions si nécessaire.

N’hésitez pas à commenter

Auteur de l’article : Vivien

6 commentaires sur “Affichage de la consigne et des boutons « plus » et « moins » pour thermostat

    Stéf

    (24 décembre 2018 - 15 h 37 min)

    Bonjour et merci.

    J’ai un problème avec les boutons, il me semble que le code à copier comporte des erreurs

    Pourriez vous vérifier

    Merci et joyeux noël

    Vivien

    (26 décembre 2018 - 13 h 22 min)

    Bonjour,
    Je viens de modifier l’affichage du code. Effectivement en copiant collant celui sur le site ça ne fonctionnait pas. La mise en forme avait supprimé les guillemets et d’autres choses.
    Plus qu’à réessayer ^^
    Bonne fêtes

    Stéf

    (29 décembre 2018 - 17 h 13 min)

    Bonjour,

    Merci beaucoup c’est ok

    Bon réveillon !

    pierre

    (20 octobre 2020 - 21 h 02 min)

    Bonjour,

    Est il possible d’adapter les boutons + et – a jeedom v4 ?

    Merci

      Vivien

      (20 octobre 2020 - 21 h 09 min)

      Bonjour,
      Je m’y suis pas penché car j’ai migré sur V4 et ça a gardé mon affichage.
      Je pense qu’il est possible de l’adapter pour la V4 en utilisant la création de widget désormais intégrée dans jeedom.
      J’essaie de vérifier ça demain et je détaillerai comment faire dans l’article.

        Vivien

        (20 octobre 2020 - 22 h 52 min)

        Il est possible de charger le code que j’ai donné dans « outils », « widgets », bouton « code » et « nouveau ».
        Il suffira ensuite de placer les images sur le serveur et d’indiquer le chemin des images aux valeures « srcImgPlus » et « srcImgMoins ».

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.