Blame view

README.md 9.5 KB
499dfbda   lwadbled   fix(README.md): Q...
1
  # Presentation du projet
b186066f   lwadbled   fix(README.md): E...
2
3
4
5
6
7
8
  
  Le but de ce projet est de réaliser une interface Web de commande et de visualisation d'appareils de mesures (tels que des oscilloscopes, générateurs, multimètres, etc ...) afin de pouvoir réaliser des TP d'électronique à distance.
  
  # Bases pour réaliser le projet
  
  Afin de réaliser ce projet, il faut :
  
499dfbda   lwadbled   fix(README.md): Q...
9
  * Connaitre l'utilisation des commandes LXI (pour installer le package sous linux : `apt-get install lxi-tools`) qui va permettre la communication avec les appareils à distance ;
b186066f   lwadbled   fix(README.md): E...
10
11
12
  
  * Installation d'un serveur, ici j'ai utilisé un serveur Apache2 ;
  
499dfbda   lwadbled   fix(README.md): Q...
13
  * Utiliser les langages HTML,PHP,CSS et JavaScript ainsi que le framework Bootstrap pour réaliser l'interface Web ;
b186066f   lwadbled   fix(README.md): E...
14
  
499dfbda   lwadbled   fix(README.md): Q...
15
  * Modifier les groupes des fichiers pour utiliser l'interface sur le Web correctement (notemment pour les photos) avec la commande : `chgrp -R www-data dossier-html`.
b186066f   lwadbled   fix(README.md): E...
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
  
  # Contenu du dépôt GIT
  
  Ce dépôt GIT est constitué des codes de l'interface Web. On retrouve à l'intérieur du dossier **html** : 
  
  * *bdd.json* : fichier qui permet d'associer un nom d'appareil à son type (Oscilloscope,Generateur...) ;
  
  * *index.html* : fichier qui constitue la page d'accueil du site, on peut simplement y lancer la recherche des appareils connectés au réseau ;
  
  * *decouvre.php* : fichier qui regroupe l'ensemble des appareils avec certaines informations (Nom, Type et Adresse IP) et qui permet de sélectionner un ou plusieurs appareils à utiliser ;
   
  * *main.php* : fichier qui affiche les interfaces des appareils séléctionnés et réalise les commandes des boutons appuyés (s'il y en a), ce fichier va chercher les fichiers d'affichages et de commandes directement dans les dossiers selon les types d'appareils ; 
  
  * *Oscilloscope* : dossier qui regroupe des fichiers d'affichages et de commandes pour les Oscilloscopes. Ces fichiers sont répartis dans différents sous-dossiers selon les noms des boutons ;
  	* *main_oscilloscope.php* : fichier du dossier *Oscilloscope* qui réalise l'affichage d'un Oscilloscope.
  	* *commandes_oscilloscope.php* : fichier du dossier *Oscilloscope* qui réalise les commandes associés aux boutons appuyés par l'utilisateur de l'interface.
  	* Ces fichiers sont appelés par *main.php* s'il doit afficher l'interface d'un Oscilloscope.
  	* Des sous dossiers contenant l'affichage et la réalisation d'un unique bouton sont parcourus par les deux fichiers précédents pour réaliser l'ensemble de l'interface.
  
  * *Generateur* : dossier qui regroupe des fichiers d'affichages et de commandes pour les Generateurs. Ces fichiers sont répartis dans différents sous-dossiers selon les noms des boutons ;
  	* *main_generateur.php* : fichier du dossier *Generateur* qui réalise l'affichage d'un Generateur. 
  	* *commandes_generateur.php* : fichier du dossier *Generateur* qui réalise les commandes associés aux boutons appuyés par l'utilisateur de l'interface.
  	* Ces fichiers sont appelés par *main.php* s'il doit afficher l'interface d'un Generateur.
  	* Des sous dossiers contenant l'affichage et la réalisation d'un unique bouton sont parcourus par les deux fichiers précédents pour réaliser l'ensemble de l'interface.
  
499dfbda   lwadbled   fix(README.md): Q...
41
42
43
  * *Oscilloscope_onglets* et *Generateur_onglets* : dossiers qui ont les memes commandes que pour les deux dossiers précédents, mais avec un affichage différent (panel de commande avec des onglets). Pour voir ces affichages, il faut modifier le type de l'appareil dans *bdd.json* par le nom de l'un de ces répertoires.
  
  * *Scripts* : dossier qui regroupe des fichiers php qui permettent de réaliser des petites fonctions tels que la capture d'écran d'un appareil ou l'affichage d'une image sur l'interface. Ces fichiers sont appelés dans différents fichiers du projet ;
b186066f   lwadbled   fix(README.md): E...
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
  
  * *Captures* : dossier qui regroupe les différentes captures d'écrans des appareils selon leurs noms afin de pouvoir les afficher sur l'interface Web.
  
  # Utilisation du site
  
  La page d'accueil ne contient qu'un bouton permettant de lancer la recherche des appareils connectés sur le réseau local. Cette recherche dure environ 5 secondes. 
  
  Ensuite, on arrive sur la page *decouvre.php* qui affiche les appareils trouvés dans un tableau. On peut choisir celui ou ceux que l'on veut utiliser. Il est également possible de relancer la recherche ou de retourner sur la page d'accueil.
  
  Après avoir sélectionné un appareil, on arrive sur la page *main.php*. Cette page affiche l'interface de l'appareil sélectionné, avec :
  
  * Une image de l'appareil, qui se rafraichit toutes les secondes ; 
  
  * Ainsi qu'un panel de commande avec les différentes commandes que l'on peut réaliser sur l'appareil.
  
  Si plusieurs appareils ont été sélectionnés, les interfaces apparaitront les unes en dessous des autres. Il est également possible de retourner sur la page d'accueil ou de relancer la recherche des appareils depuis cette page.
  
  # Comment ajouter un nouvel appareil à l'interface ?
  
  ## Verification de la compatibilité d'un appareil avec LXI
  
  Avant de pouvoir créer une nouvelle interface pour un appareil, il est impératif de vérifier sa compatibilité avec les commandes LXI. Sans cette compatibilité, il n'est pas possible de commander l'appareil à distance et donc inutile de l'ajouter à l'interface Web. Il faut également que le package lxi-tools soit installé sur l'ordinateur avec lequel on veut tester.
  
  Pour commencer, il faut assigner une adresse IP valable à l'appareil (pour cela, il faut regarder la datasheet de l'appareil pour savoir comment modifier son adresse IP). 
  
