Widget VMC en APNG

Bonsoir,

A la recherche d’un icon de VMC sur internet, je suis tombée sur un fichier type « apng» compatible avec les explorateurs Safari et Chrome. Ceux sont des fichiers animés dans le même type que GIF mais sous le format PNG. J’ai eu la curiosité de les appliquer dans mon IPX V4. Après quelques recherches sur l’HTML, j’ai réussi à faire une petite animation pour ma VMC.

Voici la procédure que j’ai employée :

  • créer deux fichiers VMC:
    • ventilpv0.png : fichier png VMC arrêt
    • ventilpv1.png : fichier apng VMC en service

Je les ai stocké sur le disque de ma freebox.

J’ai créé un petit widget HTML sur l’IPX, voici le code :

led20 = marche vmc petite vitesse
led21 = marche vmc grande vitesse

let p = datasources["V4"]["response"]["led20"];
let g = datasources["V4"]["response"]["led21"];

return `
<center>
  <table width="90%" border=0>
    <tr>
      <td align=left valign=middle width="25%"><img src="://repertoire disque/ventilpv_${p}.png" width=60 height=60></td>
      <td align=left valign=middle width="25%">VMC PV</td>
      <td align=right valign=middle width="25%"><img src="://repertoire disque/ventilpv_${g}.png" width=60 height=60></td>
      <td align=right valign=middle width="25%">VMC GV</td>
    </tr>
  </table>
</center>
`;

Je vous fais suivre aussi les deux fichiers PNG que j’ai créer avec APNGb pour les curieux.

ventilpv_1
ventilpv_0

Capture d’écran 2020-04-28 à 01.09.04

8 J'aime

Bonjour Dome,

joli travail

une remarque qui s’applique en général à la création de widgets : attention, pour des raisons parfois cosmétiques, à ne pas être trop gourmand en ressources, ce qui risquerait de ralentir l’IPX.

Pour vérifier : à la fin du fichier status.xml, regardez la valeur lps0. Supérieure à 10 000 = parfait.

Encore bravo, vous m’avez fait découvrir le format APNG qui semble très intéressant.

Bonne journée

4 J'aime

Bonjour,

Merci. Oui j’ai vérifiée la valeur Ips0 dans le status.xml il a descendu légèrement malgré une configuration bien chargée. Mais je pense que l’on peut optimiser le code et la taille du fichier « PNG ». mais je laisse cela au pro du HTML.

2 J'aime

Excellent !
Je ne connaissais pas non plus, c’est chouette ! :slight_smile:

1 J'aime

Bonjour Grocrabe,

A quoi correspond cette info lps0 SVP ? Chez moi elle n’est que de 9226 ! C’est grave.

Merci de votre réponse.

Bonjour,

La variable Lps0 ce situe en fin de fichier status.xml. Elle sert a vérifier le fonctionnement de la carte IPX800 V4.

2 J'aime

Bonjour PatLeHibou,

9226 n’est pas grave… en dessous de 6 à 7000 ça va devenir pénalisant, au dessus de 10 000 on est sûr de la réactivité.

Bonne journée

3 J'aime

@Dome, je me suis permis de remettre en forme le code du widget. Côté performance, il est très bien ce widget :+1:

Pour info, ce widget est on ne peut plus simple et ne consomme rien sur l’IPX autre que la datasource qui est rafraîchit régulièrement (mais qui est obligatoire dès que l’on écrit un widget).

3 J'aime

Sympa comme widget, si en plus il est léger …
il me semble qu’il y a un poste de @fgtoul qui regroupe des widget possible à implanter.
Peut-être intéressant de le mettre en avant sur le forum pour avoir d’autre création avec se type de format à l’avenir.

1 J'aime

Bonjour Lapier12,

C’est une bonne idée… si il y a des forumeurs qui veulent partager leurs widgets, postez les ici ou sur un post spécifique. Avec votre accord nous les regrouperons dans un Wiki.

Il y a effectivement une rubrique Widgets dans le wiki, richement alimentée par @fgtoul.

Bonne journée

3 J'aime

Je suis curieux, j’ai donc voulu tester.

frame01
Vanne oFF

Le résultat est pas trop mal je trouve.

@Dome Je pense que tu peux vraiment diminuer le poids de ton icon en restant sur 3 ou 4 images. La il me semble que tu en à 23.

Pour le code Html c’est pas encore pour moi mais je vais m’y mettre un jour…

4 J'aime

Bonjour,
je vous envoie un petit gyrophare.Gyrophare_off Gyrophare_on

3 J'aime

frame01 Arosage off

4 J'aime

Bonjour,
Je suis ce post avec beaucoup d’intérêt mais j’avoue être bloqué. J’ai réussi a créer la source de données, et crée un widget HTML avec le code donné plus haut. Sauf qu’a chaque rafraichissement, a la place des icones, j’ai un carré vide. Je pense que le lien vers les fichiers n’est pas correct.
J’ai stocké les fichiers PNG sur mon NAS Synology. Quelle est la syntaxe a mettre dans le widget pour pouvoir accéder aux fichiers? Merci pour votre aide… je sèche… :roll_eyes: