Nom du virtuel reste affiché

[vince84]

Bonjour à tous.
J’ai crée un widget pour afficher plusieurs icônes en fonction d’une valeur en m’inspirant de celui ci : CommutAutoOnOff_IMG

mon widget fonctionne correctement mais j’ai un problème d’affichage :

dans mon exemple, j’ai le nom de la variable du virtuel qui reste affiché en permanence (StatusVirtuelGarageGauche_Auto)
Je coche masquer le nom mais rien n’y fait ! comment faire pour le faire disparaître ?

merci

[Toms]

Lo,

Va dans la route crantée portant ta variable, onglet affichage et tu décoches Afficher le nom,

Au plaisir, bonne soirée,

[vince84]

Tout est décoché :

il faudrait pas mettre le nom du widget pour cette variable ? si oui le mien n’apparaît pas dans la liste

il est classé dans les widgets tiers de Salvialf :

[Toms]

Si je ne me trompe pas t’es sur ton design, t’as pensé à cocher Masquer le nom ?

[vince84]

oui bien sur c’est décoché.
c’est le seul widget qui pose problème et c’est un que j’ai fait

[Toms]

Lo,

J’appliquerai le widget de Salvialf avec le plugin Pimp my jeedom. T’as la possibilité, je cite : Il est possible d’inclure les images de son choix en plaçant le(s) fichier(s) *.png dans le répertoire /data/img/IconInfo/. . Une fois effectué réitérer l’opération cité au dessus;

[Salvialf]

Salut,

Sans voir le code du widget en question difficile de te guider mais à priori il manque la classe #hide_name# sur la div qui affiche le nom de la commande. C’est ce qui permet de cacher le nom de décochant la case Afficher le nom.

Pour exemple le code correspondant dans un widget core :

<div class="title #hide_name#">
  <span class="cmdName">#name_display#</span>
</div>

[Salvialf]

PS: y’a même directement un bouton dédié sur les widgets qui prennent en charge d’autres images ou polices (cf. la doc du plugin) :

Envoyer une image / Envoyer une police : Pour ajouter des images ou polices d’écriture directement dans le bon répertoire. Ne s’affiche que si l’option est existante sur le widget.

[vince84]

Voici mon code :

<div class="cmd tooltips cmd-widget cursor 3Pos" data-type="action" data-subtype="other" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#">
	<div class="Pos3DivConteneur" >
		<span class="Pos3Name" style="#hideCmdName#">#valueName#<br/></span>
		<span class="Pos3Action"><br/><img class="Pos3Img" style="width: 80px;" src="" /></span>
	</div>
	<script type="text/javascript">
      	jeedom.cmd.update['#id#'] = function(_options){
            $.include(['data/customTemplates/dashboard/cmd.action.other.Commut3Pos_IMG/Pos3.js', 'data/customTemplates/dashboard/cmd.action.other.Commut3Pos_IMG/Pos3.css'], function() {
                var widget = $('div.cmd[data-cmd_uid="#uid#"]');
				var valueType = ('#type#' !='#'+'type#') ? "#type#":"defaut";
				var valueFile = ('#extension#' !='#'+'extension#') ? "#extension#":"png";     
              
                if (Pos3Normalize(_options.display_value.toString()) == 'Pos2') {
					$('.Pos3Img', widget).attr('src','data/customTemplates/dashboard/icones/'+valueType+'_Pos2.'+valueFile);
										
                    if (Pos3Normalize('#name#') == 'Pos0' || Pos3Normalize('#name#') == 'Pos1') {
                        widget.hide();
                    } else {
                      	widget.show();
                    }
                } else if (Pos3Normalize(_options.display_value.toString()) == 'Pos1') {
					$('.Pos3Img', widget).attr('src','data/customTemplates/dashboard/icones/'+valueType+'_Pos1.'+valueFile);
                    if (Pos3Normalize('#name#') == 'Pos0' || Pos3Normalize('#name#') == 'Pos2') {
                        widget.hide();
                    } else {
                     	widget.show(); 
                    }
                } else {
                    $('.Pos3Img', widget).attr('src','data/customTemplates/dashboard/icones/'+valueType+'_Pos0.'+valueFile);
                    if (Pos3Normalize('#name#') == 'Pos1' || Pos3Normalize('#name#') == 'Pos2') {
                        widget.hide();
                    } else {
                     	widget.show(); 
                    }
                }
            });
        }
        
        jeedom.cmd.update['#id#']({display_value:'#state#'});
        $('.cmd[data-cmd_uid=#uid#] .Pos3Action').off().on('click', function () {
            jeedom.cmd.execute({id: '#id#'});
        });        
	</script>
</div>

[Salvialf]

@vince84

<span class="Pos3Name" style="#hideCmdName#">#valueName#<br/></span>

C’est cette ligne qui affiche le nom de la commande info liée.

Si tu ne veux jamais afficher le nom, tu peux supprimer cette ligne.
Sinon, pour que la case Afficher le nom soit fonctionnelle, tu peux remplacer cette ligne par :

  <div class="title #hide_name#">
    <div  class="cmdName">#valueName#</div>
  </div>

[vince84]

Très bien merci beaucoup, cela fonctionne !