[Présentation] Benj29 et blog Jeedom-Facile

Présentation et Vitrine d'installations
319

Bonjour @benj29
Pour moi, je suis plus intéressé par tes nouveaux designs
Merci pour tous ces partages, vraiment très utile pour avancer plus rapidement avec jeedom
Benoit5672

320
  • 1
    les design !
321

Bonjour Benj29,
je suis admiratif de tout le travail que tu fais et le temps que tu passes a nous expliquer et nous aider dans la domotique.
tu nous dis dans un message du 25/02

pourrais tu nous détailler rapidement comment fais tu pour changer la couleur des ouvrants en fonction de la présence ou de l’absence dans ton tableau de suivi des pièces? Je bataille depuis quelques jours dessus, j’ai peut être loupé une étape
merci encore pour le temps que tu passes pour tout ces précieux renseignements
bonne journée
à te lire!

322

Bonjour,
Super travail !
Serait il possible de m’expliquer comment a été réalisé le widget historique des messages ?

image
image1914×1075 738 KB

323

L’historique des messages n’est pas réellement un widget. Il est constitué d’une image de fond sur le design en arrière plan avec un virtuel en avant plan.
L’image de fond (je tiens à préciser que chez moi la pseudo IA s’appelle « Eva »):

image
image1301×556 46.2 KB

Le virtuel:
image
image1356×830 61.9 KB

Voici la configuration du virtuel:

image
image1902×583 67.6 KB

Avec une disposition tableau et quelques commandes css pour personnaliser l’affichage:
image
image1525×870 55.3 KB

le widget utilisé sur chaque commande:

image
image1525×583 39.7 KB

Le contenu du Widget::

<div class="tooltips cmd cmd-widget #history#" data-type="info" data-subtype="string" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#" style="display: block;">
	<center><span style="font-size : 12px;#hideCmdName#" class="cmdName">#name_display#</span> </center>
    <div style="text-align:left"><strong class="state"></strong>
    </div>
	<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);
			if(_options.alertLevel){
			$('.cmd[data-cmd_id=#id#]').removeClass('label label-warning label-danger')
			if(_options.alertLevel == 'warning'){
				$('.cmd[data-cmd_id=#id#]').addClass('label label-warning');
			}else if(_options.alertLevel == 'danger'){
				$('.cmd[data-cmd_id=#id#]').addClass('label label-danger');
			}
			}
		}
		jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
	</script>
</div>

Ensuite à chaque fois qu’un message vocal est diffusé, j’enrichis les données du virtuel dans le scénario, sachant que tous mes messages font toujours appel au même scénario.
Je décale tous mes messages vers le bas et garnit la première ligne avec l’heure + le message passé par tag.

image
image1771×244 41.7 KB

1 « J'aime »
324

Je ne suis pas sûr de comprendre ton problème.

Le code de @noodom travaille sur les options d’un widget. Donc si ton widget n’a pas d’options tu vas chercher longtemps.

Perso, j’utilise le widget info button donné sur ce fil :

Par exemple, j’ai un bouton pour commander le volet. Suivant l’état de la maison je le colorise. Orange s’il est fermé et que nous sommes à la maison, blanc si ouvert est à la maison, rouge si nous sommes absents et ouverts etc.

Pour changer l’attribut couleur, un simple scénario se déclenchant sur l’état du volet ou l’état de la maison… pour changer la couleur.

894×212 6.94 KB

et le scénario qui appelle celui de @noodom

1976×2695 289 KB

Pour info, on peut faire la même chose sur des infos sans ce widget. Je l’utilise.

Un widget qui change d’état en fonction d’une variable passé par les options du widget.

Exemple pour la gestion de l’alarme de la moto où je remonte l’état de l’alarme et le niveau de batterie. Et en fonction couleur si je suis là ou non.

