You are on page 1of 34

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

2
Table des matires
I Lentreprise Nova-Flore ...................................................................................................................... 4
II - Objectif du Service R&D ..................................................................................................................... 4
III - Cahier des charges ............................................................................................................................ 5
I Objectifs du projet .......................................................................................................................... 5
II Rcolte des donnes sur le terrain ................................................................................................ 5
I Droulement actuel des observations: ....................................................................................... 5
II Les observations suite notre projet : ...................................................................................... 6
III - Les contraintes .............................................................................................................................. 6
IV - Expression du besoin ........................................................................................................................ 7
I - Le Besoin Actuel .............................................................................................................................. 7
Grer les Taxons : ............................................................................................................................ 7
Grer les essais : .............................................................................................................................. 8
Collecter : ......................................................................................................................................... 8
Observer : ........................................................................................................................................ 8
Synchroniser : .................................................................................................................................. 8
Configurer : ...................................................................................................................................... 9
II - Scenario .......................................................................................................................................... 9
V-Diagrammes de Classe ....................................................................................................................... 10
I - Gestion des essais .......................................................................................................................... 10
II - Taxon Faune ................................................................................................................................. 11
III - Taxon Flore .................................................................................................................................. 11
IV - Observation : ............................................................................................................................... 12
VI Conception prliminaire ................................................................................................................. 13
I Diagramme de dploiement ......................................................................................................... 13
II - Rpartition des Taches ................................................................................................................. 14
VII - Choix Techniques ........................................................................................................................... 15
I - Pourquoi Apache : ......................................................................................................................... 15
II - Pourquoi MySQL : ......................................................................................................................... 15
VIII - Installation .................................................................................................................................... 16
I - Installation du serveur apache : .................................................................................................... 16
II - Installation de la base de donnes MySQL : ................................................................................. 16
IX - Les langages PHP & MySQL ............................................................................................................. 17
I - Mise en place de la Base donnes : ............................................................................................... 17
II - Tables & Champs : ........................................................................................................................ 17
III - Interactions avec la Base de donnes : ....................................................................................... 18

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

3
IV - Les Formulaires Html : ................................................................................................................. 19
V - La classe PHP : .............................................................................................................................. 19
Lapplication FlorExpert permet de : ............................................................................................. 19
X - Conception Prliminaire ................................................................................................................... 20
I - Mise en place de la Base de donnes : .......................................................................................... 20
Taxon Faune & Taxon Flore : ......................................................................................................... 21
Les Tables dassociation : ............................................................................................................... 21
La table insectesObserve peut tre associe : ............................................................................ 21
La Table Unit Experimentation peut tre associe : ................................................................ 21
XI - Conception dtaille ....................................................................................................................... 22
I-Les Templates : ................................................................................................................................ 22
Template CSS: ................................................................................................................................ 22
Template Alertify : ......................................................................................................................... 22
Template JSChart : ......................................................................................................................... 22
II - Diagrammes de classes de lapplication : ..................................................................................... 23
III - Exemple dutilisation des classes: ............................................................................................... 26
III - Gnrateur de select : ................................................................................................................. 28
IV - Application Type : ........................................................................................................................ 29
X - Prsentation de lapplication ........................................................................................................... 31
I - Page de Login : ............................................................................................................................... 31
II - Page de Service : ........................................................................................................................... 31
XII - Les Problmes rencontrs .............................................................................................................. 33
I - Fluidit : ......................................................................................................................................... 33
II - Ergonomie : .................................................................................................................................. 33
III - Affichage Graphique : .................................................................................................................. 33
XIII - Bilan ............................................................................................................................................... 34
XIV - Conclusion ..................................................................................................................................... 34


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

4

I Lentreprise Nova-Flore

Lentreprise Nova-Flore est spcialise dans les semences de
fleurs de jardins et de fleurs sauvages, elle se distingue par sa capacit
laborer des mlanges innovants, issus de la recherche et du
dveloppement. Nova-Flore met disposition une offre de graines
pour tous les types despaces et tous les types de publics (responsables
de collectivits, architectes-paysagers, exploitants agricoles et
jardiniers amateurs).

Notre projet consiste assister lentreprise dans la rcolte de donnes issues des observations, qui se
font actuellement via des feuilles dessais et de calculs en papier. Ces observations sont faites sur des
mlanges floristiques venant de diffrentes parcelles dexprimentation.

II - Objectif du Service R&D

