Refresh d'un virtuel sur un design

En effet j’ai appliqué un widget sur les commandes, comme à chaque fois. Je ne savais même pas qu’il y avait une autre option pour arriver à la même chose.

Je vais tenter de trouver l’autre façon de faire, là comme ça je vois pas bien.

Salut,

Si les infos ne se mettent pas à jour automatiquement c’est que le widget n’est pas correctement codé. Le scénario n’y changera rien.

Quel est le code de ton widget? Avec un widget core c’est ok?

@Salvialf, il s’agit du widget ConsoIMG
J’ai tenté de repasser en widget core et ça ne refresh pas mieux alors que sur le dashboard on voit que le plugin Ecocompteur Legrand refresh bien les données, lui.

J’ai finalement le même problème sur mon design avec le widget IconAction (ton dev). La marche forcée d’un éclairage déclenche bien l’action mais la vignette ne bascule pas de on à off et il faut que je recharge la page de design pour voir le changement d’état.

ça serait un problème avec le design ?

Du navigateur sur la tablette je pense surtout! Ça me le fait sur ma vieille galaxy tab2… un reboot (de la tablette) et c’est reparti pour quelques temps!

@Salvialf : Ah bha oui ! J’avais le même soucis sur mon navigateur PC du coup je ne me suis pas méfié, en redémarrant le navigateur c’est rentré dans l’ordre coté PC pour les widget core du coup je vais redémarrer le navigateur sur la tablette, merci !

Bon par contre ça ne règle pas le soucis du widget qui est mal developpé pour cette partie refresh du coup et je ne comprend pas l’astuce de @noBru77pour contourner. Appliquer le widget sur tout le virtuel ??

Je sais pas j’ai pas trop suivi mais le code V3 à jour de consoIMG se trouve ici:

…ainsi que sur plusieurs autres posts sur l’ancien forum :laughing:

Ah, cool :slight_smile:

Par contre c’est décalé, je vais regardé sur le post s’il y a une solution
image

Bon alors je n’ai pas compris, je suis obligé de corriger les valeurs comme ça :
span.stateint_conso#id# {
top: 40px;
right: 25px;
}

span.statedec_conso#id# {
top: 40px;
}

Le pire c’est que pour avoir le même décalage vers la droite, il a fallut que je passe à right: 30px; pour la PAC et non 25 comme pour le Total. Tu y comprends quelques chose ?

image

Sûrement à cause de la chasse de la police d’écriture… J’ai été ennuyé avec ça aussi quand j’ai refait des widgets similaires pour la V4:

Il y a deux manières de mettre une commande info sur un design:

  1. On ajoute la commande info de l’équipement.
  2. On ajoute l’équipement.

Dans le 1, je n’ai pas de rafraîchissement auto. Dans le 2, du moins chez moi, le rafraîchissement auto fonctionne. Mais je me retrouve avec toutes les autres commandes de l’équipement.
Alors, j’ai créé des virtuels avec uniquement une commande info par virtuel, puis j’ai ajouté l’équipement virtuel à mon design. Et là, ça marche chez moi. Je sais, c’est lourd. Mais pas le choix. J’ai essayé de refaire le code du widget au propre, mais ça ne marche pas toujours.

Un autre point à garder en tête est de vider le cache du navigateur. Parfois, il reste dans le cache des bouts de fichiers qui empêchent le rafraîchissement.

Salut @noBru77,

T’es en V3 ou V4 ? Car j’ai souvent constaté des bugs sur l’ajout d’une commande seule sur le design mais n’ai à priori pas constaté de problème de rafraîchissement automatique.

Avec un widget core c’est pareil?

Je suis en v3. Non pas de soucis avec un widget core.

Donc c’est le code du widget tiers auquel il doit manquer quelque chose…
Si t’as un exemple je veux bien y jeter un coup d’oeil si tu veux

1 « J'aime »

Voici un exemple de code du widget gaugeIMG qui ne se rafraichis pas comme il faut.