<div class="tooltips cmd cmd-widget #history#" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#" style="display: block;">
	<center>
      <span class="iconCmd"></span><span><strong class="state" style="font-size: 25px;"></strong></span><span class="unite"></span>
  </center>
	<script>
		jeedom.cmd.update['#id#'] = function(_options){
          var state = _options.display_value;
          var cmd = $('.cmd[data-cmd_id=#id#]');
            
		  var alarme = is_numeric('#alarme#') ? parseFloat('#alarme#'):0;
          
          cmd.attr('title','Valeur du '+_options.valueDate+', collectée le '+_options.collectDate);
    
          // alarme = 0 (alarme = 0, online = 1)
          if (alarme == 0) {
            	if (state >= 40) {
                  		// vert car alarme désactivée, vert car en ligne, vert batterie car ok
            	   	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-open-variant" style="color:#30b455;font-size:20px;"></i><div style="font-size:10px;color:#30b455;">#state#<span style="font-size:10px;color:#30b455;">%</span></div>');
				}
            	else {
                  		// orange car alarme requiert attention, rouge var batterie déchargé
                  	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-open-variant" style="color:#ff8c00;font-size:20px;"></i><div style="font-size:10px;color:#da3037;">#state#<span style="font-size:10px;color:#da3037;">%</span></div>');
                }
          }
          // alarme = 1 (alarme = 1, online = 1)
		  else if (alarme == 1) {
            		
		  		if (state >= 40) {
                  		// rouge car alarme activée, vert car batterie OK
            	   	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-check" style="color:#da3037;font-size:20px;"></i><div style="font-size:10px;color:#30b455;">#state#<span style="font-size:10px;color:#30b455;">%</span></div>');
				}
            	else {
                  		// rouge car alarme activée, rouge car batterie déchargée
                  	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-alert" style="color:#da3037;font-size:20px;"></i><div style="font-size:10px;color:#da3037;">#state#<span style="font-size:10px;color:#da3037;">%</span></div>');
                }
          }
          // alarme = 2 (alarme = 1, online = 0)
          else if (alarme == 2) {
		  		if (state >= 40) {
                  		// rouge car alarme activée, vert car batterie ok
            	   	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-question" style="color:#da3037;font-size:20px;"></i><div style="font-size:10px;color:#30b455;">#state#%<span style="font-size:10px;color:#30b455;">%</span></div>');
				}
            	else {
                  	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-question" style="color:#da3037;font-size:20px;"></i><div style="font-size:10px;color:#da3037;">#state#<span style="font-size:10px;color:#da3037;">%</span></div>');
                }
          }
          // alarme = 3 (alarme = 0, online = 0)
          else if (alarme == 3) {
		  		if (state >= 40) {
                  		// vert car alarme désactivée, vert car 
            	   	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-question" style="color:#30b455;font-size:20px;"></i><div style="font-size:10px;color:#30b455;">#state#<span style="font-size:10px;color:#30b455;">%</span></div>');
				}
            	else {
                  	   cmd.find('.iconCmd').empty().append('<i class="Mdi mdi-lock-question" style="color:#30b455;font-size:20px;"></i><div style="font-size:10px;color:#da3037;">#state#<span style="font-size:10px;color:#da3037;">%</span></div>');
                }
          }
		  //cmd.find('.state').empty().append(' '+state);
          //cmd.find('.unite').empty().append(' #unite#');	
          
			if(_options.alertLevel){
			$('.cmd[data-cmd_id=#id#]').removeClass('label label-warning label-danger')
			if(_options.alertLevel == 'warning'){
				$('.cmd[data-cmd_id=#id#]').addClass('label label-warning');
			}else if(_options.alertLevel == 'danger'){
				$('.cmd[data-cmd_id=#id#]').addClass('label label-danger');
			}
			}
		}
		jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
	</script>
</div>

Le widget est un numeric (niveau de la batterie) et je change l’icone en fonction de l’option de l’état de l’alarme.

710×134 2.01 KB

325

Autre solution, utilisez le plugin jeelog très complet et bien paramétrable.
L’idée de @superbricolo est une bonne fifo. J’avoue avoir pensé à l’intégrer sur le design mais comme j’ai un monodesign, j’ai laissé tomber.
Perso, je remonte ce type de notifications dans un télégram dédié sur mon tél.

326

@benj29 tu as pour moi la plus grosse et complète installation domotique que j’ai vu.
Tu as poussé le sujet vraiment loin derrière nous. C’est impressionnant.
Grace à toi, j’en découvre à chacun de tes post.

Pour ton blog, j’attend avec impatience un tuto pour le design et surtout les popup j’ai ça clarifierai pas mal les design :wink:

Dans tout les cas, tous tes articles sont des découvertes du potentiel énorme de la domotique. Tu fait un sacré job !! Grand merci à toi !

1 « J'aime »
327

Oula, c’est gentil !

Mais je suis loin d’avoir une installation poussée. Certains ici ont des installations plus poussées notamment sur l’aspect TTS avec interactions.

Elle fait surtout ce que je lui ai demandée selon ma sensibilité avec un vrai WAF validé au quotidien car madame n’aime surtout pas être embêté par ces trucs et c’est là le but de la domotique ; rendre la vie plus simple.

Alors c’est sûr que quand une update de plugin fait pêter une prise Xiaomi sans changelog on apprécie le sérieux ou pas ! :smiley: (allez… je rigole ! rigueur ou pas…).