L'objectif du service Recherche & Dveloppement est de
proposer des solutions pour offrir un meilleur habitat ainsi quune
ressource de qualit aux pollinisateurs.
Les pollinisateurs sont des insectes qui transportent le pollen dune
fleur lautre. Par exemple les papillons, les abeilles et les bourdons.
Ces pollinisateurs jouent un rle particulirement important dans la
pollinisation des cultures, la lutte contre les insectes nuisibles, et le
maintien de l'quilibre cologique.
Crer des solutions pour les pollinisateurs consiste dvelopper des mlanges floristiques. Ces
mlanges sont constitus de diffrentes varits de fleurs. Ils sont destins des groupes dinsectes
prcis, cest--dire les pollinisateurs. Lobjectif tant de proposer des solutions pour offrir un habitat
et une ressource de qualit.
Les ressources de qualits dont il est question sont des fleurs (espces pures ou mlanges), qui attirent
les pollinisateurs et leurs procurent un pollen dexception pour amliorer la pollinisation.
Dans loptique de permettre une meilleure pollinisation afin de prserver les pollinisateurs des dangers
actuels (disparition des abeilles, traitement base de pesticides, prdateurs asiatiques), le Service R&D
de Nova-Flore fait rgulirement des essais sur diffrents mlanges floristiques afin de connaitre les
caractristiques ncessaires pour attirer les pollinisateurs.

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

5
III - Cahier des charges

I Objectifs du projet


II Rcolte des donnes sur le terrain

Les essais sont faits par un observateur expert en entomologie pour rcolter des donnes en
menant des observations sur le terrain. Les observations consistent dnombrer visuellement les
insectes ou de les capturer au filet.
Les essais sont labors par un chercheur au laboratoire ou par lobservateur
lui-mme. Un essai consiste regarder quels insectes sont prsents sur quelles
fleurs pendant un temps dfini.
I Droulement actuel des observations:

Les observations se font laide dun formulaire papier qui sert de
support lessai. Lobservateur notera toutes les informations concernant
lessai. Une fois lobservation termine et les essais achevs, celui-ci
retourne au laboratoire pour dlivrer le formulaire avec les rsultats. Ces
donnes seront intgres dans le systme du laboratoire.








Assister la saisie des essais par tablette
Faciliter le traitement des donnes.
Amliorer la visualisation des donnes.

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

6
II Les observations suite notre projet :

Nova-Flore souhaiterait automatiser lobservation et la rcupration des donnes de
lobservation. Notre but est de dvelopper des applications pour assister la saisie des essais,
faciliter le traitement des donnes. De plus, nous mettons en uvre une
exploitation graphique des rsultats.
Pour la saisie des essais, Nova-Flore souhaite utiliser des tablettes tactiles
pour leur confort. Notre but sera donc de dvelopper une application qui
assistera lobservateur la saisie des essais.
Une fois lobservation termine, lobservateur ou le chercheur naura pas saisir manuellement les
rsultats de lobservation. Car de faon automatique les donnes rcoltes seront transfres avec
la base de donnes du laboratoire.
Une application sera dveloppe pour lexploitation des rsultats. Cette application amliorera la
visualisation des donnes.

III - Les contraintes

Les sites d'observation peuvent tre proches du laboratoire (parcelles d'exprimentation) ou
en milieu naturel. La saisie des donnes doit donc s'effectuer hors connexion, les rseaux Wi-Fi ou 3G
n'tant pas toujours accessible sur les sites d'observation. Les donnes saisies hors connexion seront
injectes dans la base de donnes du laboratoire lors du retour de mission d'observation. Un protocole
de synchronisation devra tre respect.

















05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

7
IV - Expression du besoin

I - Le Besoin Actuel

Ci-dessous le diagramme de cas dutilisation du projet :

Le chercheur peut effectuer les mmes actions que lobservateur.
Lobservateur dispose dune application pour tablette et le chercheur dune application web.
Voici les descriptions des Cas dutilisations :


Dfinition : Un taxon est le recensement volutif des espces animales et vgtales selon des
critres prdfinis.


Grer les Taxons :
Grer les taxons consiste ajouter, modifier ou supprimer.
Grer les critres de taxonomie consiste identifier, nommer et classer les espces.



05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

8

Dfinition : une Unit dexprimentation est un ensemble de plusieurs fleurs dune mme varit.





Grer les essais :
Le chercheur organise les prochaines exprimentations. Cest--dire quil :
Cre ou modifie des essais.
Associe des taxons dinsectes observer chaque essai.
Cre ou modifie des units dexprimentations.
Associe chaque unit des taxons de fleur.
Associe les units dexprimentations lessai.


Collecter :
Pour collecter il est ncessaire dobserver et de synchroniser.
Collecter consiste :
Pour lobservateur, rcuprer les essais dfinis par le chercheur.
Pour le chercheur, rcuprer les essais effectus par lobservateur.
Lobservateur peut grer les essais depuis la tablette.



