Organisation des widgets entre ordi et gsm

Bonsoir
Pouvez-vous me dire s’il y a un moyen d’avoir le même ordre de présentation des widgets sur l’ordinateur que sur un téléphone ?

J’essaie de faire des groupes logique entre les variateurs et le interrupteurs les scénarios mais à chaque passage sur mon téléphone c’est le grand n’importe quoi j’ai des variateurs dans mes scénarios et la météo a la fin alors que par logique sur l’écran de l’ordinateur je la place complètement à gauche

Il y a une solution ou il faut plutôt passer par les dashboard pour gérer les catégories ?

Merci d’avance

bonsoir,
les dashboards sont responsives.
Ils s’adaptent à la taille de l’écran et à la résolution.

Pour les liaisons 3G/4G il faut privilégier le dashboard 8 qui est plus léger.
cdt

Merci de l’information mais j’ai la chance de n’avoir aucun soucis de 4G ici donc même en 4g la page s’affiche très rapidement ( 5 secondes )

je voulais juste savoir si l’ordre de placement des widgets sur l’ordinateur avait un effet sur l’ordre sur le téléphone car sur mon tel ils sont les un a la suite des autres en dessous contrairement a l’ordinateur ou il peuvent être aussi bien a coté que dessous ( j’espère que je suis compréhensible ? )
exemple j’ai sur mon ordinateur : le widgets météo puis a sa droite mes sondes puis encore a droite mes relais X8R puis mes scénarios et pour finir mes variateurs

quand je lance la page sur le tel j’ai en haut mes sondes puis un en dessous un variateur puis en dessous la météo puis toujours en dessous mes relais X8r puis encore d’autre variateurs puis je repasse a mes scénarios en clair un peu n’importe comment
ce qui ne correspond pas a mon placement de l’ordinateur

logique ou pas ?

comme dit précédemment, les dashboards s’adaptent automatiquement.
Les widgets les plus à droite ne pouvant s’afficher sur un écran plus petit passent à la rangée suivante, décalant le tout.
vous ne pouvez pas le contrôler.

Vous avez 8 dashboards, c’est une manière de créer des groupes, dashboard par dashboard

1 « J'aime »

Bonjour,

Ok pour le côté « responsive » de l’interface, mais ce qui est quand même très intriguant c’est l’ordre de placement des widgets sur un téléphone comparativement à un navigateur.

Dans le navigateur, mon dashboard principal est le suivant :

Et sur le téléphone l’ordre est :

  • Chauffages (1er de la 1ère colonne)
  • Climat côté jour (1er de la 3ème colonne)
  • Climat local congel (seul de la 6ème colonne)
  • Radiateur couloir (2ème de la 2ème colonne)
  • Climat côté bureau (2ème de la 3ème colonne)
  • Ballon d’eau chaude (1er de la 2ème colonne)
  • Météo (seul de la 5ème colonne)
  • Climat côté nuit (seul de la 4ème colonne)

Il n’y a apparemment aucune logique dans ce replacement. Ca ne me gêne pas outre mesure puisque j’ai effectivement le Dashboard n°8 avec les principales infos pour affichage sur le téléphone. Mais c’est intriguant quand même.

Y a-t-il une explication ? L’ordre de création des widgets intervient-il ?

Bien cdlt

1 « J'aime »

bonjour,
la hauteur des widgets joue aussi. Si le widget est trop haut pour y mettre le suivant, il optimise avec un autre.
cdt

bonsoir merci de votre participation
merci d’avance

Bonsoir @fgtoul,

Je veux bien pour les questions de hauteurs, mais par rapport au cas de figure que j’indique, je ne vois pas la logique. C’est pour cela que je pense que l’ordre de création peut aussi jouer…

Mais bon, on va arrêter de se faire de noeuds au cerveau. Quelques widgets simples classés de haut en bas sur le Dashboard n°8 et si besoin d’accéder aux autres depuis un smartphone, on s’adapte… :slight_smile:

Bonne fin de soirée.

Bonsoir petite question comment avez vous réussi a crée des barres horizontales pour les températures SVP

merci de votre réponse

Bonsoir @volta17,

Il y a des éléments de réponses dans ce post :

Mais j’ai aussi trouvé des choses sur le net, je ne sais plus trop où… :slight_smile:

Au final, voici le code d’un de mes thermomètres :

var temp_chambres = ((((datasources["IPX Status"]["response"]["analog1"])* 0.000050354) - 1.63)/0.0326).toFixed(1);
var presence = (datasources["IPX Status"]["response"]["vin8"]);
var min = 0;
var low = 10;
var high = 12;
var max = 30;
var color = "orange";
if (presence == 1) {
    low = 18;
    high = 22;
    color = "red"
};
 return `
<style>  
.thermometre {
  width: 248px;  /* 278px */
  height: 20px;  /* 25px */
  -webkit-appearance: none; 
  border: 1px solid #444444;  
  border-radius: 5px;  
  opacity:1;
  filter:alpha(opacity=100);    
  background-size: 100% 100%;  
  -webkit-box-shadow: inset 0 0 4px 0px #444444;
}  
.thermometre:-moz-meter-optimum::-moz-meter-bar {
  background:blue;
  opacity:0.5;
  filter:alpha(opacity=70);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
.thermometre:-moz-meter-sub-optimum::-moz-meter-bar {
  background:lime;
  opacity:0.6;
  filter:alpha(opacity=75);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
.thermometre:-moz-meter-sub-sub-optimum::-moz-meter-bar {
  background:${color};
  opacity:0.7;
  filter:alpha(opacity=80);
  border-radius: 5px;  
  -webkit-box-shadow: inset 0 0 10px 3px #444444;
  border: 0px solid #444444;  
}
</style>     
<br>
&nbsp;&nbsp;&nbsp;
Température coté chambres : <b>${temp_chambres} °C</b>
<br>
<!-- Présence = ${presence} -->
<br>
&nbsp;&nbsp;&nbsp;
${min} °C
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
${max} °C
<br>
&nbsp;&nbsp;&nbsp;
<meter class="thermometre" low=${low} high=${high} min=${min} max=${max} value=${temp_chambres} optimum="2"></meter>
<br>
`;

Ce n’est pas forcément super classe et je suppose que des pros du code feraient largement mieux et plus optimisé, mais ça marche.

NB1 : une source de données IPX Status, reprend les données de status.xml pour actualiser les valeurs
NB2 : je fais changer les valeurs limites et la couleur en fonction d’un indicateur d’occupation ou non de la maison, variable « presence » qui récupère la valeur de l’entrée virtuelle 8.

Bonne adaptation du code.

3 « J'aime »

Bonjour @PatLeHibou,

Merci pour le partage :wink:

Cordialement.
JF

bonsoir super merci a moi maintenant de l’adapter

Bonsoir @PatLeHibou,
Merci pour le partage de la barre de température ! elle a remplacé rapidement les jauges qui prenaient un peu trop de place, moyennant une rapide adaptation !