Aide pour correction du code d'un widget

Utilisation du core de Jeedom Widgets
, ,
1

Bonjour à tous,

J’ai un widget pour afficher ma consommation d’eau mais l’index ne se met plus à jour depuis mon passage en v.4.4.20 Bookworm. En effet, comme vous pouvez le voir sur les images ci-dessous, l’index du widget n’est pas en phase avec ce qu’indique la commande info :
image

image
image1710×220 19.6 KB

Le code utilisé doit être obsolète (4 ou 5 ans) et je n’en suis pas l’auteur (j’en serais bien incapable).

Donc, si ce n’est pas trop demander, est-ce qu’une âme charitable pourrait m’aider à le corriger ?

<div style="width:140px;min-height : 140px;" class="cmd #history# tooltips cmd-widget conso#id#" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
  <div class="title #hide_name#">
    <div class="cmdName">#name_display#</div>
  </div>
	<div class= "conso_position#id#">
		<img src="data/customTemplates/dashboard/cmd.info.numeric.ConsoEau/CompteurEau.png" class="IMGmeter#id#">
    	<span class="stateint1_conso#id#" id="intNum1Conso#id#"></span> 
    	<span class="stateint2_conso#id#" id="intNum2Conso#id#"></span>
        <span class="stateint3_conso#id#" id="intNum3Conso#id#"></span>
        <span class="stateint4_conso#id#" id="intNum4Conso#id#"></span>
        <span class="statedec1_conso#id#" id="decNum1Conso#id#"></span> 
    	<span class="statedec2_conso#id#" id="decNum2Conso#id#"></span> 
        <span class="statedec3_conso#id#" id="decNum3Conso#id#"></span> 
        <span class="unite_conso#id#" id="unite#id#">#unite#</span>
	</div>
	<div id="gauge#id#" class=" indicator"></div>

<style>
@font-face {
    font-family: "Digital-7";
  	src:	url("data/customTemplates/dashboard/cmd.info.numeric.ConsoEau/font/digital-7.ttf") format("truetype");
  	font-weight:normal;
  	font-style:normal;
}
span.stateint1_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	letter-spacing: 2px;
  	color: Black;
  	position: absolute;
  	top: 55px;
    right: 90px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
  span.stateint2_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	letter-spacing: 2px;
  	color: Black;
  	position: absolute;
  	top: 55px;
    right: 79px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
  span.stateint3_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	letter-spacing: 2px;
  	color: Black;
  	position: absolute;
  	top: 55px;
    right: 68px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
  span.stateint4_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	letter-spacing: 2px;
  	color: Black;
  	position: absolute;
  	top: 55px;
    right: 57px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
span.statedec1_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	color: crimson;
  	position: absolute;
  	top: 55px;
  	right: 40px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
span.statedec2_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	color: crimson;
  	position: absolute;
  	top: 55px;
  	right: 28px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
span.statedec3_conso#id# {
    font-family: "Digital-7"; 
    font-size:30px;
  	color: crimson;
  	position: absolute;
  	top: 55px;
  	right: 16px;
  	transform : scale(0.7,1);
	-webkit-transform:scale(0.7,1); /* Safari and Chrome */
	-moz-transform:scale(0.7,1); /* Firefox */
    -ms-transform:scale(0.7,1); /* IE 9+ */
	-o-transform:scale(0.7,1); /* Opera */
  }
span.unite_conso#id# {
    font-size:12px;
  	font-weight: bold;
  	color: #000;
  	position: absolute;
  	top: 84px;
  	right: 50px;
  }
