  
<ifauth @prof>  
si à l'ouverture du projet QT, on a Aucun kit valide trouvé,

cliquer sur options en bleu et choisir qt 5.11.3 in path(qt5)

Version de Qt: Aucune

il faut faire: 
   sudo apt install -y qt-sdk gdb  
   sudo apt update   
   sudo apt install -y qt5-qmake qt5-default libqwt-qt5-dev  qtmultimedia5-dev  gdb-python2 gitk

puis cliquer sur options en bleu et choisir qt 5.11.3 in path(qt5)


et cliquer sur Configurer

</ifauth>


{{https://bvdp.inetdoc.net/files/iut/tp_pic/warning.jpeg}}
<color red>
POUR ACCEDER A L'INTEGRALITE DU SUJET DE TP:
</color>

<color red>
Si vous êtes en salle ER2AU, se connecter (en cliquant en haut à droite sur s'identifier) en tant que :  utilisateur=au, mot de passe=au 
</color>   

<color red>
Si vous êtes en salle ER2EN, se connecter (en cliquant en haut à droite sur s'identifier) en tant que :  utilisateur=en, mot de passe=en    
</color>

<color red>
Si vous êtes en chez vous, et que vous n'arrivez pas à vous connecter via SSH et VNC à une salle de TP, se connecter (en cliquant en haut à droite sur s'identifier) en tant que :  utilisateur=app, mot de passe=app
</color>


<color red>
Si vous êtes en chez vous, et que vous arrivez à vous connecter via SSH et VNC à une salle de TP, se connecter (en cliquant en haut à droite sur s'identifier) en tant que :  utilisateur=dist, mot de passe=dist
</color>


Polycopié du cours: https://bvdp.inetdoc.net/files/iut/cours_preparation_pic_qt_2021_complet_numbered.pdf

et:   https://bvdp.inetdoc.net/files/iut/cours_POO_intro_complet_2021_numbered.pdf


===== TP Initiation à l'API Réseau de QTCreator et utilisation d'un réseau local pour l'échange de données via  sockets UDP===== 

Ce TP est la suite du tp: [[tppic]]

 
__Objectifs :__
  - Utiliser l'outils de développement d'application sur PC QTCreator.
  - Utiliser une librairie de gestion des sockets.
  - Appliquer les concepts de POO pour utiliser des librairies Objets.
  - Illustrer la communication via sockets entre applications sur une même machine (PC)
  - Illustrer la communication via sockets entre applications sur des machines différentes (PC et micro contrôleur PIC)


On souhaite maintenant faire dialoguer chaque carte PIC avec une application tournant sur le PC étudiant correspondant. Dans un premier temps, vous utiliserez sur le PC étudiant l'exécutable BroadcastReceiver fourni puis vous écrirez votre propre exécutable sur PC en utilisant l'outil de développement QTCreator. A la fin du TP, vous utiliserez également l'outil d'analyse réseau pour vérifier la communication.


====Identification des éléments utiles sur le schéma et analyse des couches réseaux ====
Repérer sur le schéma de la page imprimée fournie au premier TP les éléments utilisés pour faire dialoguer la carte PIC avec le PC étudiant. Identifier les numéros de ports UDP utilisables. Proposer les modifications nécessaires au programme du PIC.
  
  
Le résultat de cette analyse est que vous devez utiliser les numéros de ports 2700 et 2701 pour échanger des informations depuis le PC.


Le schéma suivant récapitule l'ensemble des matériels et logiciels que nous allons utiliser dans cette série de TP. Les différents éléments seront expliqués au fur et à mesure. <color red>A chaque étape, vous devez être capable d'identifier les portions utilisées et leur rôle. Vous devrez remplir les cases jaunes sur la feuille distribuée lors du TP.</color>


{{https://bvdp.inetdoc.net/files/iut/tp_pic/schemareseauPIC-2018-au-en-horizontal.png}}


====Utilisation de l'application BroadcastReceiver sur les PC étudiant====
L'application que vous devez développer vous est fournie dans un premier temps afin que vous la voyez fonctionner et sachiez ce que vous devez faire. Une application fonctionnant sur le PC et simulant le PIC est également fournie pour faciliter le développement et permettre aux étudiants n'ayant pas terminé le programme sur le PIC de faire ce TP.
  
<ifauth @app>  
Récupérer les fichiers nécessaires, et dezipper: https://bvdp.inetdoc.net/files/iut/td_fifo/install_qt5_windows/QTbroadcastreceiveretudiantEtBinairesWindowsQT5.zip

</ifauth>

<ifauth @au,@en,@dist>   
Récupérer les fichiers nécessaires en saisissant dans une console:
  echo 'commence'
  cd ~/
  wget  https://bvdp.inetdoc.net/files/iut/tp_qt/binaries.zip
  unzip binaries.zip 
  rm binaries.zip
  cd binaries
  ./testenlocal.sh  
  echo 'fini'
</ifauth>


====Test des applications en local sur le PC====
Dans les dossiers récupérés se trouve un exécutable permettant de simuler la carte PIC. Il y a également le fichier de script .bat ou .sh qui permet de lancer simupic pour qu'elle utilise les  bons numéros d'IP et de port (que vous avez du déterminer à l'exercice précédent) . Ce programme permet de simuler la carte PIC et de développer l'application sur PC sans avoir besoin de la carte PIC. Pour le test en local, vous pourrez utiliser l'adresse IP de la boucle locale (127.0.0.1).

<ifauth @prof>
===Configuration du script pour simupic===
Dans le dossier simupic, configurer l'application simupic en éditant le script « lancersimupic.bat » (click droit,  modifier) pour configurer l'IP et les ports UDP en émission et en réception. La syntaxe est la suivante:
  start  simupic.exe ipachanger port1achanger port2achanger paramètres_optionnels_de_réglages_de_la_fenêtre
par exemple: 
  start  simupic.exe ipachanger port1achanger port2achanger 2 25 700 80   
===Configuration du script pour QTbroadcastreceiver===
Dans le dossier socketqtbroastreceiver, configurer l'application BroadcastReceiver en éditant le script « lancebroadcastreceiver.bat » (click droit,  modifier) pour configurer l'IP et les ports UDP en émission et en réception. La syntaxe est la suivante:
   broadcastReceiver IP_destination port_UDP_émission port_UDP_réception paramètres_optionnels_de_réglages_de_la_fenêtre
par exemple: 
  start broadcastreceiver 192.168.1.100 27016 27017 10 40 500 130   
===Test en local===
Lancer les deux scripts .bat et vérifier que les deux applications ouvertes communiquent correctement.

</ifauth>


<ifauth @app>
===Configuration du script pour le test en local===
Dans le dossier dezippé, configurer l'application BroadcastReceiver en éditant le script « testenlocal.bat » (click droit,  modifier) pour configurer l'IP et les ports UDP en émission et en réception. La syntaxe est la suivante:
  start broadcastReceiver.exe IP_destination port_UDP_émission port_UDP_réception paramètres_optionnels_de_réglages_de_la_fenêtre
par exemple: 
  start broadcastreceiver 192.168.1.100 27016 27017 10 40 500 130   

===Configuration du script pour simupic===
Dans le dossier dezippé, configurer l'application simupic en éditant le script « testsimu.bat » (click droit,  modifier) pour configurer l'IP et les ports UDP en émission et en réception. La syntaxe est la suivante:
  start  simupic.exe ipachanger port1achanger port2achanger paramètres_optionnels_de_réglages_de_la_fenêtre
par exemple: 
  start  simupic.exe ipachanger port1achanger port2achanger 2 25 700 80   

</ifauth>


<ifauth @au,@en,@dist>  
===Utilisation de simupic===
Saisir dans la console:
  echo 'commence'
  cd ~/binaries
  ./simupic  &   
  echo 'fini' 
</ifauth> 


====Développement de l'application PC avec QTCreator====
Vous devez maintenant développer votre propre application **QTbroadcastreceiver**.

<ifauth @prof>
 (ou QTbroadcastreceiveretudiantAU1.zip si vous êtes motivés pour faire vous même plus de travail et après accord de l'enseignant).  
</ifauth>


<ifauth @prof>
<color #FF0000>Il est nécessaire d'utiliser QTcreator version 4.6 pour ce TP. Vous veillerez donc à utiliser l'icone "Qt Creator" et pas l'icone "Qt Creator (Community) 5.4".</color>
</ifauth>

<ifauth @prof>
Note pour la Migration de qt4 vers qt5:


https://wiki.qt.io/Transition_from_Qt_4.x_to_Qt5

http://www.yourownlinux.com/2015/04/sed-command-in-linux-append-and-insert-lines-to-file.html


</ifauth>

<ifauth @au,@en,@dist>
  
  echo 'commence'
  cd ~/
  wget  https://bvdp.inetdoc.net/files/iut/tp_qt/QTbroadcastreceiveretudiantAU2ET3.zip
  unzip QTbroadcastreceiveretudiantAU2ET3.zip
  rm QTbroadcastreceiveretudiantAU2ET3.zip
  cd QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant/
  rm broadcastreceiver.pro.user
  echo "Migration qt4 vers qt5"
  sed -i '/QT += network/ a QT += widgets' broadcastreceiver.pro  
  sed -i 's/#include <QtGui>/#include <QtWidgets>/g' receiver.cpp
  qmake broadcastreceiver.pro
  echo 'fini'
  
<color red>  
Important: COCHER la configuration DEBUG  puis Cliquer sur Configurer le projet.
</color>
</ifauth>

==Ouverture du projet ==
POUR OUVRIR LE PROJET avec QTCreator après l'avoir récupéré, vous devrez Copier/coller dans une console:

  echo 'commence'
  cd ~/QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant
  qtcreator broadcastreceiver.pro  &
  echo 'fini'

<ifauth @au,@en,@dist>  
==Initialisation du système de gestion de version en local==
POUR LA PREMIERE SEANCE UNIQUEMENT!, Copier/coller dans une console:

  echo 'commence'
  cd ~/QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant
  git init
  git add broadcastreceiver.pro  dialog.ui  main.cpp  receiver.cpp  receiver.h
  git commit -m'initial version'
  gitk &
  echo 'fini'

Vous pouvez ensuite fermer l'outils gitk qui permet de voir les changements entre les différentes versions.
</ifauth>  
  

===Structure du projet===
 
Le projet est constitué des fichiers sources d'une application graphique sous QT. Votre code sera saisi dans l'implémentation de la fenêtre principale, à l'intérieur du fichier Sources->receiver.cpp. <color #FF0000>. Les définitions des méthodes et objets de la fenêtre principale sont quant à elles faites dans le fichier receiver.h. Ce sont les deux seuls fichiers que vous aurez à modifier jusqu'à nouvel ordre. </color> Pour information le projet contient également: 
   .pro      fichier décrivant le projet QT, les règles de compilation, les librairies à utiliser etc...
  main.cpp       fichier décrivant le programme principal, qui se contente de lancer la fenêtre principale.
 
NB: <color #FF0000>Nous utiliserons sur le PC étudiant un seul Objet UdpSocket pour l'émission et la réception.</color>

===Notice d'utilisation de l'outils QTCreator===
Une fois le projet ouvert, l'utilisateur peut choisir entre plusieurs mode d'affichages, notamment "Editer" et "Debogage" à l'aide des boutons sur la gauche de la fenêtre.

La fenêtre Projets fait apparaître les fichiers du (des) projet(s) ouvert(s), triés selon leur type. Sur la droite, la fenêtre affiche le contenu d'un fichier sélectionné.

**CTRL+Click souris gauche** sur un mot du programme permet de se déplacer à la déclaration d'une variable, d'un objet, d'une fonction, d'un type ou autre. Cela sera très utile pour connaître par exemple les méthodes utilisables sur un objet d'une certaine classe.

**CTRL+B** permet de compiler l'application, la fenêtre Sortie de compilation permet alors d'observer les éventuelles erreurs, sur lesquelles vous pourrez cliquer pour aller à la ligne correspondante dans le code.

**CTRL+R** permet d’exécuter le programme. Le programme devra être fermé en cliquant sur le bouton croix de la fenêtre avant de le recompiler ou de l’exécuter à nouveau.

**F5** permet d'exécuter le programme en mode DEBUG. L'utilisateur passe alors en mode Debug, ce qui ajoute à l'affichage une zone à droite dans laquelle l'utilisateur pourra observer les variables et leurs valeurs. L'utilisateur pourra placer ou retirer des points d'arrêt en cliquant à gauche du numéro de ligne d'un fichier. Il pourra exécuter en pas à pas sans rentrer dans les fonctions à l'aide de **F10** ou bien en entrant dans les fonctions à l'aide de **F11**. Il pourra ajouter une variable particulière à la liste des variables affichées en Debug en selectionant le nom de la variable dans le fichier programme et en cliquant droit dessus puis clic gauche sur **ajouter un évaluateur d'expression**.
  
====Émission depuis le PC====  

Afin que l'application à développer sur PC soit capable d'émettre les datagrammes pour piloter la carte PIC, il faut implémenter une méthode ** void Receiver::sendUDP(int i)**, (i code le numéro de la led à allumer, donc le bouton  pressé de l'application sur le PC). Cette méthode devra faire les actions suivantes:
  - Définir une variable de type **QHostAddress**  (par exemple **destIP** )
  - Appeler la méthode **bool QHostAddress(const QString & addrIP)** de l'objet  **destIP** pour régler l'IP du dispositif avec lequel communiquer à l'aide d'une chaine de caractères **addrIP**.
  - Définir une variable de type **quint16**  pour coder le numéro du port UDP destination (par exemple destPort=4567;)
  - Définir un tableau de caractères (par exemple **chaine[]**) et générer la chaîne pour piloter les leds (par exemple avec la fonction sprintf comme pour le PIC)
  - Pour émettre la chaîne **chaine** sur la socket, appeler la méthode **qint64 writeDatagram(const char * chaine, qint64 len, const QHostAddress host, quint16 port);** de l'objet **udpSocket**. Pour le paramètre **len** utiliser la valeur **(qint64)strlen(chaine)+1** (car on envoie le contenu de la chaine + le caractère \0 terminateur de chaine.
  
La méthode **void Receiver::sendUDP(int i)** est appelée lorsque l'utilisateur presse un des boutons, le paramètre i codant le numéro du bouton. 

Tester que l'appui sur le bouton i commute bien la led i du simulateur.
  

{{https://bvdp.inetdoc.net/files/iut/tp_pic/validation.png}} Une fois les réponses validées, mettre à jour le suivi de version en saisissant dans une console:

  echo 'commence'
  cd ~/QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant
  git commit -a -m'emission'
  gitk & 
  echo 'fini'


====Réception sur le PC====  
===Réglage du constructeur de la fenêtre===
Contrairement à l'émission, qui survient à un moment maîtrisé par le programme (lors de l'appel de la méthode **sendUDP**), la réception doit pouvoir se faire à tout instant. Pour cela, un mécanisme proche d'une interruption matérielle est mis en place: lorsqu'un datagramme est reçu, une fonction est appelée pour le traiter. Comme avec les interruptions, il est nécessaire d'initialiser ce mécanisme et cela est fait dans la méthode constructeur de la fenêtre, qui est appelée lors de sa création.

Pour cela, ajouter dans la méthode constructeur de la fenêtre **Receiver::Receiver(QWidget *parent)    : Qdialog(parent)**  le réglage de l'IP du dispositif avec lequel communiquer et le port UDP en réception sur le PC.
  QString m_destIP="1.1.1.2";  //à remplacer par l'IP
  unsigned int m_portIn=1234;  //à remplacer par le port UDP à écouter
Ajouter à l'endroit indiqué après la création de udpSocket l'attache de udpSocket au port Udp:   	
  udpSocket->bind(m_portIn, QUdpSocket::ShareAddress);
Et connecter le signal readyRead() au slot processPendingDatagrams() en utilisant:
  connect(udpSocket, SIGNAL(readyRead()), this, SLOT(processPendingDatagrams()));

Ainsi la méthode **processPendingDatagrams()** sera automatiquement appelée à la réception d'un datagramme sur le numéro de port choisi.
 

===Implémentation de  la méthode de réception===
Il vous faut maintenant implémenter la méthode **void Receiver::processPendingDatagrams()** pour traiter les datagrammes reçus:

  - Pour déterminer si il y a des datagrammes disponibles en réception, appeler la méthode **bool hasPendingDatagrams();** de l'objet **udpSocket**. 
  - Pour connaître le nombre d'octets que l'on peut lire sur la socket, appeler la méthode **qint64 pendingDatagramSize()** de l'objet **udpSocket**.
  - Pour lire  le  contenu du datagramme, appeler la méthode **qint64 readDatagram(char *data, qint64 maxlen);**  de l'objet **udpSocket** (Comme pour le programme du PIC, on veillera à ne pas lire plus de données que ce que le tableau data peut contenir).
  - Utiliser la fonction sscanf pour décoder le datagramme reçu **int sscanf(char *chaine, const char * format, …)**
  - Régler les valeurs de variables codant l'état des boutons (b1,b2,b3)
  - Régler les afficheurs de la fenêtre (sw1,sw2,sw3) en appelant la méthode **void setChecked(bool);** de chacun des trois objets sw1 à 3 . Appeler également la méthode setText(char * chaine) de l'objet statusLabel pour afficher les caractères ASCII reçus.
 
Tester que l'appui sur le bouton i dans l'application simupic est bien répercuté sur votre application.

  
{{https://bvdp.inetdoc.net/files/iut/tp_pic/validation.png}} Une fois les réponses validées, mettre à jour le suivi de version en saisissant dans une console:
  echo commence
  cd ~/QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant
  git commit -a -m'reception'
  gitk & 
  echo fini
  

=====Test en conditions réelles de communication entre le PC et la carte PIC =====
Il est maintenant temps de tester votre application PC avec votre application PIC, pour cela:

  - Déterminer les adresses IP et MAC de l'adaptateur réseau Realteck du PC étudiant en lançant la commande "ip addr ls" dans une console.
  - Modifier le code du PIC en conséquence (adresse IP (et MAC si vous n'avez pas implémenté l'ARP sur le PIC) destinataire et les numéros de ports).
  - Modifier le code du programme PC en conséquence (adresse IP de la carte PIC et les numéros de ports).


Utilisez l'application Wireshark pour observer le traffic entre le PC et le PIC 
(détails d'utilisation sur la page [[wireshark]]):
 
  - Choisir l'interface à espionner (carte Realtek) dans la liste des interfaces.
  - Régler un filtre pour n'afficher que les trames d'intérêt, par exemple saisir udp dans la zone filter. 
  - Localiser les trames échangées entre le pc et la carte PIC.
  - Repérer les champs correspondants aux différentes couches réseau.

   
{{https://bvdp.inetdoc.net/files/iut/tp_pic/validation.png}} Une fois les réponses validées, mettre à jour le suivi de version en saisissant dans une console:
  echo commence
  cd ~/QTbroadcastreceiveretudiantAU2ET3/QTbroadcastreceiveretudiant
  git commit -a -m'avec carte pic'
  gitk &
  echo fini


<ifauth @prof>
=====Aller plus loin avec QTcreator (si vous avez utilisé QTbroadcastreceiveretudiantAU1.zip) =====

===Fonctions pour la gestion des 3 boutons===

Pour permettre l'utilisation de la fonction **void Receiver::sendUDP(int i)** afin de piloter les autres leds, vous devrez faire les actions suivantes:


Dans le fichier receiver.h, ajouter:
  - les définitions des boutons pour les leds 1 et 2
  - les méthodes associées  dans la partie private slots: 
Dans le fichier receiver.cpp, implémenter les fonctions correspondant à l'appui sur les boutons (appel de **sendUDP(i)** ) et ajouter dans la méthode constructeur de la fenêtre: 	
  - la construction des objets boutons (new)
  - la connexion de l'événement « click sur les boutons » au slots correspondants
  - le placement des boutons sur la fenêtre (button1Layout->addWidget...)
</ifauth>
===Gestion du Timer sur le PC===


===Ajout de la fonction d'émission périodique de commandes de commutation LED0===

  - Décommenter la création de **commutTimerButton** et de **Timer** ainsi que les implémentations de **void Receiver::commutTimer()** et de **void Receiver::on_timer_Event()**
  - Tester votre application avec Simupic


{{https://bvdp.inetdoc.net/files/iut/tp_pic/validation.png}}