Widget HTML ipxv5

Cartes Ethernet IPX800
21

J’allais justement vous le dire je viens d’essayer aussi, effectivement le widget fonctionne mais il n’est visible que sur un widget 2x2 ou encore mieux 4x4.
J’ai le même résultat que vous et j’ai tenté de l’afficher sur un widget 1x1 mais le CSS et moi…euh… c’est pas mon truc.

22

C’est parfait!! comme d’habitude.
Merci beaucoup

1 « J'aime »
23

Petite question supplémentaire, y a t’il un moyen de trouver le nom des icones pour les utiliser dans les widget html?

24

perso je crée un widget natif avec l’icône choisie, puis un clic droit dessus avec l’option « inspecter » me montre le code correspondant.

1 « J'aime »
25

Bonjour,

Dans mon widget, je cherche un moyen d’afficher une vitesse de ventilation. Pour le moment je le fais en changeant de couleur l’icone.
Est-il possible, soit d’afficher en même temps plusieurs icones? 2 ventilo pour vitesse 2 par exemple. Soit d’avoir un petit « 1 » ou « 2 » à coté de l’icone…
Bref toutes les idées sont bonnes sont bonnes sans pour autant compliquer trop le code.

Bonne journée

26

bonjour,
si la vitesse correspond à la valeur de l’analogique, il suffit d’ajouter la valeur sous l’icone.

<iframe srcdoc='
<link rel="stylesheet" href="assets/lib/gce-glyph/gce-glyph.min.css">
    <script type="text/javascript">

      let anaId = 262258;
      
      /* Get state and set widget */
      function updateData() {
        let dataColor,
            dataIcon;

        getAna((ana) => {
          const anaFound = ana.find( analog => analog._id === anaId);
          if (undefined == anaFound) {
            dataColor = "#FF0000"; // red
            dataIcon = "icon-circle-remove"

          } else {
            switch (anaFound.value) {
              case 0: // value = 0
                dataColor = "#eeeeee";  // grey
                dataIcon = "icon-power_power"
                break;
              case 1:
              case 2:
              case 3: //
                dataColor = "#32CD32";  // green
                dataIcon = "icon-fan_power"
                break; 
              default: // Any other value
                dataColor = "#FF7C00"; // orange
                dataIcon = "icon-circle-question"
              }
              
          }
          
          setIcon(dataIcon, dataColor, anaFound.value);

        });
      }
      /***/
      
      /* Get data from API */
      function getAna(cb) {
        fetch("/api/core/ana?ApiKey=ulmWrsx0QvdoWvH", {method: "GET"}).then((ret) => { // Get ANA group
          ret.json().then((ana) => {
            cb(ana); // Return ANA group from API
          });
        });
      }
      /***/
      
      /* Set icon and color */
      function setIcon(icon, color,texte) {
        let myIcon = document.getElementById("myIcon");
        let myValue = document.getElementById("myValue");
        myIcon.style.color = color;
        myIcon.className = "";
        myIcon.classList.add("gce-glyph");
        myIcon.classList.add(icon);
        myValue.innerHTML=texte;
      }
 
      /***/

      /* Auto refresh (optional) */
      function autoRefresh() {
        setInterval(() => {
          updateData();
        }, 5000); // 5 sec
      }
      /***/
      setTimeout(() => {updateData();}, 50)
 
      autoRefresh(); // Optional
    </script>
    <center>
    <div style="width:100px;font-size:48px;padding:30px">
    <div id="myIcon" class="gce-glyph" style="font-size:48px;" ></div>
    <div id="myValue" style="font-size:18px;color:white;" ></div>
    </div>
    </center>
    '></iframe>

image image image image image

2 « J'aime »
27

Bonsoir,

Merci, c’est fort et c’est top! :+1:

1 « J'aime »
28

Bonjour,

Les codes pour les widgets html fonctionnent parfaitement sur pc mais ne s’affichent pas sur l’application smartphone. Y-a-t’il une ligne à ajouter, est-ce un problème de navigateur?

Merci

29

Bonjour,

Ce sont des widgets html sur dashboard ou sur liveview ?

Sur Liveview j’ai quelques soucis entre PC et mobile mais plutôt lié aux images.
Les images hebergés sur mon NAS ne s’affichent pas sur les liveviews alors qu’elles s’affichent sur les dashboard.
Les images hebergés à l’extérieur s’affichent correctement.
C’est peut être une piste selon votre cas.

Bonne journée.

30

Bonjour,
@Mistoukwak
Quel format d’image ?
Synology supporte le format jpg (ou jpeg) par défaut et ne retraite pas l’image.
Tout autre format sera converti ou traité pour création de miniatures.

En général le format png est supporté par toutes les plateformes web.

Sur le synology il faut vérifier les codecs supportés.
Il se peut que des conversions soient faites à la volée vers les mobiles. Il faut vérifier les paramètres.

@patam

votre application est-elle à jour (dernière version : 09/05/2023)?

avez-vous essayé en attaquant l’ihm avec un navigateur standard sans passer par l’appli ?
cela devrait fonctionner.

bonne journée

31

Bonjour,

Merci pour votre réponse.
Effectivement ça fonctionne avec un navigateur sur smartphone, mais pas avec l’appli.
L’appli est bien à jour .

Cordialement