[Résolu][Recherche] Widget batterie avec %

vvince · Octobre 30, 2019, 9:52

Je pensais pas que c’était aussi simple mais oui ce genre de choses c’est nickel.
Bon plus qu’à faire ça demain.
Merci

Foulek57 · Octobre 30, 2019, 11:34

En test tu met

#value# == #value#

A la place de l’image tu met

<div class='progress' style='width: 100px;'><div class='progress-bar' role='progressbar' style='width: #value#%' aria-valuenow='25' aria-valuemin='0' aria-valuemax='100'>#value#  %</div></div>

vvince · Octobre 31, 2019, 9:08

Merci, la progress bar v a me servir pour un autre truc
Sinon pour les batteries j’ai mis :
#value#%

Je n’arrive pas à avoir les icônes batteries en couleur j’ai essayé icon_blue, icon_orange icon_red pareil. J’ai regardé le screen de @kiboost mais j’ai peut être zappé un truc.

J’aimerais également avoir le texte aligné avec l’icone car j’ai un léger décalage :

batt

Merci beaucoup

raqpub · Octobre 31, 2019, 9:09

Bonjour Salvialf,

J’ai appliqué le principe sur ma V4.0.25 mais perso l’icone ne change pas de couleur que ce soit en light ou Dark.
Une idée du pb ?

Salvialf · Octobre 31, 2019, 9:09

Dans les paramètres de Jeedom → Interface il faut cocher « icones en couleur ». Pour le décalage je teste ce sori sur mon pc. Au passage j’essayes de voir aussi pour le widget Danfoss (j’avais zappé)

@raqpub: idem

Edit: @kiboost si t’es toujours dans les parages, elle n’est pas un peu inutile cette case à cocher pour les icônes en couleur ? ça ne pourrais pas être intégré d’office sans option dans les paramètres ? Car pour le coup ça fait du code à maintenir en + et j’avoues ne pas avoir vu l’intérêt de mettre les couleurs en option mais je n’ai pas creusé ?!

vvince · Octobre 31, 2019, 9:15

@Salvialf le widget Dangoss est ok chez moi grâce à tes recommandations

Pour les icônes couleurs c’est ok : merci

Une idée pour aligner icône et texte ?

Thanks

raqpub · Octobre 31, 2019, 9:19

OK Vu (Icônes widgets colorées) + shift F5 et résultat OK.
Merci

Salvialf · Octobre 31, 2019, 9:19

Faut que j’essaye mais en 1er lieu comme ça à l’aveugle je tenterai de jouer avec un line-height:**px dans ton inline-style #value#%

…pas sûr que ça fasse la blague

Sur le widget Danfoss tu n’as plus ce problème ?:

vvince · Octobre 31, 2019, 9:56

Ah si si il reste effectivement le problème sur le design

vvince · Octobre 31, 2019, 10:20

C’est bien plus sympa comme ca :

battOK

<style>.alignVVE {   vertical-align: middle; }</style> <i  class='icon jeedom-batterie2 icon_green alignVVE '></i><span class='icon_green alignVVE ' style="font-size:12px;">#value#%</span>

Salvialf · Octobre 31, 2019, 10:28

Carrément !!

raqpub · Octobre 31, 2019, 11:37

Idem, j’en ai profité. Merci

vvince · Octobre 31, 2019, 1:41

@Salvialf tu sais il y a une doc quelque part où l’on peut trouver les class css jeedom et leurs utilisations ? j’aimerais personnaliser un widget style gauge cursor avec les couleurs du wallplug

Merci

Salvialf · Octobre 31, 2019, 1:51

Je pense que c’est ça que tu cherches:

github.com

jeedom/core/blob/alpha/desktop/css/coreWidgets.css

/*
Core Widgets CSS @Jeedom
Desktop
*/

/* ____________________Global */
  [data-page=plan3d] .verticalAlign {
    z-index : auto !important;
  }

  div.eqlogicbackgraph {
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -100;
    opacity: 0.65;
  }
  div.eqlogicbackgraph  path.highcharts-graph {

This file has been truncated. show original

Couplé à bootstrap comme tu as pu le voir avec les couleurs d’icônes pour ta batterie

D’ailleurs je vois une classe verticalAlign du coup ça se tente avec l’exemple de ce matin:

<i class='icon jeedom-batterie2 icon_green'></i><span style="font-size:12px; color:green;" class="verticalAlign">#value#%</span>

vvince · Octobre 31, 2019, 1:58

Merci beaucoup je vais regarder.

PS: nom la class verticalAlign ne donne pas le même résultat malheureusement

vvince · Octobre 31, 2019, 2:25

@Salvialf je viens de voir sur l’ancien forum ton widget gauge pour la V4 je pense que je vais l’utiliser de ce fait

Salvialf · Octobre 31, 2019, 2:28

lol tu en découvres encore !!!

Si tu veux voir tous mes widgets:
https://community.jeedom.com/search?q=%22%5BSALVIALF%5D%20Widget%22%20in:title%20@Salvialf%20order:latest

Ils ont tous une version V4 sur l’ancien forum normalement sauf « meteo » qui est mort pour le moment suite à un changement d’API mais j’ai eu quelques demandes pour le ressusciter donc va falloir que je m’y mette. Je vais créer les posts correspondants sur ce forum au fur et à mesure…

Mais bon on s’éloigne de + en + du sujet initial de ce topic. Je penses que tu peux le passer en résolu

vvince · Octobre 31, 2019, 2:36

Je vais peut être faire une modif sur le gauge pour modifier la couleur en fonction de la puissance

Salvialf · Octobre 31, 2019, 2:41

Raison de plus pour passer ce sujet en résolu car cette même demande a été faite récemment il y a donc déjà un post à ce sujet.

Je vais intégrer cette possibilité directement dans le code à l’avenir

Edit: @vvince …presque !! Pour passer le sujet en résolu il faut choisir une réponse comme solution

system · Novembre 1, 2019, 2:41

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