img.IMGmeter#id# {
  	width: 120px;
  	height: 120px;
}
div.conso#id# {
  	width:140px;
  	min-height : 140px;
}
div.conso_position#id# {
  	float: center; 
  	position: absolute;
  	left: 10px;
  	top: 20px;
}
</style>   
<script>
    jeedom.cmd.update['#id#'] = function(_options){
	var valeur= (_options.display_value);
    var stri = "0000" + Math.floor(valeur/1)
    var xi = stri.length;
    var intNum1 = stri.charAt(xi-4);
    var intNum2 = stri.charAt(xi-3);
    var intNum3 = stri.charAt(xi-2);
    var intNum4 = stri.charAt(xi-1);  
    var strd = "00" + Math.floor(Math.round((valeur/1000 - stri) * 100000)/100);
    var xd = strd.length; 
    var decNum1 = strd.charAt(xd-3);
    var decNum2 = strd.charAt(xd-2);
    var decNum3 = strd.charAt(xd-1); 
  
   $('#intNum1Conso#id#').text(intNum1);
   $('#intNum2Conso#id#').text(intNum2);
   $('#intNum3Conso#id#').text(intNum3);
   $('#intNum4Conso#id#').text(intNum4);
   $('#decNum1Conso#id#').text(decNum1);
   $('#decNum2Conso#id#').text(decNum2);
   $('#decNum3Conso#id#').text(decNum3);
  
  	if ('#petit#' == 1) {
    	$('div.conso#id#').css('width','90px');
      	$('div.conso#id#').css('min-height','80px');
      	$('div.conso_position#id#').css('left','5px');
      	$('span.statedec1_conso#id#').css('font-size','20px');
        $('span.statedec2_conso#id#').css('font-size','20px');
        $('span.statedec3_conso#id#').css('font-size','20px');
       	$('span.statedec1_conso#id#').css('top','36px');
        $('span.statedec2_conso#id#').css('top','36px');
        $('span.statedec3_conso#id#').css('top','36px');
      	$('span.statedec1_conso#id#').css('right','26px');
        $('span.statedec2_conso#id#').css('right','18px');
        $('span.statedec3_conso#id#').css('right','10px');
      	$('span.stateint1_conso#id#').css('font-size','20px');
        $('span.stateint2_conso#id#').css('font-size','20px');
        $('span.stateint3_conso#id#').css('font-size','20px');
        $('span.stateint4_conso#id#').css('font-size','20px');
      	$('span.stateint1_conso#id#').css('top','36px');
        $('span.stateint2_conso#id#').css('top','36px');
        $('span.stateint3_conso#id#').css('top','36px');
        $('span.stateint4_conso#id#').css('top','36px');
      	$('span.stateint1_conso#id#').css('right','59px');
        $('span.stateint2_conso#id#').css('right','52px');
        $('span.stateint3_conso#id#').css('right','45px');
        $('span.stateint4_conso#id#').css('right','38px');
      	$('span.unite_conso#id#').css('font-size','8px');
      	$('span.unite_conso#id#').css('top','55px');
      	$('span.unite_conso#id#').css('right','32px');
      	$('img.IMGmeter#id#').css('width','80px');
      	$('img.IMGmeter#id#').css('height','80px');
    }
$('.cmd[data-cmd_id=#id#]').attr('title','Date de valeur : '+_options.valueDate+'<br/>Date de collecte : '+_options.collectDate)
		}
    jeedom.cmd.update['#id#']({display_value:'#state#',valueDate:'#valueDate#',collectDate:'#collectDate#',alertLevel:'#alertLevel#'});
</script>
</div>

Merci d’avance.

2

Bonsoir à tous,

J’ai fini par trouvé une solution grâce à ce site :

Voici donc un code qui fonctionne :

<div style="width:140px;min-height:140px;" class="cmd #history# tooltips cmd-widget conso#id#" data-type="info" data-subtype="numeric" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#">
  <div class="title #hide_name#">
    <div class="cmdName">#name_display#</div>
  </div>
  <div class="conso_position#id#">
    <img src="data/customTemplates/dashboard/cmd.info.numeric.ConsoEau/CompteurEau.png" class="IMGmeter#id#">
    <span class="stateint1_conso#id#" id="intNum1Conso#id#"></span>
    <span class="stateint2_conso#id#" id="intNum2Conso#id#"></span>
    <span class="stateint3_conso#id#" id="intNum3Conso#id#"></span>
    <span class="stateint4_conso#id#" id="intNum4Conso#id#"></span>
    <span class="statedec1_conso#id#" id="decNum1Conso#id#"></span>
    <span class="statedec2_conso#id#" id="decNum2Conso#id#"></span>
    <span class="statedec3_conso#id#" id="decNum3Conso#id#"></span>
    <span class="unite_conso#id#" id="unite#id#">#unite#</span>
  </div>
  <div id="gauge#id#" class="indicator"></div>