Observer :
Les observations sont saisies sur la tablette par lintermdiaire de lapplication nomme
florObserver .
Lobservateur devra :
Sidentifier sur lapplication.
Slectionner le ou les essais effectuer.
Effectuer le ou les essais.
Lapplication affichera une interface conviviale disposant dun chronomtre et de la liste
des taxons dinsectes observer.
Synchroniser :
La synchronisation consiste transfrer les essais valids depuis la tablette vers la base de
donnes du laboratoire en assurant la cohrence et la transmissions des informations.
La synchronisation se compose en 3 tapes :
Identification des essais.
Vrification des cohrences des informations.
Transfert des informations.



05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

9

II - Scenario

Voici un exemple de scnario mettant en uvre les cas dutilisation mentionn ci-dessus :
Le chercheur crer un essai depuis lapplication web.

Il associe lessai des taxons dinsectes observer, par exemple les abeilles et papillons.

Il dfinit une date de dbut et de fin ainsi quune dure dobservation, par exemple du
10/02/2014 au 22/02/2014, avec une dure dobservation de 5 minutes.

Il crer une ou plusieurs unit(s) dexprimentation. Parmi eux, une unit dexprimentation
seme avec des graines de marguerites et de tulipes.

Il associe les units dexprimentations dont lessai .

Un observateur part pour une observation, il synchronise dabord la tablette pour rcuprer
lessai et les informations ncessaires lobservation.

Il se rend sur lunit dexprimentation .

Il se connecte sur lapplication floreObserver puis slectionne lessai .

Sur la tablette saffiche un compteur de 5 minutes et la liste des insectes dnombrer, cest-
-dire dans notre cas les abeilles et papillons. Saffiche aussi la liste des fleurs de lunit
dexprimentation , cest--dire dans notre cas les marguerites et tulipes.

Lobservateur lance le chronomtre, lobservation commence.

A chaque fois quil voit un insecte sur une fleur, il complte les champs correspondants sur
lapplication. Par exemple 3 abeilles sur les marguerites et 2 papillons sur les tulipes.

A la fin du chronomtre lobservation se termine, lobservateur peut ajouter un commentaire
avant de valider lobservation, les rsultats seront stocks sur la base de donnes locale
avant dtre synchroniss lors du retour au laboratoire.

Configurer :
Ladministrateur est capable de modifier directement les tables de la Base de donnes. Il n'est
pas prvu de dvelopper une interface pour ladministrateur.



05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

10
V-Diagrammes de Classe

I - Gestion des essais

Le Chercheur organise lessai pour une saison entire. Il slectionne les units dexprimentation qui
serviront pour un Essai et quelles dates.
Il peut crer ou modifier des Essais et des Units.
Il associe chaque Essai, les Taxons d'insectes observer.
Il associe chaque Unit, les Taxons de fleurs qui seront sems. Il associe chaque Essai la ou les units
concernes ainsi que leur dnomination. Cette dnomination est un repre pour l'Observateur.







05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

11
II - Taxon Faune


Le Taxon de la Faune est soumis un niveau de classification qui permet aux entomologistes de
slectionner des familles, des ordres, des genres sils nont pas le nom de lespce en tte.
III - Taxon Flore



Les Taxons de Flore sont associs une ou plusieurs units dexprimentation. Ces units
dexprimentations sont rpartir sur plusieurs plateformes. Le Taxon de la flore est galement soumis
un niveau de classification.







05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

12
IV - Observation :





Une Observation est associe une position GPS pour localiser le lieu de lobservation, les
conditions mto du jour de lobservation. Les insectes Observe sont slectionn partir du Taxon
Faune li lessai. Lobservateur aura pralablement choisis une unit dexprimentation sur laquelle
il effectuera lobservation. Lobservateur aura galement la possibilit dinsrer des notes a
lobservation si besoin.

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

13
VI Conception prliminaire
I Diagramme de dploiement


Le systme sera constitu de 3 machines :
Le poste de travail dun chercheur qui laide dun navigateur internet pourra accder a
lapplication web floreExpert . Cette application lui permettra de grer les essais, les
units dexprimentations et les taxons. Pour cela il se connectera sur lintranet du
laboratoire.

Un serveur install sur le rseau intranet du laboratoire. Sur ce serveur sera install une base
de donnes EntomoFlore qui stockera les taxons, essais et units dexprimentation.
Lapplication web floreExpert accdera cette base de donnes. florSynchro servira
pour la synchronisation avec la tablette par Wi-Fi.


La tablette tactile tournera sous le systme dexploitation Android. Celle-ci embarquera une
copie partielle de la base de donnes EntomoFlore . Cette copie partielle de la base
( florData ) contiendra uniquement les informations ncessaires pour les essais effectuer
(taxons concerns par les units dexprimentations, dates dobservation). Lapplication
florObserver accdera la base florData pour y stocker les rsultats des observations
effectu avec la tablette.


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

