Afin de ne pas trop surcharger mes designs, je me penche sur la mise en place de popup ou « bulle » d’options.
Cas d’utilisation parlant: J’ai une image on/off pour un éclairage, je voudrais rajouter un bouton supplémentaire à coté, actif que si l’éclairage est On, qui ouvrirais cette bulle, à l’intérieur de laquelle j’aurais un widget (dans cette exemple le ColorCircle + un slider sur l’intensité).
Ergonomiquement parlant, cela pourrais ressembler un peu au Menu Full Screen évoqué sur d’autres topics, mais biensur, sans animations, et avec un widget dedans, non des liens.
Quelle solution vous semble la plus appropriée (et la plus simple) pour la gestion de la « Bulle »? (Div tout seul par dessus le tout, en jouant sur hidden / show? …)
Dans un premier temps, cela fonctionnerait en design, mais idéalement la solution fonctionnerait aussi en Dashboard
/* pour commande */
$o=cmd::byId(208);
//$o=cmd::byString("#[présence][Presence Mireille][Rssi]#");
$o->setIsVisible('1');
$p=$o->save();
$scenario->setLog(print_r($o, true)); // le log (à supprimer)
sinon via html
et via son plan_id dans ton widget
le On affiche et le Off cache
tous se design est sur la base affiche cache
accueil
show plan_id 1,2,3
hide plan_id 4,5,6
températures
show plan_id 4,5,6
hide plan_id 1,2,3
l’historique perdant son emplacement au retour de mémoire (parfois) zoom à 0 zoom a 100
il y a plein de façon de cacher (script, css) avec des contrainte pour certaines
Après si tu veux faire se que tu souhaites faut passé par du html, api js jeedom et plug display html (pour dashboard et design)
Pour la première solution (activation/désactivation d’équipement, + scenario):
J’y vois 2 problèmes:
Le premier est que sauf erreur de ma part, un équipement non visible, apparaît quand même sur un design mais pas dans un dashboard (j’ai déjà certains équipements dont c’est le cas
Même si ce sera un cas rare si on jour sur le visible de l’équipement, en cas d’accès par 2 personnes différentes, l’affichage des différentes sessions impactera l’autre
La deuxième me parait plus adaptée, j’ai fait un premier test qui fonctionne bien (enfin juste sans contenu pour le moment):
Un div tout simple:
<a onClick="toggle_id('a_cacher')"> <div class="link_button" >Toggle<div></a>
<script>
function toggle_id(id) {
var element = document.getElementById(id);
if (element.style.display === "none") {
element.style.display = "block";
} else {
element.style.display = "none";
}
</script>
La difficulté maintenant, est d’arriver à insérer l’équipement à l’intérieur du div (a moins que je doive recopier tout le code du widget manuellement, mais je suppose qu’il y a des fonctions plus simples en se basant juste de l’id de l’équipement, ou a la limite de l’id des différentes commandes).
Je ne comprends pas bien dans ton exemple avec des plan_id, car pour moi il n’y a qu’un seul plan_id par page (a moins que du coup ce soit d’insérer un design complet à l’intérieur de mon div, au quel cas oui ça résoudrais mon besoin, mais je ne sais pas comment insérer le plan complet dans mon div).
@ZygOm4t1k, j’avais bien dans l’idée d’utiliser ton plugin tools pour créer le widget avec tout le contenu de ce que je vais afficher dans ces bulles.
La solution avec un état géré au niveau commande, va potentiellement créer des désynchro lors de l’utilisation (ex: un user clic, un autre consulte via son tél, l’affichage sera pas forcément le bon), bien qu’il est possible de faire des pseudo reset, et que le cas ne sera pas fréquent, ça me parait un peu usine a gaz (après quand on a pas le choix… )
@ajja17orange,
Effectivement, j’avais confondu actif de visible. Ta commande sur le data-plan_id m’est de grand aide, et je pense que du coup il y a une solution très simple (du moins mon premier test va dans ce sens):
J’ai créé le bouton suivant qui fonctionne sur une tuile que j’ai déjà (il faudra que je créé le widget spécifique avec tools pour la version finale)
<a onClick="toggle_widget('1045');"> <div class="link_button" >Toggle<div></a>
<script>
function toggle_widget(id) {
var widget = $('[data-plan_id="'+ id +'"]');
widget.toggle()
}
</script>
1045 correspond au data-plan_id de mon Equipement « Yeelight Bureau » (que j’ai un peu galéré à trouver car au début j’ai testé avec le « ID » et « ID de l’objet » des paramètres avancés, qui ne sont pas les bons ID, mais en fait non, je le trouve dans le source de la page finale dans les balises de l’équipement)
A moins que cet ID change dans le temps, ça me semble viable, y voyez vous un souci à venir ou au quel je n’aurais pas pensé?
Ps: Cela ne fonctionnera pas en dashboard, mais bon ce n’est pas le plus important, l’usage premier est le design.
C’est bien le problème, 2 users sur la même page, si un des 2 clic pour ouvrir la popup (enfin le widget/equipement), l’autre aura la popup qui va s’ouvrir (alors qu’il n’en a pas besoin).
La solution que je mentionnait te semble dans tous les cas pas plus simple?
J’ajoute à l’écran le/les équipements dans le design, comme n’importe quel autre.
Je rajoute mon petit bouton de toggle pour chaque équipement que je veux afficher/cacher dynamiquement
Puis je fait en sortes de tous les cacher au chargement de la page (ou alors je gère directement qu’ils soient cachés par défaut via le CSS global).
il y a plein de méthode pour le même besoin
elles ont parfois des contraintes dans le temps
ex tu fais pareil avec la tuile
et pour une raison ? la position x,y se réinitialisé parfois a 0,0
j’étais passé au hors champ droite ou gauche (mais la contrainte de l’enregistrement de la position actuel)
J’ai pas testé mais je vais le faire.
Je me demandais seulement si le bouton disparaît sur toutes les interfaces si commande off via une autre interface. Donc vais regarder ça de plus de près.
non tu as raison puisque c’est la (a se que j’ai compris plus haut un simple ajout de bouton)
il faudrait que dans le widget off un ajout hide « data-plan_id »
et l’actu se ferait sur tous device
mais cela peux se faire dans l’html aussi :
surveille la class et si celle ci est sur off cache
)
alors. j’ai manqué une étape.