<div class="cmd #history# tooltips cmd-widget gaugeIMG#id#" data-type="info" data-subtype="numeric" data-cmd_id="#id#" title="#collectDate#">
	<span class='cmdName' style="font-weight: bold;font-size : 12px;">#name#</span>
		<div class="gaugeIMGdisplay#id#">
			<img src="plugins/widget/core/template/dashboard/cmd.info.numeric.gaugeIMG/fondGreen.png" class="IMGgauge#id#" alt="Fond" >
          	<span class="minvalue_gauge#id#">#minValue#</span>
			<span class="maxvalue_gauge#id#">#maxValue#</span>
          	<span class="midvalue_gauge#id#" id=midvalue#id#></span>
          	<span class="quartvalue_gauge#id#" id=quartvalue#id#></span>
          	<span class="troisquartvalue_gauge#id#" id=troisquartvalue#id#></span>
    		<span class="state_gauge#id#">#state#</span> 
    		<span class="unite_gauge#id#">#unite#</span>
		</div>
		<div id="gauge#id#" class=" indicator"></div>

<style>
@font-face {
    font-family: "Digital-7";
  	src:	url("plugins/widget/core/template/dashboard/cmd.info.numeric.gaugeIMG/font/digital-7.eot") format("eot"),
      		url("plugins/widget/core/template/dashboard/cmd.info.numeric.gaugeIMG/font/digital-7.ttf") format("truetype"),
      		url("plugins/widget/core/template/dashboard/cmd.info.numeric.gaugeIMG/font/digital-7.svg") format("svg");
  	font-weight:normal;
  	font-style:normal;
}
 
span.state_gauge#id# {
    font-family: "Digital-7"; 
    font-size:22px;
  	position: absolute;
  	top: 76px;
  	right: 32px;
  	transform : scale(0.9,1);
	-webkit-transform:scale(0.9,1); /* Safari and Chrome */
	-moz-transform:scale(0.9,1); /* Firefox */
    -ms-transform:scale(0.9,1); /* IE 9+ */
	-o-transform:scale(0.9,1); /* Opera */
  }
  
span.unite_gauge#id# {
    font-size:9px;
  	color: #F0F0F0;
  	position: absolute;
  	top: 66px;
  	right: 56px;
  }

span.minvalue_gauge#id# {
    font-size: 0.5em;
  	font-weight: bold;
  	color: #F0F0F0;
  	position: absolute;
  	top: 68px;
  	left: 25px;
  }

span.maxvalue_gauge#id# {
    font-size: 0.5em;
  	font-weight: bold;
  	color: #F0F0F0;
  	position: absolute;
  	top: 68px;
  	right: 25px;
  }  

span.midvalue_gauge#id# {
    font-size: 0.5em;
  	font-weight: bold;
  	color: #F0F0F0;
  	position: absolute;
  	top: 20px;
  	left: 46%;
  }
  
span.quartvalue_gauge#id# {
    font-size: 0.5em;
  	font-weight: bold;
  	color: #F0F0F0;
  	position: absolute;
  	top: 38px;
  	left: 27px;
  }

span.troisquartvalue_gauge#id# {
    font-size: 0.5em;
  	font-weight: bold;
  	color: #F0F0F0;
  	position: absolute;
  	top: 38px;
  	right: 27px;
  }

img.IMGgauge#id# {
	width: 120px;
  	height: 120px;
}
  
div.gaugeIMG#id# {
  	width:140px;
  	min-height : 140px;
}

div.gaugeIMGdisplay#id# {
  	float: center; 
  	position: absolute;
  	left: 10px;
  	top: 20px;
}
  
#gauge#id# {
    position: absolute;
    width:75px;
    height:75px;
    background : url("./plugins/widget/core/template/dashboard/cmd.info.numeric.gaugeIMG/center.png") no-repeat scroll center transparent;
    left:31px;
    top:40px;
    -webkit-transform: rotate(0deg);
}
</style>

  

