Personnalisation d'un widget et blocage d'une action

[Pierro]

Bonjour à tous,
Afin de le placer dans un design, je souhaite faire un widget qui me permette d’afficher l’état d’une lumière.
La particularité de ce widget, c’est que je voudrais qu’il réagisse au clic pour éteindre la lumière (donc lorsque l’image de l’ampoule allumée est affichée) mais qu’il ne réagisse pas au clic pour l’allumage de la lumière.
En somme, qu’il soit juste une info quand la lumière est éteinte (affiche une ampoule éteinte et sans réaction au clic) mais qu’il soit une « action » lorsque la lumière est allumée (pour justement me permettre de l’éteindre)
Avez-vous une idée de comment je peux arriver à mes fins?
Merci!

[anon53349806]

Oui en gros

je voudrais qu’il réagisse au clic mais qu’il ne réagisse pas au clic

Donc a part afficher l’etat et un bouton of…

[Bben]

Salut Pierro,

Plusieurs solution potentielle, quelle version de jeedom? Tu te sent pour un widget « code »?

[Pierro]

Salut @Bben,
Je suis en v4.
Si la solution la plus simple passe par un widget code, why not! Je n’ai pas encore exploré cette partie la!

[Bben]

tiré de mon escarcelle, pour des images [edit modifié à la volée, il peut subsister qques coquilles]

<div class="cmd cmd-widget" data-type="action" data-subtype="other" data-cmd_id="#id#" data-template="UniSens" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
  <div class="content-xs">
    <a class="action cmdName tooltips" title="#name#">
      <span class="iconCmd"></span>
    </a>
  </div>
  <script>
    jeedom.cmd.update['#id#'] = function(_options){
      if (_options.display_value == 1) {
          $('.cmd[data-cmd_id=#id#] .iconCmd').empty().append('<img src=#imgOnUrl#>');	
      } else {
        $('.cmd[data-cmd_id=#id#] .iconCmd').empty().append('<img src=#imgOffUrl#>');		
      }
    }
    jeedom.cmd.update['#id#']({display_value:'#state#'});
    $('.cmd[data-cmd_uid=#uid#] .action').off().on('click', function () {
      if (jeedom.cmd.normalizeName('#name#') == 'off'){jeedom.cmd.execute({id: '#id#'});}
    });
    if ($('.cmd[data-cmd_uid=#uid#]').last().prev().data('subtype') != undefined && $('.cmd[data-cmd_id=#id#]').last().prev().data('subtype') != 'other'
    && $('.cmd[data-cmd_uid=#uid#]').last().prev().css('display') != 'block') {
      $('.cmd[data-cmd_uid=#uid#]').last().prepend('<br/>');
    }
  </script>
</div>

imgOnUrl et imgOffUrl sont les url des fichiers images on et off, tu les passes directement dans l’affichage du widget

A appliquer sur la commande Off, et ne pas afficher la commande On

[Pierro]

@Bben, je me suis insipiré de ta réponse et j’ai trouvé des templates sur la doc officielle et j’ai pu avancer mais me reste encore un point qui nécessite de l’aide…
Mon virtuel est composé de 3 commandes:

• ETAT_GENERAL de type info binaire qui est calculé en fonction de l’état de tout un tas d’équipements. Il correspond à l’état d’allumage des lumières de mon RDC. Si au moins une ampoule est allumée, je suis à 1. Si tout est éteint, je suis à 0. (on peut allumer une lumière sans passer par jeedom…)

• ON de type action qui allume toutes les lumières du RDC

• OFF de type action qui éteint toutes les lumières du RDC

Mon widget devra me présenter une ampoule (allumée ou éteinte en fonction de ETAT_GENERAL) et cliquable uniquement si l’ampoule est allumée afin de pouvoir éteindre toutes les lumières…
L’idée est de ne pas afficher ETAT_GENERAL dans le widget et d’appliquer mon widget perso sur les commandes ON/OFF

Voilà où j’en suis:

<div class="cmd cmd-widget cursor" data-type="action" data-subtype="other" data-template="tmplicon" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
  <div class="title #hide_name#">
    <div  class="cmdName">#valueName#</div>
  </div>
  <div class="content-sm ">
    <span class="iconCmd"></span>
  </div>
  <div class="value">
    <span class="timeCmd#uid# timeCmd label label-default value"></span>
  </div>
  <script>
    jeedom.cmd.update['#id#'] = function(_options){
      var cmd = $('.cmd[data-cmd_id=#id#]');
      if('#_time_widget_#' == '1'){
        jeedom.cmd.displayDuration(_options.valueDate,  cmd.find('.timeCmd'));
      }else{
        cmd.find('.timeCmd').parent().remove();
      }
      if (_options.display_value == '1' || _options.display_value >= 1 || _options.display_value == '99' || _options.display_value == 'on') {
        if (jeedom.cmd.normalizeName('#name#') == 'on') {
          cmd.hide();
        }else{
          cmd.show();
          cmd.find('.iconCmd').empty().append("<img src='./plugins/pimpJeedom/core/template/dashboard/cmd.info.binary.IconInfo/ampoule1_on.png'/>");
        }
      } else {
        if (jeedom.cmd.normalizeName('#name#') == 'off') {
          cmd.hide();
        }else{
          cmd.show();
          cmd.find('.iconCmd').empty().append("<img src='./plugins/pimpJeedom/core/template/dashboard/cmd.info.binary.IconInfo/ampoule1_off.png'/>");
        }
      }
    }
    jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
    $('.cmd[data-cmd_uid=#uid#] .iconCmd').off().on('click', function () {
      /* if( ETAT_GENERAL == 1 ) { */
        jeedom.cmd.execute({id: '#id#'});
     /* }*/
    });
  </script>
</div>

A la fin du code et afin de pouvoir bloquer l’action du clic si les lumières sont toutes éteintes (ETAT_GENERAL à 0), je souhaiterais pouvoir récupérer au sein de mon équipement ( #eqLogic_id#) la valeur de la commande qui s’appelle ETAT_GENERAL
Mais je ne sais pas comment m’y prendre avec les fonctions JS existantes…
Vous pouvez m’aider?
En gros, il me faut une fonction qui me retourne pour l’équipement dont le logical_ID est XXX, la valeur de la commande dont le nom est YYY…

[Pierro]

Finalement, je n’ai pas utilisé la commande ETAT_GENERAL

Voici ce que j’ai fait et cela fonctionne:

  if(jeedom.cmd.normalizeName('#name#') == 'off'){
        jeedom.cmd.execute({id: '#id#'});
      }