14
II - Rpartition des Taches




















Etudiant n1 Partie Chercheur : BARBE Jeremy
Modle Conceptuel de donnes
Schma relationnel
Script de gestion des donnes
Application Web pour le chercheur : floreExpert
Scurit des donnes et transactions lors de la synchronisation tablette/SGBD
Exploitation statistique des rsultats (synthse, moyenne)
Etudiant n2 Partie Observateur - DOUINEAU Romain
Application floreObserver sur Android
Conception de l'iHMen accord avec le cahier des charges de l'entreprise
Conception du stockage local de donnes sur la Tablette
Synchronisation Tablette/SGBD

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

15
VII - Choix Techniques

Pour des raisons qui seront dtailles ci-dessous les choix retenus seront les suivants :
Utilisation dun Serveur Apache
Utilisation dune base de donnes MySQL

I - Pourquoi Apache :
Le type de serveur choisis sera Apache. Tout d'abord pour une question
de cot, et parce que c'est un logiciel libre. Apache peut fonctionner assez
bien sur des machines aux performances moindres, et aussi sur des
plateformes de logiciel libre tel que Linux tout en assurant une stabilit
du systme. D'o un cot de fonctionnement rduit du serveur Apache.
Tout type de script dynamique est excutable sur ce type de serveurs tels
que Perl, Python, PHP.
Selon une tude de NetCraft, Apache sert plus de 54% des sites web actuellement. La taille de la
communaut disponible en est tout aussi grande. Apache peut s'exporter sur de nombreux OS : Mac,
Windows, Solaris, Linux, Aix.


II - Pourquoi MySQL :

La base de donnes sera sous MySQL, car elle est distribue sous
licence GPL, mais aussi parce que c'est une des meilleures bases de
donnes. MySQL est notamment le meilleur compromis entre facilit
d'installation, performance et administration. Une majeure partie des
logiciels PHP a t dvelopp exclusivement pour MySQL, le nombre d'hbergeur PHP MySQL est en
consquence.


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

16
VIII - Installation
I - Installation du serveur apache :

Depuis le menu de lancement des applications, slectionnez Systme , puis configuration et
configuration de votre ordinateur .
Pour la version du lyce: Menu de lancement des applications puis outils->outil systme -> configurer
votre ordinateur.
Saisir apache dans l'onglet recherche puis lancer linstallation :
apache-mpm-prefork-2.2.4-6mdv2007.1x86_64.

Pour dmarrer le serveur en mode graphique, aller dans systme puis grer les services et
cochez alsa .

Pour dmarrer le serveur en ligne de commande :
se mettre en Super utilisateur.
Saisir la commande 1# /etc/init.d/httpd start.

II - Installation de la base de donnes MySQL :




Il faut en premier lieu mettre jours le paquet avec la commande suivante :
urpmi.update -a
Pour installer le serveur la commande suivante :
urpmi MySQL MySQL-client

Si le rseau n'est pas disponible, il peut tre modifi de la faon suivante :
vi /etc/my.cnf
o et mettre entre commentaire la ligne : skip-networking
Dmarrer la base de donnes MySQL :
/etc/init.d/mysqld start
On test si le rseau est maintenant disponible :
netstat -tap | grep mysql
On met en route la base de donnes :
mysqladmin -u root password yourrootsqlpassword
mysqladmin -h server1.example.com -u root password yourrootsqlpassword


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

17
IX - Les langages PHP & MySQL

I - Mise en place de la Base donnes :

Aprs avoir install la base de donnes MySQL, sur le serveur apache il est ncessaire de mener
une tude pour laborer le modle conceptuel de donnes. La cohrence de ce modle conceptuel de
donnes est primordiale, les erreurs lies une mauvaise conception sont en effet sources de
dysfonctionnements.

