AIDE sur Widget numeric

[jax24fr]

Bonsoir a tous,

J'ai crée un widget Poubelle qui change d'état en fonction d'une variable

• - Poubelles vertes
  - Poubelles grises
  - OK

Le pb est que j'ai toujours la valeur qui est affichée a coté alors que je ne voudrais voir que l'icone.
Pouvez vous me dire ce que je dois modifier dans le code du widget ?
Pour info j'ai crée le widget via le plugin directement

Screenshot 2019-01-10 at 21.04.37.png (104.46 Kio) Consulté 920 fois

Le code

Code : Tout sélectionner

<div style="min-width:120px; min-height:80px;" class="cmd tooltips cmd-widget cursor container-fluid" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#">
	<center>
		<div style="font-weight: bold;font-size : 12px;#hideCmdName#">#name_display#</div>
		<span style="font-size: 2.5em;" class="iconCmd"></span>
		<div style="display:inline-block;">
			<span style="font-weight: bold;" class="pull-right">#unite#</span>
			<span style="font-size: 2em;font-weight: bold;" class="pull-right state"></span>
		</div>
		<div style="#displayHistory# font-size: 0.8em;" class="col-xs-12 center-block">
			<span title="Min" class="tooltips">#minHistoryValue#</span>|<span title="Moyenne" class="tooltips" >#averageHistoryValue#</span> | <span title="Max" class="tooltips">#maxHistoryValue#</span> <i class="#tendance#"></i>
		</div>
	</center>
<!-- Ne Pas Supprimer -->
	<script class="createWidgetInfo" type="text/javascript">//<![CDATA[{"type":"1","version":"1","size":"2.5","min":["0","50","52"],"max":["49","51","100"],"images":["poubok.png","poubdechets.png","poubvertes.png"]}]]></script>
<!-- Ne Pas Supprimer -->
	<script>
   var srcImg = 'plugins/widget/core/template/dashboard/cmd.info.numeric.Poubelles/';
	var iconUpdate = function (state){
		$('.cmd[data-cmd_uid=#uid#] .iconCmd').empty();
		if (state >= 0 && state <= 49) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubok.png">');
		}
		if (state >= 50 && state <= 51) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubdechets.png">');
		}
		if (state >= 52 && state <= 100) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubvertes.png">');
		}
		$('.cmd[data-cmd_uid=#uid#] .state').text(state);
	};
	jeedom.cmd.update['#id#'] = function(_options){
		$('.cmd[data-cmd_uid=#uid#]').attr('title','Valeur du '+_options.valueDate+', collectée le '+_options.collectDate)
		iconUpdate(_options.display_value);
	}
	jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
	</script>
</div>

Merci pour votre aide

[cadavor]

Commentes la ligne :

Code : Tout sélectionner

//$('.cmd[data-cmd_uid=#uid#] .state').text(state);

[jax24fr]

Merci ), je ne pensais pas avoir une réponse dès ce soir
je testerais demain !

[jax24fr]

Nickel,

Attention je vais chipotter.
J'ai l'impression que c'est pas réellement bien "au milieu"

Tu en penses quoi .

Screenshot 2019-01-11 at 21.02.33.png (78.46 Kio) Consulté 715 fois

[cadavor]

En effet, petit coup de nettoyage :

Code : Tout sélectionner

<div style="min-width:120px; min-height:80px;" class="cmd tooltips cmd-widget cursor container-fluid" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#">
	<center>
		<div style="font-weight: bold;font-size : 12px;#hideCmdName#">#name_display#</div>
		<span style="font-size: 2.5em;" class="iconCmd"></span>
		<div style="#displayHistory# font-size: 0.8em;" class="col-xs-12 center-block">
			<span title="Min" class="tooltips">#minHistoryValue#</span>|<span title="Moyenne" class="tooltips" >#averageHistoryValue#</span> | <span title="Max" class="tooltips">#maxHistoryValue#</span> <i class="#tendance#"></i>
		</div>
	</center>
<!-- Ne Pas Supprimer -->
	<script class="createWidgetInfo" type="text/javascript">//<![CDATA[{"type":"1","version":"1","size":"2.5","min":["0","50","52"],"max":["49","51","100"],"images":["poubok.png","poubdechets.png","poubvertes.png"]}]]></script>
<!-- Ne Pas Supprimer -->
	<script>
   var srcImg = 'plugins/widget/core/template/dashboard/cmd.info.numeric.Poubelles/';
	var iconUpdate = function (state){
		$('.cmd[data-cmd_uid=#uid#] .iconCmd').empty();
		if (state >= 0 && state <= 49) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubok.png">');
		}
		if (state >= 50 && state <= 51) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubdechets.png">');
		}
		if (state >= 52 && state <= 100) {
			$('.cmd[data-cmd_uid=#uid#] .iconCmd').html('<img style="display: inline-block;" src="'+srcImg+'poubvertes.png">');
		}
	};
	jeedom.cmd.update['#id#'] = function(_options){
		$('.cmd[data-cmd_uid=#uid#]').attr('title','Valeur du '+_options.valueDate+', collectée le '+_options.collectDate)
		iconUpdate(_options.display_value);
	}
	jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
	</script>
</div>

P.S : je n'ai pas testé...

[jax24fr]

Merci bcp , c'est Ok