499dfbda   lwadbled   fix(README.md): Q...
69
  Ensuite, on branche l'appareil sur une prise Ethernet, et, dans un terminal, on entre la ligne de commande `lxi discover`. Cette commande va afficher tous les appareils possèdant une interface LXI connectés au réseau. Si l'appareil n'apparait pas, on peut essayer la commande **ping** avec son adresse IP pour vérifier que l'appareil est bien connecté. Si le ping fonctionne, alors l'appareil ne possède pas d'interface LXI. On peut néanmoins essayer de réaliser la prochaine étape, cela voudrait dire que l'on doit garder en mémoire l'adresse IP de l'appareil si on veut réaliser son interface Web. En effet, la page de recherche (*decouvre.php*) utilise la commande `lxi discover` pour trouver les appareils utilisables. 
b186066f   lwadbled   fix(README.md): E...
70
  
499dfbda   lwadbled   fix(README.md): Q...
71
  La prochaine étape consiste à réaliser une première capture d'écran de l'appareil, ce qui permettra de l'afficher ensuite sur l'interface. Pour cela on utilise la commande `lxi screenshot -a 111.111.111.111 screenshot.bmp` (111.111.111.111 représentant l'adresse IP de l'appareil et screenshot.bmp le fichier où est sauvegardée la capture d'écran).
b186066f   lwadbled   fix(README.md): E...
72
  
499dfbda   lwadbled   fix(README.md): Q...
73
  Pour finir la vérification, il faut rechercher les commandes SCPI pour l'appareil. Ces commandes permettent de piloter l'appareil à distance, ce sont elles que l'on va utiliser pour réaliser les commandes sur l'interface. La syntaxe de la ligne de commande à entrer dans le terminal est : `lxi scpi -a 111.111.111.111 "CMD"` (111.111.111.111 représentant l'adresse IP de l'appareil et CMD la commande SCPI). 
b186066f   lwadbled   fix(README.md): E...
74
75
76
  
  Si tout a correctement fonctionné, l'appareil est compatible avec LXI et l'on peut passer à l'étape suivante. 
  
499dfbda   lwadbled   fix(README.md): Q...
77
  ## Modification/Ajout de code
b186066f   lwadbled   fix(README.md): E...
78
79
80
81
82
83
84
  
  Après avoir vérifier la compatibilité de l'appareil avec LXI, on souhaite écrire le code correspondant à son interface de visualisation et de commande. 
  
  Tout d'abord, il faut modifier le fichier *bdd.json* et ajouter le nom de l'appareil ainsi que son type. 
  
  Si c'est un nouveau type d'appareil, il faut alors créer un nouveau dossier ayant le même nom que le type de l'appareil. A l'interieur de ce dossier, il faut créer un fichier ayant pour nom *main_type.php* (donc *main_multimetre.php* si c'est un multimetre par exemple) et un fichier *commandes_type.php*. Dans le fichier *main_type.php*, il faut utiliser le script de creation d'image avec la ligne de code en PHP : 
  ```php 
499dfbda   lwadbled   fix(README.md): Q...
85
  include('Scripts/creation_img.php');
b186066f   lwadbled   fix(README.md): E...
86
87
88
89
90
91
92
93
94
95
  ```
  Ensuite, afin de rendre le code plus facilement modifiable par la suite, il faut séparer les différentes commandes dans différents dossiers. Dans ces dossiers, on ajoute deux fichiers PHP, l'un correspond à l'affichage du bouton permettant de lancer la commande (avec un nom comme par exemple *form_bouton.php*), et l'autre correspond à la réalisation de la commande (avec un nom comme *cmd_bouton.php*). A l'interieur de ce dernier, pour réaliser la ligne de commande lxi, il faut utiliser la fonction php `shell_exec`. Concernant la façon d'afficher les différents paramètres sur la page, c'est à vous de le réaliser.
  
  Puis il faut faire en sorte que le fichier *commandes_type.php* utilise tous les fichiers *cmd* dans les sous dossiers (pour réaliser les commandes), et de même pour le fichier *main_type.php* qui utilise les fichiers *form* dans les sous dossiers. Pour ce faire, on parcours les dossiers avec la fonction PHP `scandir` et on utiliser la fonction `include` pour inclure les fichiers souhaités.
  
  Si le type de l'appareil existe déjà dans l'arborescence, plusieurs options se dégagent : 
  
  * Si les commandes SCPI sont les mêmes que les autres appareils du même type, il n'y a rien d'autre à modifier.
  
  * Si les commandes SCPI sont différentes, il faut alors modifier l'arborescence dans le dossier du type, et placer un sous-dossier selon le nom de l'appareil qui contiendra toutes les sources permettant de réaliser l'affichage des boutons et les commandes. Dans ce cas, il faut également modifier le fichier PHP se trouvant dans le dossier du type (qui est sous la forme *main_type.php*) pour modifier sa facon de parcourir les dossiers. Après cette réorganisation, on peut réaliser l'ajout du code comme expliqué précédemment.