Article Crée par Cyril Bouvier Jeedom Widget
Jeedom widget IconAction est un widget, créé par Salvialf, qui permet d’avoir le visuel sur le changement d’état d’un équipement mais également d’agir sur celui-ci.
Dans ce tuto, nous utiliserons le plugin virtuel pour simuler un simple interrupteur ON/OFF et afficher une ampoule. Le widget est utilisable sur les équipements virtuels ou physiques intégrés dans jeedom du moment qu’ils possèdent une commande d’activation et de désactivation. (non testé sur un interrupteur de type toggle)
Pré requis :
> Jeedom (V4 utilisée dans ce tuto)
> Le plugin Virtuel
> Le plugin Jeexplorer (à utiliser avec précaution)
> Un PC
1: Téléchargement des fichiers et installation des fichiers :
1.1 : Téléchargement et extraction de Jeedom Widget:
Vous pouvez télécharger les fichiers
nécessaires en cliquant sur le lien suivant : https://github.com/Salvialf/JEEDOM-Widget-IconAction/raw/master/V4/IconAction.zip
Une fois le téléchargement effectué, il faut
dézipper l’archive.
Une fois l’extraction terminée, nous avons un dossier Data comprenant un
dossier customTemplates qui contient 2 dossiers (dashboard et mobile).
1.2 : Installation sous jeedom :
Sous Jeedom, rendez vous dans Plugins/Programmation/Jeexplorer :
Puis, sous jeeplorer, allez dans html/data/customTemplates :
Faites un clique droit :
Sélectionnez : Envoyer les fichiers puis choisir le dossier
A l’aide de la fenètre de l’explorateur qui vient de s’ouvrir, retrouver votre dossier IconAction et parcourez le jusqu’à dashboard et cliquez sur importer
Répétez l’opération pour importer le dossier mobile, vous devez maintenant obtenir la page suivante :
IconAction est maintenant installé sur votre jeedom.
2 : Configuration du widget dans un virtuel :
2.1 : Virtuel interrupteur simple :
Pour la création de notre interrupteur simple, nous avons besoin d’une commande ON, d’une commande OFF et d’une info virtuelle binaire reliée à nos 2 commandes.
La commande ON changera la valeur de l’info en 1 et la commande OFF redonnera la valeur 0.
Vous pouvez vérifier le fonctionnement de votre interrupteur en cliquant sur le bouton « tester » à droite de vos commandes « action » et en vérifiant que la valeur de votre info passe bien de 0 à 1 et inversement (clic sur la roue crantée à droite de l’info).
2.2 : Affectation du widget aux commandes virtuelles :
Toujours dans les commandes de notre interrupteur virtuel, nous allons maintenant sélectionner notre widget. Cliquez sur la roue crantée à droite de la commande ON puis cliquez sur l’onglet affichage.
Dans la ligne widget, cliquez sur « Défaut » et sélectionnez CustomTempl/IconAction.
Ensuite, ajoutez un paramètre optionnel widget, puis dans « nom », tapez « type » et dans valeur, tapez « ampoule ». Cliquez sur enregistrer.
Recommencez l’opération pour la commande OFF.
De base, la liste des valeurs pour les paramètres optionnels est :
ampli / ampli2 / ampoule / applique / applique2 / aquarium / barreson / bluray / chainehifi / defaut / dvd / freetv / freewifi / kodi / lampadaire / lampe / lum1 / lum2 / lum3 / lumext / nswitch (manque icône ON) / playstation / prise / rad / sapin (manque icône off) / secheserviette / spot / tv / wallplug / wii / xbox
(Toutes les icônes disponibles sont visibles sous data/customTemplates/dashboard/cmd.action.other.IconAction) Rendez vous sur votre dashboard et votre widget apparaît
Cliquez sur l’ampoule, le widget change
Maintenant, vous pouvez retourner dans votre virtuel, appuyez sur les boutons « tester » de vos commandes ON/OFF et l’état de votre widget change également.
Le Jeedom widget IconAction est Fonctionnel
3: Icônes personnalisées :
3.1 : Normalisation du nom des icônes personnalisées
Lorsque vous voulez ajouter vos propres icônes à IconAction, vous devez déjà les renommer pour que leurs noms aient la forme suivante : nom_on et nom_off
exemple : alarme_on et alarme_off
3.2 : Ajout des icônes dans le dossier:
A l’aide de Jeexplorer, allez dans le dossier cmd.action.other.IconAction (data/customTemplates/dashboard/cmd.action.other.IconAction)
Faites un clic droit puis envoyer un ficher. Vous avez la possibilité de glisser directement vos fichiers dans la zone dédiée ou de le chercher via l’explorateur comme nous l’avons fait précédemment. (plusieurs fichiers peuvent être envoyés en une fois).
Vos fichiers apparaissent directement dans le dossier. (en premier dans mon cas)
3.3 : Ajout et configuration des icônes personnalisées dans virtuel
Dans l’onglet Affichage de votre commande virtuelle ON, changez la valeur du paramètre optionnel de votre widget par le nom de votre icône
Maintenant, nous devons régler la taille de notre icône. Par défaut, les icônes du widget IconAction font 75px par 75px. L’ajout d’icônes de taille différentes n’empêche pas le fonctionnement mais la taille est modifiée automatiquement, ce qui peut avoir un effet de zoom ou dézoom…
Il est possible de modifier la taille de nos icônes personnalisées depuis un éditeur de photo mais il est également possible de garder leurs tailles d’origines et d’ajouter des paramètres optionnels supplémentaires.
Il vous faut connaître la taille de vos icônes (facilement visible sous Windows 10 par exemple, il suffit de passer la souris sur le fichier de votre icône sans cliquer et d’attendre qu’une bulle d’information s’affiche avec la taille).
Mon exemple prend en compte une taille de 128px par 128px.
Pour cela, ajoutez 2 paramètres optionnels dans les 2 commandes de votre virtuel :
- nom: hauteur valeur:128
- nom: largeur valeur:128
Pour la version mobile, les noms sont hauteur2 et largeur2 (non testé)
Sans modification de taille :
Avec modification de taille :
Répétez l’opération pour la commande OFF de votre virtuel
La personnalisation de IconAction est terminée.
Vous pouvez maintenant personnaliser IconAction comme vous le souhaitez.
Pour l’afficher dans un design, selectionnez « ajouter un équipement » et ajoutez le directement
C’est FINI