II - Tables & Champs :
Pour Insrer des champs, des enregistrement, ou crer des tables il y a deux moyens, soit on l
fait au travers de linterface PhP MyAdmin , soit par requete SQL en ligne de commande.
Via Requete SQL en ligne de commande :
CREATE TABLE `Hotel` (
`idHotel` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`Nom` TEXT NOT NULL ,
`Adresse` TEXT NOT NULL ,
`Rue` TEXT NOT NULL
) TYPE = innodb;
[Type de la base de donnes] [ Incrmentation [ idHotel est la clef primaire[
Gre par MySQL]

Via linterface de PhpMyAdmin :













05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

18
III - Interactions avec la Base de donnes :

Interagir avec une base de donnes est important, sans interaction le site n'a aucune profondeur, et
ne procure aucun service utile. Cette interaction est trs procdurale :
Il y a deux manires de le faire. La manire classique et la PDO.
Ici la mthode utilise avec MySQL :

Et ici la mthode PDO :

$bdd = mysql_connect("ex:192.168.1.2","User", "Password");
Slection de la base de donnes :
$db = mysql_select_db("BdName",$bdd);
On cre une requte:
$query = SELECT * FROM Hotel ;

Rcuprer le rsultat de la requte qui est actuellement inexploitable, il faut utiliser la
mthode mysql_query() pour obtenir une donne exploitable.

$result = mysql_query($query) ;

On stocke le rsultat de la requte dans un tableau. Ici il ny aura quun seul lment
lutilisation dun tableau nest donc pas ncessaire, mais lorsque le rsultat de la requte
retourne plusieurs rsultats il est impratif de les stocker dans un tableau.
$donnees = mysql_fetch_array($result) ;
Ensuite il suffit dutiliser le tableau de cette faon :
Echo $row[0] ;

On se connecte et on slectionne la base de donnes :
$bdd = new PDO('ex:127.0.0.1;Nom de la Bdd', 'User', 'Password');
On rcupre le rsultat de la requte :
$result = $bdd->query('SELECT nom FROM jeux_video LIMIT 0, 10');
Rcuprer le rsultat de la requte qui est actuellement inexploitable, il faut utiliser la
mthode fetch() en PDO pour obtenir une donne exploitable.

$donnees = $result->fetch() ;

Le rsultat de la requte est stock dans un tableau. Ensuite il suffit dutiliser le tableau de la
mme faon que ci-dessus :
Echo $donnees['nom'] ;


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

19
IV - Les Formulaires Html :

Pour transmettre des informations depuis le site vers la base de donnes, on a besoin de
requtes mais aussi d'une interface qui nous permettrait de rentrer facilement les donnes. Pour
cela on utilise des formulaires.
<form id="formulaire" method="POST" action="Traitement-formulaire.php">
<input type="text" name ="Nom" id="nom" placeholder="Nom" />
<input type="submit" value="Modifier" class="bouton" />
</form>
L'id du formulaire permet d'identifier le formulaire, la mthode POST nous permet de passer les valeurs
au script PHP par le protocole HTML.La balise action reprsente le fichier cible auquel le formulaire va
envoyer les valeurs de "nom".
V - La classe PHP :

Il est fortement conseill de faire une classe pour chaque table de la base de donnes pour
faciliter la gestion et l'utilisation de celles-ci mme si on ne les utilise pas dans l'application web. C'est
pourquoi toutes les mthodes concernant chaque champ de la table seront rpertories dans la classe
PHP spcialement ddie.
























Lapplication FlorExpert permet de :

Modifier nimporte quel champ de nimporte quelle table.
Crer des Essais.
Ajouter des Taxons Faunes et Flore.
Visualisation graphique des donnes.
Visualisation textuelle des donnes.
Li Taxon Flore dj existants une unit dexprimentation.



05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

20
X - Conception Prliminaire

Lapplication web du projet florento sera dveloppe selon trois axes :
La convivialit.
Lergonomie.
La visualisation.
Lapplication web devra tre intuitive et permettre facilement aux chercheurs daccder rapidement
aux options primordiales. Les diffrentes options de floreExpert seront donc listes dans un menu
droulant.
floreExpert sera directement relie la base de donnes pour en consulter les informations, les
donnes pourront tre visualises avec des graphiques gnrs par un JavaScript, lapplication sera
galement dot dune architecture Ajax permettant dactualiser les graphiques et les donnes de
lapplication en temps et en heures. floreExpert sera principalement dveloppe en Html/Php.

I - Mise en place de la Base de donnes :

Aprs avoir bien analys les besoins du cahier des charges, nous ( Moi, Mon partenaire Romain
Douineau et le professeur M.Gil) avons dfini ce schma relationnel:






05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

21
Taxon Faune & Taxon Flore :

Les deux tables sont identifies par un identifiant unique, et un identifiant du taxon
suprieur pour permettre de situer le taxon actuel par rapport la classification.
Cest la rcursivit.
Exemple :
Un Taxon A did 1, et didTaxon Suprieur : 0.
Le Taxon A nest pas inclus dans un Taxon Suprieur.
Un Taxon B did 1, et didTaxon Suprieur : 1.
Le Taxon B est inclus dans le Taxon A.
Exemple de Taxon :





Ceci est un exemple de Taxon simple, il on rajoute parfois le sous rgne
la sous-classe et la sous espce pour tre plus prcis sur le taxon cible.
Note : Papaver rhoeas est le nom scientifique de Coquelicot.































Plantae Rgne
AngioSpermae Classe
Papaveracae Famille
Papaver rhoeas Espce
Les Tables dassociation :

Les Tables Essai_Faune, Unite_Flore sont des tables dassociations qui permettent de
faire le lien entre les Tables. Il est impossible de faire une relation de plusieurs plusieurs
directement, il faut crer une table intermdiaire qui contient la cl primaire des deux tables :
les tables dassociation.

La table insectesObserve peut tre associe :

Un Taxon Faune
Un Taxon Flore
La Table Unit Experimentation peut tre associe :
Un ou plusieurs Taxon Flore.

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

22
XI - Conception dtaille
I-Les Templates :

Dans le cadre de ce projet, jai utilis plusieurs Template proposes gratuitement sur le net en
open source.
Un Template CSS
Un Template alertify
Un Template JSChart




























Template JSChart :

Ce Template ma servi pour gnrer les graphiques en JavaScript en fonction du contenu
de tables de la base de donnes. Ce Template requiert un tableau de tableau en paramtre(un
tableau a deux dimensions ) un nombre de couleurs en fonction du nombre de tableau que
contient le tableau container .Il faut galement crer le Pie-Chart en utilisant les fonctions
propres au Template.




Template Alertify :

Ce Template ma servi pour afficher des fenetres pop-up pour avertir lutilisateur
agrables la vue.Son utilisation est simple, il suffit de faire comme si on crait une fentre
normale, mais en rajoutant le prfixe alertify : alertify.confirm( Voulez vous crer cet Essai ? ),
aprs avoir inclus le fichier alertify.js



Template CSS:

Ce Template a t cr par Hugo Giraudel et publi sur le site Codrops Tympanus, le CSS
ntant pas ma spcialit, et souhaitant propos un design propre et soign pour le site jai opt pour
une template CSS.


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

23
II - Diagrammes de classes de lapplication :

Tous les classe_array, sont des classes permettant dinstancier un objet qui se comporte
comme un tableau, pour pouvoir intgrer les mmes types daccs chaque classe doit implmenter
linterface ArrayAccess.En effet cette interface permet aux objets crs par cette classe de possder
les mmes fonctionnalits quun tableau, sauf quici cest un objet.On cumule donc les avantages et
des objets, et des tableaux ,qui, en php sont trs puissants.














05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

24
Chaque table de la base donne correspond une classe, et donc chaque classe requiert une connexion
la base de donnes. Pour viter dencombrer le rseau inutilement, ou douvrir/fermer des
connexions chaque connexion lutilisation dun singleton est recommande. De cette manire une
seule connexion sera crer et rutilise chaque requte.




05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

25
Et chacune de ces classes est agrge une classe_array, pour crer/insrer des enregistrements
dans la base de donnes. De cette manire le code est clair et reste ouvert dventuels changements
sans avoir recrer les tableaux dans chaque fichier.








05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

26
III - Exemple dutilisation des classes:

Voici un exemple dutilisation des classes, Ici lexemple se fera la avec mthode Create() de la
classe Essai qui est la classe principale.

Code de la Fonction Create() :

















La classe Essai_array permet dinstancier un objet qui a les mmes proprits quun tableau et
galement les mmes accs grce limplmentation ArrayAccess et la gestion des offset. Lutilit
de cette classe est de faciliter les correctifs, et dclaircir le code.



En supposant que les lid du formulaire utiliss soit comme ceux-ci :
-input text id= Observation.
-input text id = idUniteExperimentation.
-input text id= D_Validite.
-input text id= F_Validite.
-input text id= NomEssai.

Exemple ci-dessous, avec lutilisation de la classe Essai_array :
//Connexion la base de donnes
public function Create(Essai_array $tableau)
{

$query = "INSERT INTO Essai

$query = "INSERT INTO Essai VALUES('','".$tableau['_refUniteExperimentation']."',
'".$tableau['_NomEssai']."',
'".$tableau['_Duree_Observation']."',
'".$tableau['_Debut_Date_Validite']."',
'".$tableau['_Fin_Date_Validite']."')";

$result = mysql_query($query) or die(mysql_error()."\n".$query);

if(!$result)
{
die('Requte invalide : ' . mysql_error());
}
}
);

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

27











Sans utilisation de la classe Essai_array :






















$essai = new Essai();
$essaiarray = array(
"refUniteExperimentation" => ".$_POST['idUniteExperimentation'].",
"Duree_Observation" => ".$_POST['Observation'].",
"Debut_Date_Validite" => ".$_POST['D_Validite'] .",
"Fin_Date_Validite" =>".$_POST['F_Validite'] .",
"NomEssai" => ".$_POST['NomEssai'] .",

);
$essai->Create($essaiarray); Il faut connaitre la fonction Create()
pour pouvoir faire le tableau.
contrairement la mthode prc.

$essaiarray = new Essai_array();
$essai = new Essai();
$essaiarray['_refUniteExperimentation'] = $_POST['idUniteExperimentation'] ;
Rcupration des donnes avec la variable super Globale $_POST.
$essaiarray['_Duree_Observation'] = $_POST['Observation'] ;
$essaiarray['_Debut_Date_Validite'] = $_POST['D_Validite'] ;
$essaiarray['_Fin_Date_Validite'] = $_POST['F_Validite'] ;
$essaiarray['_NomEssai']= $_POST['NomEssai'] ;

$essai->Create($essaiarray);


05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

28
III - Gnrateur de select :

Il est indispensable de veiller lergonomie de lapplication. Elle doit tre simple utiliser et
noblige pas lutilisateur perdre du temps chercher le nom des Essais, des Taxons, ou des units
dexprimentations.Cest pourquoi tous les enregistrements de la base de donnes sont disponibles
depuis le site via des selects, des inputs radio etc.




















Resultat :


Explications :
(1) On nomme le select idTaxonFlaune puisquil va retourner lid.
(2) Tant quil y a des rsultats on crer des options dans le select.
(3) La valeur de loption crer sera lid propre du Taxon slectionn.
(4) On affiche le Niveau et le Nom pour permettre de reconnaitre le Taxon et sa position.

public function generer_selectTaxonFaune(){
$i = 0 ;
$query = "SELECT * FROM TaxonFaune ORDER BY idTaxonFaune ";
$result = mysql_query($query) or die(mysql_error()."\n".$query);
echo "<center><select name=\"idTaxonFaune\" /> (1)
while($row = mysql_fetch_array($result)) (2)
{
echo "<option value=\"".$row[0]."\">"; (3)
echo $row['Niveau']. " - ". $row['Nom']; (4)
echo "</option>";
$i++ ;
}
echo "</select></center>";
}

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

29
IV - Application Type :

Voici lexemple type de dapplication, on le fera ici avec un exemple simple celui dune
suppression dun essai. On commencera par tudier la partie formulaire, la partie PHP, et la partie
Ajax.
A) Formulaire :

Pour le formulaire il ny a rien de plus classique. On utilisera ici la fonction getCheckList() qui renverra
lid dun essai , avec un submit pour le bouton qui permet denvoyer le formulaire. Il faut galement
spcifier le fichier PHP cible, et la mthode utilise.












B) Le fichier PHP :











On dclare le fichier essai.class.php pour pouvoir utiliser la mthode delete(), et on renvoi 1 si la
suppression russie ou 0 si il y a eu une erreur ou, si lidEssai tait inexistant .


<form method="post" name="SuppressionEssai" id="SuppressionEssai" action="supprimerEssai.php" >
<label>Selectionner l'essai supprimer</label>
<?php
require_once('essai.class.php');
$essai = new Essai();
$essai->getCheckList();
?>
<p class="clearfix">
<center>
<input type="submit" name="submit" value="Supprimer l'essai">
</center>
</p>
</form>
<?php
require_once('essai.class.php');
if(isset($_POST['idEssai']))
{
$essai = new Essai();
$essai->delete($_POST['idEssai']);
echo "1";
}
else{
echo "0";
}

?>

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

30
C) Ajax :
PHP est un outil trs puissant. Cependant il ne permet pas dinteractivits entre lutilisateur
et le site web, et oblige lactualisation de la page pour rinitialiser un formulaire, or avec JQuery et
Ajax il est possible doptimiser lergonomie du site, et galement la rapidit ainsi que la fluidit de la
navigation. Ce script est gnralement dans un fichier part, on fait la rfrence au fichier contenant
le script dans la page web ou le script doit oprer.



$(document).ready(function() {
La fonction est prete une fois la page charge.
$('#SuppressionEssai').on('submit', function() {
On selectionne le formulaire avec lid Suppression Essai.
var $this = $(this);
$this dsigne les valeurs du formulaire slctionn.
alertify.confirm("Voulez vous supprimer cet essai", function (e) {
On demande confirmation avant de supprimer lessai.
if (e) {
$.ajax({
url: $this.attr('action'),
On coute le fichier php point par le formulaire.
type: $this.attr('method'),
On utilize la mthode prscrite dans le formulaire.
data: $this.serialize(),
On srialise les donnes.
}).done(function(msg)
if(msg == 1){
Si le script PHP renvoi 1 alors ce code sera xecut.
alertify.success("L'Essai t supprim");
$
}
else if(msg == 0){
Si le script PHP renvoi 0 alors ce code sera xecut.
alertify.error("Aucun Essai selectionn");
$('#SuppressionEssai').reset();
On rinitialise le formulaire.
}
});
return false;
On empeche lenvoi du formulaire.

}
else{
alertify.error("Suppression Annule");
}
});
return false;
On empeche lenvoi du formulaire si lutilisateur annuler.
});
});

