Yop !
Il était sérieusement temps de le revoir ce widget !
Voici donc le nouveau code compatible V4:
<div style="width:300px;min-height : 300px;" class="Test-#id# cmd tooltips cmd-widget #history#" 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>
<span class="led_cligno#id#"></span>
<span class="IMGmeter#id#"><img src="plugins/widget/core/template/dashboard/cmd.info.numeric.Compteur_EDF_LedAnimated-PoLo/compteur_elec_256.png"></span>
<span class="result_conso#id#"></span>
<span class="unite_conso#id#">#unite#</span>
<style>
@font-face {
font-family: "Digital-7";
src: url("plugins/widget/core/template/dashboard/cmd.info.numeric.Compteur_EDF_LedAnimated-PoLo/font/digital-7.ttf") format("truetype");
font-weight:normal;
font-style:normal;
}
span.led_cligno#id# {
width: 20px;
height: 20px;
background: red;
-webkit-animation: mymove 2s infinite; /* Chrome, Safari, Opera */
animation: mymove 2s infinite;
position: absolute;
top: 130px;
left: 75px;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
from {background-color: red;}
to {background-color: grey;}
}
span.IMGmeter#id# {
position: absolute;
top: 22px;
left: 22px;
width: 256px;
height: 256px;
}
span.result_conso#id# {
font-family: "Digital-7";
font-size:38px;
letter-spacing: 5px;
color: black;
width: 100px;
height: 50px;
position: absolute;
text-align: right;
top: 127px;
right: 55px;
width:100%;
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-family: "Digital-7";
font-size:20px;
letter-spacing: 5px;
color: black;
width: 100px;
height: 50px;
position: absolute;
text-align: right;
top: 179px;
right: 88px;
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 */
}
</style>
<script>
jeedom.cmd.update['#id#'] = function(_options){
$('.cmd[data-cmd_id=#id#] .result_conso#id#').text(_options.display_value);
$('.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>
A intégrer de la même manière que le précédent dans le fichier cmd.action.color.circle.html