<script>         
    angle = Math.round( (#state#/#maxValue#) * 220 );
	
    midvalue = #minValue# + Math.round( ( (#maxValue# - #minValue#) / 2) );
    quartvalue = #minValue# + Math.round( ( (#maxValue# - #minValue#) /4 ) );
    troisquartvalue = #minValue# + Math.round( ( (#maxValue# - #minValue#) * (3/4) ) );

    $('#midvalue#id#').text(midvalue);
	$('#quartvalue#id#').text(quartvalue);
	$('#troisquartvalue#id#').text(troisquartvalue);
                          
	$('#gauge#id#.indicator').css( {'-webkit-transform':'rotate('+angle+'deg)','-moz-transform':'rotate('+angle+'deg)','-ms-transform':'rotate('+angle+'deg)','-o-transform':'rotate('+angle+'deg)','transform':'rotate('+angle+'deg)'});

	if ('#petit#' == 1) {
    	$('div.gaugeIMG#id#').css('width','90px');
      	$('div.gaugeIMG#id#').css('min-height','90px');
      	$('div.gaugeIMGdisplay#id#').css('left','5px');
      	$('span.state_gauge#id#').css('font-size','16px');
      	$('span.state_gauge#id#').css('top','50px');
      	$('span.state_gauge#id#').css('right','20px');
      	$('span.unite_gauge#id#').css('font-size','5px');
      	$('span.unite_gauge#id#').css('top','47px');
      	$('span.unite_gauge#id#').css('right','37px');
      	$('span.minvalue_gauge#id#').css('font-size','0.3em');
      	$('span.minvalue_gauge#id#').css('top','46px');
      	$('span.minvalue_gauge#id#').css('left','15px');      
      	$('span.maxvalue_gauge#id#').css('font-size','0.3em');
      	$('span.maxvalue_gauge#id#').css('top','46px');
      	$('span.maxvalue_gauge#id#').css('right','15px');      
      	$('span.midvalue_gauge#id#').css('font-size','0.3em');
      	$('span.midvalue_gauge#id#').css('top','13px');
      	$('span.midvalue_gauge#id#').css('right','40px');      
      	$('span.quartvalue_gauge#id#').css('font-size','0.3em');
      	$('span.quartvalue_gauge#id#').css('top','25px');
      	$('span.quartvalue_gauge#id#').css('left','19px');      
      	$('span.troisquartvalue_gauge#id#').css('font-size','0.3em');
      	$('span.troisquartvalue_gauge#id#').css('top','25px');
      	$('span.troisquartvalue_gauge#id#').css('right','19px');      
      	$('#gauge#id#').css('width','48px');
      	$('#gauge#id#').css('height','48px');
      	$('#gauge#id#').css('left','21px');
      	$('#gauge#id#').css('top','35px');
      	$('img.IMGgauge#id#').css('width','80px');
      	$('img.IMGgauge#id#').css('height','80px');
    }
  
  
</script>
</div>  

Ah oui le code est bien obsolète. J’ai repris ce widget V3 | V4:
https://www.jeedom.com/forum/viewtopic.php?t=45026

Juste en V4 je dois revoir le code car l’aiguille se décale en n’affichant pas le nom de la commande et le tout mérite d’être optimisé. Je dois lui créer un post dédié sur ce forum très bientôt

Il doit manquer qqpart un
jeedom.cmd.update

,-)

Merci. Je vais y jeter un œil à tête reposée.

Juste pour passer ce sujet en résolu il y avait donc 2 problèmes (merci Salvialf) :

  • Le navigateur qui avait décidé de faire grève : fermeture/ouverture
  • Le widget qui n’était pas correctement développé pour le refresh auto
1 « J'aime »

C’est marrant ça ressemble aux réponses que je t’ai donné. Ah bah oui la solution était déjà dans mes messages au dessus…

Salut Salvialf, je sais bien mais les 2 informations étant disséminées dans 2 messages il m’a semblé plus malin de faire un post de récapitulatif pour indiquer tes 2 solutions afin d’aider d’autres personnes.

J’ai changé le post pour te citer, le but n’étant pas de montrer que j’avais moi même trouver ce qui n’allait pas.

J’espère qu’il n’y a pas de concours du nombre de personnes qui trouvent les solutions :wink: