Plugin qui permet de personnaliser des templates , des widgets

Il est indispensable de lire cette documentation pour comprendre comment le plugin fonctionne.

Ce plugin s’adresse aux utilisateurs confirmés pour l’édition du code mais ‘installation des widgets présents dans le plugin ne nécessite aucune connaissance particulière

Le plugin fait la différence entre un template que l’on applique à une commande et un widget qui ici sera considérer comme un équipement à part entière.

Exemple de widgets disponibles (Horloge,résumé,sonde,batterie,anémomètre)

Une fois le plugin installé et activé , aller dans la catégorie « programmation/tools»

1) Onglet Equipements

C’est le but premier de ce plugin (avec la possibilité de créer des équipement/widgets personnalisés et des templates)

Il est aussi possible d’en importer

Voir les chapitres dédiés dans le menu

2) Onglet Personnalisation

En premier , vous pouvez sélectionner un équipement et définir la hauteur et la largeur en cliquant sur le bouton « MAJ »

En second , vous pouvez sélectionner un widget source et appliquer la hauteur et/ou la largeur à un ensemble de widgets cibles .

3) Onglet Logs

Permet de définir le niveau de logs exceptés ceux qui sont cochés.
Permet de vider les logs exceptés ceux qui sont cochés.
Surveiller les logs n’est pas implémentés dans le plugin pour le moment

4) Onglet Droits

Permet de changer les droits .

!!! Attention cette fonction est plutôt réservée aux utilisateurs confirmés sachant ce qu’ils font !!!! De base il n’y a pas à utiliser ces fonctions pour la création de templates et de widgets.

5) Onglet Listener

De nombreux plugins utilise la méthode “listener” . parfois nous supprimons un élément mais celui-ci reste présent.

Donc ajout d’un onglet listeners.

si l’ icône état est rouge c’est qu’il y a un soucis et la commande apparaît en rouge (voir photo)

En survolant la commande , un message vous signalera le type d’erreur (erreur commande ou équipement). Vous pourrez alors corriger de vous même voir le supprimer en cliquant sur la commande.

6) Les templates

Important :

Le template est utilisé pour les commandes

Si vous utilisez les templates natifs au core de jeedom , les templates créés via ce plugin ne doivent pas avoir le même nom. C’est impératif. En cas d’oubli vous pouvez effacer le template du plugin pour que celui du core soit pris en compte

6.1) Templates « simples »

Cliquer sur le +

Vous pouvez créer un premier template en évitant les espaces dans le champs « nom ». Le plugin récupère dans ce cas les templates natifs au core que vous pourrez modifier par la suite.

Cela créer un équipement spécifique

Dans ce cas cela crée un template « cmd.action.other.test_template » et c’est ce template qui ne doit pas être présent dans le core à défaut

Vous pouvez alors

Éditer le template (dashboard/mobile)
Ajouter une image pour la passer en paramètre optionnel par exemple.
Ajouter d’autres paramètres optionnels.
Et l’appliquer à une/des commande(s) que vous choisirez dans la fenêtre déroulante
Et le prévisualiser ( La vue Dashboard correspond au visuel du Dashboard/design ) .Pour la vue mobile il est recommandé d’aller voir le visuel sur la vue mobile de Jeedom
Sauvegarder , supprimer
Dupliquer ( Attention cela ne duplique que le template et pas les images)

En cas de soucis avec un template , il faut le supprimer du plugin.

6.2) Templates présents dans le plugin

Aller dans la configuration générale du plugin

Cliquer sur « Ajouter un template »

Cela ouvre une fenêtre et vous pourrez choisir le template à ajouter

6.3) Importer un template

Dans la configuration générale du plugin vous pouvez télécharger un template pour l’ajouter au plugin. Celui-ci doit-être au format zip avec à la racine les dossiers dashboard et mobile

6.4) Templates Tiers

Il existe de nombreux templates à disposition , par exemple ceux de Jag , salviaf ou ceux du plugin « widget »

Le plus simple est de récupérer le code de ce template. Pour cela il faut donc créer un template du type de la commande et ensuite de copier le code du template dans l’éditeur.

Si le template utilise des images il faut bien vérifier le chemin dans l’éditeur et uploader l’image via le plugin.

Généralement remplacer

data/customTemplates/

par

plugins/tools/core/template/

6.5) La prévisualisation

Effective lors que vous êtes en version dashboard. Pour la vue mobile , c’est plus complexe et il faut aller directement sur la vue mobile de jeedom.

6.6) Onglets commandes

Permet de visualiser les commandes affectées au template et de supprimer l’affectation si besoin.

7) Les widgets

Le plugin permet de créer des équipements personnalisables.

7.1) Onglet équipement

Comme tous les équipements , il permet de changer le nom , de catégorie , d’objets …

7.2) Onglet Personnalisation

Vous pouvez :

Éditer le widget (dashboard/mobile)
Ajouter des paramètres optionnels.
Et le prévisualiser ( La vue Dashboard correspond au visuel du Dashboard/design ) .Pour la vue mobile il est recommandé d’aller voir le visuel sur la vue mobile de Jeedom
Sauvegarder , supprimer
Dupliquer
Ajouter des commandes
Modifier la taille du widget

7.3) Ajouter des commandes

En cliquant sur « +commandes » , vous pouvez sélectionner une commande existante . Vous devez obligatoirement la nommer (« battery » sur le screen au dessus).Puis dans l’éditeur vous pouvez ajouter #battery# , enregistrer et prévisualisez (L’équipement doit être activé et visible). Le plugin retourne le template de la commande ajoutée-

Vous pouvez ajouter autant de commandes que vous souhaitez.

8) Documentation intégrée au plugin

8.1) Equipements

Pour chaque équipement , vous avez accès à une aide spécifique en cliquant sur l’icône de la documentation

Cela ouvre une fenêtre avec des explications concernant le type d’équipement sur lequel vous travaillez.

9) Widgets intégrés au plugin

10) Exemple d’utilisation

10.1) Un menu

Code du widget :

C’est personnalisable à souhait. Vous pouvez faire de même avec un tableau en html , css …

10.2) Utilisation des fonctions du core

Exemple pour créer un widget pour prévisualiser des logs

Code du widget :

10.3) Batterie

Code pour créer un widget pour visualiser l’état des batteries sur le dashboard/design

10.4) Equipement réseau

Nouvel Exemple d’utilisation: Regrouper tous les équipements présents sur le réseau en 1 seul wigdet:

Créer un virtuel et le nommer réseau par exemple et ajouter une commande “info virtuelle” de type string/other. L’activer et le rendre visible sur l’objet de votre choix. Juste à se souvenir du nom de cette commande.

Go dans le plugins tools et créer un nouveau “template” de type “info string” .

Cela créer un équipement “cmd.info.string.Networks”
Dans la fenêtre d’édition du code copier-coller ce code en changeant le nom du chemin de l’mage (attribut “src”) selon le nom de votre template

Ajouter les commandes états des équipements et cocher la case “listener”

Maintenant il faut créer/télécharger des images pour les équipements que vous avez sélectionné(Taille des images en couleur de préférence 50px*50px au format png). Attention de bien les renommer comme les commandes que vous avez créé
Cliquer sur le bouton icônes/open pour les uploader dans jeedom
Il ne reste plus qu’à appliquer le template à la commande du virtuel créé précédemment et valider

Le rendu

Sur le dashboard

Sur le design avec différents paramètres (masquer le nom /transparent)

Les icônes se mettent à jour en temps réel selon l’état . Ici en couleur les éléments actifs et en atténué les équipements inactifs

10.5) Intégration Squeezebox

Suivre les explication de Dapolux sur le forum communautaire.

ICI