<style>
@font-face {
    font-family: "Digital-7";
    src: url("data/customTemplates/dashboard/cmd.info.numeric.ConsoEau/font/digital-7.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

span[class^="stateint"] {
    font-family: "Digital-7";
    font-size: 30px;
    letter-spacing: 2px;
    color: Black;
    position: absolute;
    top: 55px;
    transform: scale(0.7,1);
    -webkit-transform: scale(0.7,1); /* Safari and Chrome */
    -moz-transform: scale(0.7,1); /* Firefox */
    -ms-transform: scale(0.7,1); /* IE 9+ */
    -o-transform: scale(0.7,1); /* Opera */
}

span.stateint1_conso#id# { right: 90px; }
span.stateint2_conso#id# { right: 79px; }
span.stateint3_conso#id# { right: 68px; }
span.stateint4_conso#id# { right: 57px; }

span[class^="statedec"] {
    font-family: "Digital-7";
    font-size: 30px;
    color: crimson;
    position: absolute;
    top: 55px;
    transform: scale(0.7,1);
    -webkit-transform: scale(0.7,1); /* Safari and Chrome */
    -moz-transform: scale(0.7,1); /* Firefox */
    -ms-transform: scale(0.7,1); /* IE 9+ */
    -o-transform: scale(0.7,1); /* Opera */
}

span.statedec1_conso#id# { right: 40px; }
span.statedec2_conso#id# { right: 28px; }
span.statedec3_conso#id# { right: 16px; }

span.unite_conso#id# {
    font-size: 12px;
    font-weight: bold;
    color: #000;
    position: absolute;
    top: 84px;
    right: 50px;
}

img.IMGmeter#id# {
    width: 120px;
    height: 120px;
}

div.conso#id# {
    width: 140px;
    min-height: 140px;
}

div.conso_position#id# {
    position: absolute;
    left: 10px;
    top: 20px;
}
</style>

<script>
    jeedom.cmd.update['#id#'] = function(_options) {
        var valeur = parseFloat(_options.display_value);
        if (isNaN(valeur)) valeur = 0;

        // Partie entière formatée sur 4 chiffres
        var stri = ("0000" + Math.floor(valeur)).slice(-4);
        var intNum1 = stri.charAt(0);
        var intNum2 = stri.charAt(1);
        var intNum3 = stri.charAt(2);
        var intNum4 = stri.charAt(3);

        // Partie décimale formatée sur 3 chiffres
        var decimalPart = valeur - Math.floor(valeur);
        var strd = ("000" + Math.floor(decimalPart * 1000)).slice(-3);
        var decNum1 = strd.charAt(0);
        var decNum2 = strd.charAt(1);
        var decNum3 = strd.charAt(2);

        $('#intNum1Conso#id#').text(intNum1);
        $('#intNum2Conso#id#').text(intNum2);
        $('#intNum3Conso#id#').text(intNum3);
        $('#intNum4Conso#id#').text(intNum4);
        $('#decNum1Conso#id#').text(decNum1);
        $('#decNum2Conso#id#').text(decNum2);
        $('#decNum3Conso#id#').text(decNum3);

        if ('#petit#' == 1) {
            $('div.conso#id#').css({ 'width': '90px', 'min-height': '80px' });
            $('div.conso_position#id#').css('left', '5px');

            $('span.statedec1_conso#id#, span.statedec2_conso#id#, span.statedec3_conso#id#').css({
                'font-size': '20px',
                'top': '36px'
            });

            $('span.statedec1_conso#id#').css('right', '26px');
            $('span.statedec2_conso#id#').css('right', '18px');
            $('span.statedec3_conso#id#').css('right', '10px');

            $('span.stateint1_conso#id#, span.stateint2_conso#id#, span.stateint3_conso#id#, span.stateint4_conso#id#').css({
                'font-size': '20px',
                'top': '36px'
            });

            $('span.stateint1_conso#id#').css('right', '59px');
            $('span.stateint2_conso#id#').css('right', '52px');
            $('span.stateint3_conso#id#').css('right', '45px');
            $('span.stateint4_conso#id#').css('right', '38px');

            $('span.unite_conso#id#').css({
                'font-size': '8px',
                'top': '55px',
                'right': '32px'
            });

            $('img.IMGmeter#id#').css({
                'width': '80px',
                'height': '80px'
            });
        }

        $('.cmd[data-cmd_id="#id#"]').attr('title', 'Date de valeur : ' + _options.valueDate + '<br/>Date de collecte : ' + _options.collectDate);
    };

    jeedom.cmd.update['#id#']({
        display_value: '#state#',
        valueDate: '#valueDate#',
        collectDate: '#collectDate#',
        alertLevel: '#alertLevel#'
    });
</script>
</div>

image

1 « J'aime »
3

Ce sujet a été automatiquement fermé après 24 heures suivant le dernier commentaire. Aucune réponse n’est permise dorénavant.