A mes yeux, les travaux de @dJuL (JPI permet tellement sur mon installation), @superbricolo (sans suivi conso… va faire de beaux rapports de suivi ou amortissement), @revlys (et mes PI pour récupérer tous les compteurs, contacts dans le jardin etc) viennent compléter magnifiquement le travail de l’équipe Jeedom qui permet de mettre un outil assez facile à appréhender. Après, il y a tellement de possibilités pour faire les choses ; tellement de solutions…

3 « J'aime »
328

Bonjour Benj29,
merci encore pour toutes ces explications très claires
bonne journée

1 « J'aime »
329

Je vois qu il y a beaucoup d infos sur une seul page de l ecran de la tablette.
Quel résolution utilises tu pour quelle taille d écran ?
Beau travail.

330

1024x600 de mémoire.
Après c’est lisible sans lunette face à la tablette.
Je l’explique sur le blog. Je passe par le site screenresolution.

Merci !

331

Merci, j’ai utilisé ce site pour établir la résolution de ma tablette.
Ce que je ne comprend pas c’est que ce site m’indique une résolution de 1280 x 800 alors que sur la fiche technique c’est une 2560 x 1600 (Samsung Galaxy tab S).

332

C’est la résolution max de la tablette.
Tu peux jouer des dpi et de la résolution au besoin

android - how to use adb to change resolution of device - Stack Overflow

333

Salut Benj, Merci pour l’article sur l’alarme,
Je le trouve très instructif et très bien construit,
Je vois que tu as mis en place le widget digicode pour ton ancienne version v3,
Aurais-tu le code et fichiers à mettre à disposition pour la V4 depuis ton article ?
Encore merci pour ton partage et à très bientôt dans un nouvel article :slightly_smiling_face:

1 « J'aime »
334

Bonjour,

Je suis en train de finaliser l’article pour la piscine, sa gestion et l’iopool. Il est clair qu’il n’intéressera pas tout le monde, mais il y a quand même quelques idées à prendre pour l’automatisation notamment avec Android.

Merci en tout cas pour tes commentaires. Oui, pour le digicode, j’avoue avoir galéré, je m’étais même rabattu sur celui développé par @tomitomas ; mais bien trop complet et lourd pour un « pauvre » digicode comme je l’utilise le matin au réveil.

Attention à bien positionner les fichiers dans un répertoire non-core car en cas d’update, vous les perdez !

Le widget est à créer en mode code.

<div class="cmd cmd-widget reportModeHidden" data-type="action" data-subtype="message" data-template="default" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
  <script>
    $.include([ '/data/fonts/Digicode/digicode.css',
                '/data/fonts/Digicode/digicode.js' ],
      function() {
        $('div.cmd[data-cmd_id="#id#"]').digicode(function(fct, code) {
          jeedom.cmd.execute({
            id: '#id#',
            value: { title : fct, message: code }
          });
        }, 4);
      }
    );
  </script>
</div>

1274×364 38.5 KB

Et le code js et le code css , personnellement j’ai mis ici :

Attention, j’ai modifié les codes pour mon installation : polices, couleurs, tailles.

digicode_css.txt (1,4 Ko) digicode_js.txt (2,4 Ko)

Attention, supprimer l’extension .txt et le _extension à passer en .extension.

J’ai prévu de faire une grosse mise à jour du blog en V4 mais après la publication de l’article des designs en V4 et celui de la piscine.

Il faut créer un virtuel :

1914×260 59.5 KB

value_digicode en information est utilisé par un scénario de désactivation sans aucun déclencheur :

digicode est une info qui lance LE scénario :

1487×144 11.4 KB

1971×1154 253 KB

1 « J'aime »
335

Merci pour ta réponse et ton partage,

Bonne journée,

336

J’ai édité mon message :wink:

337

C’est parfait, merci, bonne journée,

DigiCODE

1 « J'aime »
338

Et voilà, nouvel article sur la gestion de la piscine, la filtration, l’iopool Eco etc

https://www.jeedom-facile.fr/index.php/2021/06/03/une-gestion-de-piscine-simple-et-efficace/

Quelques principes avec le Sonoff, le parfait Jeedouino de @revlys et la pierre angulaire JPI de @dJuL.
Je m’appuie sur Macrodroid et Automate, tellement pratique.

Bonne lecture !

Eléments de réflexion pour une installation domotique :

Catégorie sécurité :

Catégorie interactions :

Catégorie automatisation :

Catégorie autres :

Le matériel et sa configuration nécessaire pour une installation domotique :

L’installation et la configuration d’un hyperviseur permettant la virtualisation :

Les machines virtuelles :

Je n’avance pas comme je le souhaite mais peu à peu le blog se remplit…

7 « J'aime »