05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

31
X - Prsentation de lapplication
I - Page de Login :


Voici la page de Login simple, avec une petite option permettant dafficher le mot de passe si besoin,
un menu droulant en haut gauche pour la navigation.
Une fois connect, laccs toutes les options est dverrouill.
II - Page de Service :





05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

32
Le gnrateur de select qui propose les diffrents Taxons disponibles.
Le gnrateur de select qui propose les diffrentes Units disponibles.
Le champ renseigner pour le nom de lessai en cours de cration.
Champ renseigner pour la dure dobservation.
La date de dbut de validit de lessai.
La date de fin de validit de lessai.
FlorExpert affiche le nom de lutilisateur avec lequel il sest connect.


Cette page est une page type de lapplication, toutes les options disponibles sur lapplication Flor
Expert sont faites de la mme faon avec le mme design, et le mme pattern.






















05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

33
XII - Les Problmes rencontrs
I - Fluidit :

Un des premiers problmes que jai rencontr sur la premire maquette du site (soit FlorExpert
v1.0) a t la fluidit de la navigation sur lapplication. Etre oblig de recharg la page pour voir
nouveau les informations actualis et pouvoir utiliser le service. La fluidit est galement impacte par
des fichiers PHP mal optimiss, des pages longues, un CSS lourd, et des connexions a rptitions.
II - Ergonomie :

Le deuxime problme a t la slection des objets modifier. Il tait clairement hors de
question que lutilisateur doivent lui-mme saisir le nom dun Taxon, dun insecte ou dune plante pour
pouvoir la slectionner (en effet le nom pouvant atteindre une complexit phnomnale ex :
Osteospermum ). De mme pour les dates dbut et fin de validit, il tait hors de question de faire
taper la date elle-mme lutilisateur, car mme si il connaissait le type de variable et la forme il arrive
toujours de se tromper.

III - Affichage Graphique :

Le troisime problme t laffichage graphique des lments de la base de donnes (ici on
parle notamment du ratio de pollinisation entre un Insecte et une Plante).Il faut extraire les donnes
de la base donnes et afficher un graphique sans devoir rafraichir la page pour pouvoir lire le
graphique.



Les Solutions :
Scripts Ajax pour permettre une actualisation des donnes rapide.
Singleton de connexion pour optimiser le dbit de bande passante.
Un CSS sobre et adapt, (pas de surcharges danimations).
Cration dun script qui gnre des selects en fonction du contenu de la BDD.
Cration dun script utilisant le template JSChart pour afficher le contenu de la table
insectesObserve en fonction de son Unite dexperimentation associe.
Utilisation dun DateTimePicker pour choisir la date.








05/2014 Lyce Pablo Picasso Perpignan BTS IRIST Session 2014 Barbe Jrmy

34
XIII - Bilan





XIV - Conclusion

Ce projet a t pour moi une exprience enrichissante dans le sens o elle ma permis de me
mettre dans la peau dun employ auquel on aurait confi un projet. Et pour lequel il doit donner de
soi mme pour mener le projet bien. Jai appris quun projet nest en ralit jamais termin quil y a
toujours des choses amliorer. Jai galement compris quun projet ne se rsume pas coder mais
quil y a une vritable tape de comprhension du projet et de son but. Comprendre quel est le type
dutilisateur et pour quel type dutilisation, la mthode de travail utilise et le domaine dans lequel nous
allons proposer cet asservissement informatique.

Ayant des capacits modestes dans le domaine du web (PHP,Ajax,Html,JQuery, etc), ce projet ma
permis de passer au-del de mes difficults personnelles pour travailler sur ce projet. Jai pu acqurir des
notions importantes dans le domaine du web notamment avec le singleton de connexion, lAjax/JQuery.
Fait
Crer des Essais
Ajouter/Modifier des Taxons
Visualisation Graphique des donnes
Visualisation Textuelle des donnes
Crer modifier des Units
Gestion mot de passe/identifiant pour se
connecter
Cration d'une interface conviviale
A faire
Synchronisation Bdd Interne/Bdd Externe
Optimisation des scripts PHP
Evoluer le Mysql vers MySQLi pour une
meilleure scurit
Afficher si les units sont associes un
essai ou des taxons avant la supprssion
Optimiser l'affichage graphique des donnes

You might also like