BTS IRIS Lycée Jacquard – Paris PROJET TECHNIQUE Gestion

Transcription

RAPPORT DE PROJET
BTS IRIS
Lycée Jacquard – Paris
PROJET TECHNIQUE
Gestion des Absences
RAPPORT DE PROJET
Candidats
TAUNAY Damien
Développement du programme client lecteur de code barre.
SURGIS Vincent
Développement de l’interface web administrateurs et de la base de données MySQL.
OUTALEB Amine
Développement de l’interface web professeurs et mise en place du JavaScript.
GUIFFARD Benjamin
Développement de l’interface web élèves et du style graphique du site.
Rapport de projet technique
BTS IRIS
Session 2014
1
CAHIER DES CHARGES
CAHIER DES CHARGES
Contexte et objectifs du projet
Le lycée JACQUARD souhaite pour la rentrée prochaine informatiser la gestion des absences, la gestion des
notes et le suivi de la recherche de stage. On a en effet constaté un manque de réactivité entre la saisie des
absences par les professeurs et la constitution de son tableau de bord. La multiplication des opérations
manuelles (essentiellement plusieurs niveaux de saisies) entraine inévitablement quelques erreurs. On a
également constaté un suivi archaïque de la gestion des stages et une gestion des notes qui n'est pas
optimum.
Objectif : Permettre la collecte d'informations en temps réel pour alimenter le serveur d'établissement. Pour
cela, il convient d'étudier les possibilités de communication entre une salle de classe et le serveur
d'établissement. Certaines salles ne sont équipées d'aucun matériel informatique. La partie gestion des
absences doit impérativement être développée sous la forme client (pour la lecture par code barre des
élèves absents)/serveur (pour le stockage des absents dans une base de données).
OPTION : Il peut être mis en place une communication par WIFI entre le matériel client et le serveur. Cette
fonctionnalité peut être mise en œuvre par le ou les candidats qui le souhaitent.
Contraintes d'usage de matériels et d'outils logiciels
Le système LINUX FEDORA est requis pour le serveur. Lecteur de codes barre à mettre en œuvre. Mise en
œuvre d'un SGBDR (MYSQL ou ORACLE) et réalisation de l'interface graphique avec java, php ou qt.
LANGAGES POUVANT ETRE UTILISES : PHP, HTML, JAVASCRIPT,AJAX, PERL, C, JAVA, QT
BTS IRIS
Session 2014
2
SOMMAIRE
SOMMAIRE
RAPPORT DE PROJET ........................................................................................................................................... 1
Candidats ......................................................................................................................................................... 1
CAHIER DES CHARGES.......................................................................................................................................... 2
Contexte et objectifs du projet ....................................................................................................................... 2
Contraintes d'usage de matériels et d'outils logiciels ..................................................................................... 2
SOMMAIRE .......................................................................................................................................................... 3
PARTIE COMMUNE .............................................................................................................................................. 6
I – Introduction ................................................................................................................................................ 6
II – Cas d’utilisation ......................................................................................................................................... 7
Groupe « eleves » ........................................................................................................................................ 7
Groupe « profs » ......................................................................................................................................... 7
Groupe « admin » ....................................................................................................................................... 7
III – Fonctionnalités ......................................................................................................................................... 8
A – Gestion des absences ............................................................................................................................ 8
B – Gestion des notes .................................................................................................................................. 8
C – Gestion du cahier de texte .................................................................................................................... 8
D – Gestion des stages................................................................................................................................. 8
E – Gestion de l'emploi du temps ................................................................................................................ 9
F – Gestion des actualités ............................................................................................................................ 9
G – La fonction de recherche ...................................................................................................................... 9
H – Gestion des élèves et des classes .......................................................................................................... 9
IV - Le rôle de chaque candidat ..................................................................................................................... 10

TAUNAY Damien ................................................................................................................................ 10

SURGIS Vincent .................................................................................................................................. 10

OUTALEB Mohammed Amine............................................................................................................ 10

GUIFFARD Benjamin .......................................................................................................................... 10
PARTIES PERSONNELLES .................................................................................................................................... 11
TAUNAY DAMIEN ............................................................................................................................................... 12
Rôle ................................................................................................................................................................ 12
I – Présentation des outils retenus ................................................................................................................ 12
BTS IRIS
Session 2014
3
SOMMAIRE
A – Le système d'exploitation.................................................................................................................... 12
B – Le langage et l'interface de développement ....................................................................................... 13
C – Lecteur de code barre.......................................................................................................................... 15
D – API MySQL ........................................................................................................................................... 16
II – Installation des outils .............................................................................................................................. 18
A – Installation de Fedora sur les postes de travail ................................................................................... 18
B – Installation de MySQL .......................................................................................................................... 21
C – Douchette et code barre ..................................................................................................................... 21
III – Le programme client............................................................................................................................... 25
A – Connexion ............................................................................................................................................ 26
B – Ajout d'absence ................................................................................................................................... 27
C – Ajout de retard .................................................................................................................................... 28
SURGIS VINCENT ................................................................................................................................................ 29
Rôle ................................................................................................................................................................ 29
I – Les serveurs WEB et FTP ........................................................................................................................... 29
A – Le serveur web Internet ...................................................................................................................... 29
B – Le serveur FTP...................................................................................................................................... 30
C – Le serveur web local ............................................................................................................................ 31
II – Création de la base de donnée ................................................................................................................ 33
A – Outil de gestion et API PHP ................................................................................................................. 33
B – Les tables ............................................................................................................................................. 34
III – Authentification d’un utilisateur ............................................................................................................ 40
A – Connexion ............................................................................................................................................ 40
B – Navigation............................................................................................................................................ 43
C – La déconnexion .................................................................................................................................... 44
IV – Structure du site et du PHP .................................................................................................................... 45
A – L’arborescence du site......................................................................................................................... 45
B – La structure du script PHP ................................................................................................................... 46
V – Elaboration de l'interface WEB CPE ........................................................................................................ 54
A – Fonction de recherche......................................................................................................................... 54
B – Gestion d’élèves et de classes ............................................................................................................. 59
C – Gestion des absences et retards ......................................................................................................... 63
D – Gestion de l’emploi du temps ............................................................................................................. 69
E – Gestion des stages ............................................................................................................................... 71
BTS IRIS
Session 2014
4
SOMMAIRE
F – Gestion des actualités .......................................................................................................................... 71
G – Consultation des notes et de l’agenda ................................................................................................ 72
OUTALEB AMINE................................................................................................................................................ 74
Rôle ................................................................................................................................................................ 74
I – Lancement et fonctionnalités de l’interface professeur .......................................................................... 74
A – Connexion ............................................................................................................................................ 74
B – Fonctionnalités .................................................................................................................................... 74
C – Bases de données utilisé ..................................................................................................................... 76
II – Notes........................................................................................................................................................ 78
A – Sélections............................................................................................................................................. 78
B – Ajouts ................................................................................................................................................... 82
C – Modification ........................................................................................................................................ 86
III – Autres fonctions ..................................................................................................................................... 88
A – Absence ............................................................................................................................................... 88
B – Ajout d’une absence ............................................................................................................................ 90
C – Service ................................................................................................................................................. 92
D – Horaires des classes ............................................................................................................................ 93
E – Agenda ................................................................................................................................................. 94
GUIFFARD BENJAMIN ........................................................................................................................................ 97
Rôle ................................................................................................................................................................ 97
I – En tant qu’élève, que puis-je fais ? ........................................................................................................... 97
A – Détaillons ces parties........................................................................................................................... 98
II – Le design du site .................................................................................................................................... 115
A – Les couleurs ....................................................................................................................................... 115
B – Ce qui est commun à tout le site ....................................................................................................... 116
C – Quelques plus .................................................................................................................................... 120
BTS IRIS
Session 2014
5
PARTIE COMMUNE
PARTIE COMMUNE
I – Introduction
Afin de répondre au besoin d'un système de gestion des absences, nous avons retenu la solution web. Les
différentes interfaces dédiées aux professeurs, aux élèves ainsi qu'aux CPE se trouveront sur un site web,
accessibles depuis le réseau du lycée, mais aussi sur internet, à l'extérieur de l'établissement.
La saisie automatisée des absences s’effectue en classe, où une machine est à disposition avec un lecteur de
code barre, qui sera géré par un programme client, développé en C, établissant une connexion avec une
base de données, également utilisée par le site.
Bien que le projet s'intitule « Gestion des absences », le site web doit remplir d'autres fonctions énoncées
dans le cahier des charges, que voici :




Gestion des absences
Gestion des notes
Gestion des stages de première année
Gestion d'un cahier de texte en ligne
De notre propre initiative, nous avons également décidé d'ajouter à ces services, les fonctionnalités
suivantes, qui ajoutent une dimension ergonomique à l’utilisation de l’interface :




Gestion d'emploi du temps
Gestion d'actualités
Gestion d'élèves et de classes
Fonction de recherche d'élèves et de classes
Tous ces services sont proposés à trois groupes de personnes différentes, les élèves, les professeurs, et les
administrateurs du lycée – ici un CPE. Chacun de ces groupes doit avoir des droits d'accès différents selon les
services, correspondant à leur statut au sein du lycée. Ainsi par exemple, un CPE ne peut pas entrer des
notes, et un élève ne doit pas pouvoir entrer des absences. Ces droits d’accès doivent être gérés au niveau
des interfaces web de chacun de ces groupes, mais aussi au niveau du programme client. Détaillons ces
droits d’accès dans un diagramme de cas d’utilisation.
BTS IRIS
Session 2014
6
PARTIE COMMUNE
II – Cas d’utilisation
Groupe « eleves »








Consulter les notes
Consulter et justifier les absences
Consulter le cahier de texte
Ajouter les informations du stage
Obtenir une convention de stage pré-remplie
Consulter l'emploi du temps
Consulter les actualités
Consulter ses informations
Groupe « profs »







Consulter les notes, ajouter, supprimer et éditer les notes de sa matière
Consulter les absences, ajouter des absences pour sa propre matière
Consulter le cahier de texte, ajouter des entrées pour sa propre matière
Consulter la base de données des stages
Consulter l'emploi du temps
Consulter les actualités
Rechercher une classe ou un élève
Groupe « admin »








Consulter, ajouter, supprimer et éditer les absences
Consulter les notes
Consulter et éditer les informations de stage
Consulter le cahier de texte
Consulter et éditer l'emploi du temps
Consulter, ajouter, supprimer et éditer les actualités
Consulter, ajouter, supprimer et éditer des élèves et des classes
Rechercher un élève ou une classe
BTS IRIS
Session 2014
7
PARTIE COMMUNE
III – Fonctionnalités
A – Gestion des absences
Dans le cas général, les absences et les retards (qui sont stockés dans deux tables différentes bien que liées)
sont entrés automatiquement par les professeurs, à l'aide du lecteur de code barre et du programme client.
Nous partons du principe qu'une salle de classe est équipée d'une machine dédiée à l'entrée de ces
absences. A chaque début d'heure, le professeur utilise le programme développé dans le cadre du projet, qui
met à jour la base de données.
En cas d'erreur, il incombe au CPE de gérer les absences, dont il a le contrôle total. Il en ajoute en cas
d'omission, en supprime et en modifie en cas d'erreur. Il peut bien entendu suivre les absences des élèves du
lycée, en les consultant via son interface selon plusieurs critères : par classe, par mois, sous forme de
calendrier.
L'élève, quant à lui, dispose d'un suivi de ses absences. Il a la possibilité de les justifier depuis son domicile,
et de consulter leur état de traitement. Si la justification est acceptable, et qu'il a fourni un justificatif officiel,
il sera renseigné que son absence est en règle et que son traitement est terminé, sinon il lui sera demandé
de visiter le CPE pour de plus amples informations.
B – Gestion des notes
Les notes sont entrées sur le site par les professeurs, via internet. Ils peuvent donc faire ces entrées depuis le
lycée, mais aussi depuis leur domicile.
Les élèves peuvent par la suite consulter leur relevé de notes en fonction du semestre.
Le CPE a le même accès que les élèves, mais peut bien entendu consulter tous les résultats du lycée en
fonction de la classe. Il dispose également de quelques statistiques supplémentaires afin de suivre les
résultats de manière plus globale.
C – Gestion du cahier de texte
Le cahier de texte est tenu par les professeurs, ils entrent les devoirs à faire à la maison par leurs élèves en
fonction de la classe. Ils peuvent également poster des cours, ou bien des résumés. Les devoirs sont classés
par date, et sont accessibles par les élèves et le CPE.
D – Gestion des stages
Les stages de première année sont à effectuer dans une entreprise par les élèves. Il leur incombe de faire les
recherches nécessaires afin d'en trouver une leur proposant des activités en rapport avec leur formation.
Dès l'entreprise trouvée, ils doivent entrer les informations sur l'entreprise dans la base de donnée via leur
BTS IRIS
Session 2014
8
PARTIE COMMUNE
interface. Une fois ces informations collectées, leur convention de stage sera pré-remplie sur l'onglet
correspondant.
Les professeurs ont accès à cette base de données afin de suivre l'avancement des recherches de leurs
élèves, mais aussi afin de proposer ces adresses à leurs prochains élèves dans le cas où la recherche de
certains d'entre eux soit infructueuse.
Le CPE a ce même droit d'accès, ainsi que le droit de modifier certains informations, voire même de les
supprimer en cas d'un mauvais historique avec l'entreprise.
E – Gestion de l'emploi du temps
Pour chaque classe, un emploi du temps est nécessaire. Il est géré par le CPE. Il peut être consulté par les
élèves, ainsi que par les professeurs. Ces derniers disposent également de leur propre emploi du temps.
F – Gestion des actualités
Le système d'actualités permet au CPE d'informer les élèves (voire même les professeurs) d'évènements
scolaires ou extrascolaires. Les six dernières actualités sont visibles directement sur la page d'accueil, les
autres le sont sur la page dédiée. Il a le droit d'ajout, de suppression, et d'édition. Les élèves et les
professeurs ont juste le droit de les consulter.
G – La fonction de recherche
La fonction de recherche, accessible aux professeurs et au CPE doit permettre de retrouver rapidement une
classe ou un élève avec le moins d'information possible, et le plus rapidement possible. Elle permet
d'accéder aux fiches d'informations des élèves, puis aux fiches d'informations des classes.
H – Gestion des élèves et des classes
Les fiches des classes et des élèves sont accessibles via la fonction de recherche. Les professeurs ont le droit
de consulter les informations. Il incombe au CPE de les gérer. Il peut ajouter, supprimer un élève, ou bien
modifier ses informations (le changer de classe par exemple). Il a ce même droit sur les classes, il peut leur
attribuer des professeurs et gérer leur emploi du temps (fonction à part).
BTS IRIS
Session 2014
9
PARTIE COMMUNE
IV - Le rôle de chaque candidat

TAUNAY Damien
Développe le programme client sur les machines dans les salles de classe. Le programme doit permettre une
saisie semi-automatisée à l'aide d'un lecteur de code barre. Le programme dialogue directement avec le
serveur MySQL, y entre les absences et les retards. Installe également l’OS Fedora sur les machines de
développement, et sur la machine serveur locale.

SURGIS Vincent
Développe l'interface web pour le groupe des administrateurs, dans le cas présent, du CPE. Il a également
créé et géré l'ensemble de la base de données MySQL.

OUTALEB Mohammed Amine
Développe l'interface web pour le groupe des professeurs, ainsi que les scripts JavaScript à partir de JQuery.

GUIFFARD Benjamin
Développe l'interface web pour le groupe des élèves. Il gère également le design graphique du site, utilisant
le CSS.
BTS IRIS
Session 2014
10
PARTIES PERSONNELLES
PARTIES PERSONNELLES
La présentation du projet de gestion des absences va désormais continuer par la présentation successive des
parties personnelles de chaque candidat.
 TAUNAY Damien
 Pages 12 à 28
 SURGIS Vincent
 Pages 29 à 73
 OUTALEB Mohammed Amine
 Pages 74 à 96
 GUIFFARD Benjamin
 Pages 97 à 121
BTS IRIS
Session 2014
11
TAUNAY DAMIEN
TAUNAY DAMIEN
Rôle
Développe le programme client sur les machines dans les salles de classe. Le programme doit permettre une
saisie semi-automatisée à l'aide d'un lecteur de code barre. Le programme dialogue directement avec le
serveur MySQL, y entre les absences et les retards. Installe également l’OS Fedora sur les machines de
développement, et sur la machine serveur.
I – Présentation des outils retenus
A – Le système d'exploitation
Le serveur ayant une contrainte, celui-ci doit être obligatoirement sous Linux Fedora, tout le groupe de
projet travailla donc sur Linux Fedora 20.
 Les avantages Linux :





La plupart des distributions sont gratuites.
Linux est un système d'exploitation réputé robuste, qui ne plante pas. Mais certains logiciels "se
figent" parfois.
Il y a très peu de fragmentation sous Linux
Linux est très peu sensible aux virus. Donc inutile d'acheter un antivirus, un pare-feu suffit
largement, installez par exemple le paquet "firestarter" sous Linux.
On a la possibilité d'essayer une distribution sans l'installer.
 Les inconvénients de Linux :



Très peu de logiciels achetés dans le commerce sont compatibles avec Linux.
Il y a peu de pilotes "propriétaires" car la majorité des fabricants de cartes graphiques et de
périphériques se désintéressent encore de Linux, et ne conçoivent pas une version de leurs pilotes
pour ce système d'exploitation
On est quelquefois obligé d'utiliser le "Terminal". Cela peut rebuter les nouveaux utilisateurs, car la
syntaxe des commandes à taper dans le Terminal est parfois assez complexe
Fedora est une distribution Linux basée sur le système d'exploitation GNU/Linux servant de vitrine aux
logiciels libres les plus récents.
BTS IRIS
Session 2014
12
TAUNAY DAMIEN
Fedora est libre : tout le monde peut l'utiliser, la modifier et la distribuer. Elle est construite de par le monde
par des personnes regroupées autour d'une communauté : le Projet Fedora.
Le Projet Fedora est un projet ouvert, tout le monde peut participer.
Le Projet Fedora est leader dans le développement de logiciels et contenus libres.
B – Le langage et l'interface de développement
Le langage que j'ai utilisé pour le programme est le langage C car c'est un des langages les plus courant et
qu'il correspondait largement a ce qu'il me fallait, toute la programmation a été effectuer avec la console de
Fedora.
 Le langage C est un des langages les plus utilisés car :





il existe depuis le début des années 1970, il est fondé sur un standard ouvert, de nombreux
informaticiens le connaissent, des compilateurs et bibliothèques logicielles existent sur la plupart
des architectures ;
il a influencé de nombreux langages plus récents dont C++, Java et PHP ; sa syntaxe en particulier est
largement reprise ;
il met en œuvre un nombre restreint de concepts, ce qui facilite sa maîtrise et l'écriture de
compilateurs simples et rapides ;
il ne spécifie pas rigidement le comportement du fichier exécutable produit, ce qui aide à tirer parti
des capacités propres à chaque ordinateur ;
il permet l'écriture de logiciels qui n'ont besoin d'aucun support à l'exécution (ni bibliothèque
logicielle ni machine virtuelle), au comportement prédictible en temps d'exécution comme en
consommation de mémoire vive, comme des noyaux de système d'exploitation et des logiciels
embarqués.
BTS IRIS
Session 2014
13
TAUNAY DAMIEN
 Ses principaux inconvénients sont :








la première version du langage (K&R C) offre particulièrement peu de vérifications lors de la
compilation, et il n'offre aucune vérification pendant l'exécution, ce qui fait que des erreurs qui
pourraient être automatiquement détectées lors du développement ne le sont que plus tard,
souvent au prix d'un plantage du logiciel ;
son approche de la modularité est restée au niveau de ce qui se faisait au début des années 1970, et
a été largement dépassée depuis par d'autres langages :
il ne facilite pas le développement de concepts informatiques plus récents comme la programmation
orientée objet ou la gestion d'exceptions qui exigent un effort de rigueur supplémentaire de la part
du développeur ;
il ne propose qu’un support très limité de la généricité (malgré l’introduction en C11 de la
construction _Generic) ;
il est difficile d'écrire des programmes portables car le comportement exact des exécutables dépend
de l'ordinateur cible ;
le support de l'allocation de mémoire et des chaînes de caractères est minimaliste, ce qui oblige les
programmeurs à s'occuper de détails fastidieux et sources de bugs ; il n'y a notamment pas de
ramasse-miettes standard ;
des bugs communs comme le débordement de tampon constituent une faille de sécurité
informatique et peuvent être exploités par des logiciels malveillants si le développeur ne fait pas
attention ;
plusieurs genres d'erreurs ne peuvent être détectés automatiquement qu'à l'aide d'outils
supplémentaires et non standardisés, comme lint puis splint.
BTS IRIS
Session 2014
14
TAUNAY DAMIEN
C – Lecteur de code barre
C'est un lecteur de code barre manhattan USB, de référence « 401517 ».
Caractéristiques techniques :
Connexion
USB
Poids
250 g
Distance de lecture
0 - 25 mm
Confirmation de lecture
Akustisch und LED
Taux de numérisation
50 scan/s
Couleur
noir
Largeur
70 mm
Hauteur
70 mm
Longueur
180 mm
Numérisation sans fil
non
BTS IRIS
Session 2014
15
TAUNAY DAMIEN
D – API MySQL
1 – Avantages

Rapide
Le serveur MySQL est très rapide. Des tests de performances sont disponibles sur le site de MySQL

Facile à utiliser
MySQL est beaucoup plus simple à utiliser que la plupart des serveurs de bases de données commerciaux.

API diverses
On peut effectuer diverses opérations sur une base MySQL en utilisant des interfaces écrites en C, Perl, C++,
Java, Python, PHP.

Coût
Jusqu'à la version 3.20.32a, MySQL était sous licence GPL. Il faut une licence pour faire tourner MySQL sous
Windows. Sous les autres plates-formes, l'utilisation de MySQL est gratuite dans un but non commercial
sinon il faudra acheter une licence pour environ 200 $ US.

Connexion et Sécurité
MySQL dispose d'un système de sécurité permettant de gérer les personnes et les machines pouvant
accéder aux différentes bases.

Portabilité
MySQL tourne sur divers systèmes tels qu’Unix, Windows, Linux ou OS/2.

Distribution ouverte
Les sources étant fournies, il est possible d'améliorer mySQL.
2 – Défauts
MySQL ne peut pas gérer les points suivants :

Subselect
Les requêtes imbriquées ne sont pas supportées par MySQL. Vous devez donc traduire vos requêtes
imbriquées en requêtes classiques. Si vous avez des difficultés une bonne solution est de sauvegarder les
valeurs des sous requêtes dans une table temporaire, et d'accéder à cette table temporaire depuis la
requête principale.
BTS IRIS
Session 2014
16
TAUNAY DAMIEN
 Un exemple de requête que ne supporte pas MySQL :
SQL
SELECT deptno, ename, sal
FROM emp x
WHERE sal > ( SELECT AVG(sal)
FROM emp
WHERE x.deptno = deptno )
ORDER BY deptno ;

Transactions et commit / rollback
Une transaction est une unité logique de travail qui contient une ou plusieurs blocs SQL exécutés par un
utilisateur. Une transaction se termine lorsqu'elle est explicitement arrêtée par l'utilisateur. En SQL
classique, une transaction commence par un COMMIT et se termine par un ROLLBACK. MySQL ne supporte
pas les transactions. On peut toutefois simuler les transactions en utilisant LOCK_TABLES et
UNLOCK_TABLES.

Clés étrangères et intégrité référentielle
Dans une base de données relationnelle, les identifiants (clefs primaires) d'une table se retrouvent en clefs
étrangères d'une autre table en relation avec la première. Ce système de clefs primaires et clefs secondaires
permet d'assurer l'intégrité des données.
En effet, lorsqu'on modifie une clef primaire, les clefs secondaires sont automatiquement mis à jour. MySQL
ne supporte pas ce système. Lorsqu'on crée une table, on peut très bien utiliser l'argument FOREIGN KEY
(clef étrangère) pour un attribut mais ceci n'a aucune influence. Cet argument est juste là pour assurer
une meilleure importation de bases gérées par un autre SGBDR que MySQL.

Procédures stockées.

Déclencheurs.

Vues.
Une vue est une présentation des données contenues dans une ou plusieurs tables (ou d'autres vues). Une
vue prend le résultat d'une requête et le traite comme si c'était une table. C'est pourquoi une vue peut aussi
porter le nom de "Requête sauvée" ou "Table virtuelle". En SQL classique, une vue est définie comme suit :
SELECT View Vue_Employe as SELECT nom, numero FROM employe ;
Les points ci-dessus devraient être développés au cours des prochaines versions.
BTS IRIS
Session 2014
17
TAUNAY DAMIEN
II – Installation des outils
A – Installation de Fedora sur les postes de travail


Démarrer par clé USB pour installer Fedora 20
Start Fedora live

Choisir la langue du système et du clavier
BTS IRIS
Session 2014
18
TAUNAY DAMIEN

Cliquer sur : Install to hard drive

Choisir la partition (manuelle) date et heure, clavier et configuration réseau automatique sauf si
vous voulez les changer
BTS IRIS
Session 2014
19
TAUNAY DAMIEN

Choisir le mot de passe root, et ajouter un utilisateur avec un mot de passe forte

Attendre la fin de l’installation puis redémarrer

Et voila, l'installation est terminer
BTS IRIS
Session 2014
20
TAUNAY DAMIEN
B – Installation de MySQL
Dans la console il faut écrire :
su -c 'yum install mysql-server'
C – Douchette et code barre
1 – Configuration Douchette
BTS IRIS
Session 2014
21
TAUNAY DAMIEN
2 – Principe de code a barre
Un code-barres, ou code à barres, est la représentation d'une donnée numérique ou alphanumérique sous
forme d'un symbole constitué de barres et d'espaces dont l'épaisseur varie en fonction de la symbologie
utilisée et des données ainsi codées.
En rouge se sont les deux premiers chiffres du code pays. Ils indiquent dans quel pays l'entreprise est
membre du système EAN. En bleu, c'est le code du fabricant ou de l'entreprise. En vert se sera le code du
produit et en violet, ce chiffre est la clef de contrôle.
 Types de code barre :











EAN 8, EAN 13, UPC,
Codabar Monarch (NW7),
Code 11,
Code 39,
Code 93,
Code 128,
HIBC
ITF ou Interleaved 2 of 5,
Industrial 2of5,
CIP Pharmacode France,
Laetus Pharmacode, etc
BTS IRIS
Session 2014
22
TAUNAY DAMIEN
Parmi tout ces types de code barre on ne s’intéressera que au code 128, ce code est FULL ASCII, il intègre les
128 premiers caractères de la table ASCII y compris les caractères de contrôle. Ce code nous permet d'écrire
un code barre uniquement avec des lettres
3 – Création de code barre
4 – Exemple de code barre
 Élèves :


Amine Outaleb
BTS IRIS
Damien Taunay
Session 2014
23
TAUNAY DAMIEN

Vincent Surgis

Benjamin Guiffard

Pierre Bilger
 Professeur

Bruno Guilbert
BTS IRIS
Session 2014
24
TAUNAY DAMIEN
III – Le programme client
Initialisation du
programme
Saisie de l'enseignant
Saisie du Mot de passe
Saisie de la classe
Choix
Ajouter un retard
Ajouter une absence
Menu saisis des élèves
Oui
Saisie
des
élèves
Menu saisis des élèves
Non
Oui
Non
élèves
élèves
Saisie
des
élèves
BTS IRIS
Session 2014
25
TAUNAY DAMIEN
A – Connexion
Le programme commence par demander les identifiants du professeur en commencent par lui demander
son login (première lettre du prénom + le nom de famille) puis lui demande son mot de passe encodé en
MD5. Le programme vérifie alors que le login est bien dans la base de donnée.
CODE C
char login[20],conec[150] ;
printf("Login prof: ");
scanf("%s", login);
sprintf(conec,"SELECT username FROM profs WHERE username = '%s'",login);
mysql_query(&mysql, conec);
MYSQL_RES *result1 = NULL;
MYSQL_ROW row1;
unsigned int a = 0;
unsigned int num_champs1 = 0;
result1 = mysql_use_result(&mysql);
//On met le jeu derésultat dans le pointeur result1
num_champs1 = mysql_num_fields(result1);
//On récupère le nombre de champs
while ((row1 = mysql_fetch_row(result1)))
//Tant qu'il y a encore un résultat ...
{
unsigned long *lengths;
//On déclare un pointeur long non signé pour y stocker la taille des valeurs
lengths = mysql_fetch_lengths(result1);
//On stocke ces tailles dans le pointeur
for(a = 0; a < num_champs1; a++)
//On fait une boucle pour avoir la valeur de chaque champs
{
z++;
}
printf("\n");
}
if(z!=1) printf("login incorrecte\n");
//si ce login n'existe pas ou existe en plusieurs exemplaire
else
//sinon on continue
{…………..
Ci le login est bien dans la base de donnée il vérifie donc que le mot de passe utiliser est bien celui associé au
login, après cela le programme demande la classe dont le professeur fait cour, il y a encore une vérification,
que le professeur est bien celui attribuer a la classe,
Si le login est mauvais, que le mot de passe ne correspond pas au login ou que la classe n'as pas cour avec ce
professeur on a alors un message qui indique l'erreur et on revient au début du programme, on demande le
login du professeur…
BTS IRIS
Session 2014
26
TAUNAY DAMIEN
Une fois ces étapes passé la liste des élèves apparais indiquant leurs nom, prénom et username
CODE C
sprintf(requete,"SELECT id, prenom, nom,username FROM eleves WHERE classe =
'%s'",classe);
//RequÃªte qui sÃ©lectionne id, le prenom et le nom des eleve de ma classe
mysql_query(&mysql, requete);
MYSQL_RES *result = NULL;
MYSQL_ROW row;
unsigned int i = 0;
unsigned int num_champs = 0;
result = mysql_use_result(&mysql);
num_champs = mysql_num_fields(result);
while ((row = mysql_fetch_row(result)))
{
lengths = mysql_fetch_lengths(result);
for(i = 0; i < num_champs; i++)
{
printf("%.*s ", (int) lengths[i], row[i] ? row[i] : "NULL");
//On ecrit toutes les valeurs
}
 Example :
CONSOLE
Vincent Surgis vsurgis
Benjamin Guiffard bguiffard
Amine Outaleb aoutaleb
Damien Taunay dtaunay
Après ça nous arrivons à un choix pour le professeur celui d'ajouter une absence ou un retard
B – Ajout d'absence
Le professeur indique le nombre d'élève absent, une fois cela fait on lui demande un par un les username
des élèves étant disponible en code barre on utilisera alors la douchette pour facilité cette tache, si
l'username ne correspond pas a un élève de la classe il ne compte pas et un message d'erreur l'indique
quand l'username correspond bien a un élève de la classe l'absence est immédiatement ajouté dans la base
de donnée.
CODE C
while(j>>0, j--)
{
z=0;
printf("user eleve: ");
scanf("%s",user);
sprintf(eleve,"SELECT username FROM eleves WHERE username = '%s'",user);
mysql_query(&mysql, eleve);
BTS IRIS
Session 2014
27
TAUNAY DAMIEN
CODE C P2
MYSQL_RES *result2 = NULL;
MYSQL_ROW row1;
unsigned int b = 0;
unsigned int num_champs2 = 0;
result2 = mysql_use_result(&mysql);
num_champs2 = mysql_num_fields(result2);
while ((row1 = mysql_fetch_row(result2)))
{
lengths = mysql_fetch_lengths(result2);
for(b = 0; b < num_champs2; b++)
{
z++;
}
printf("\n");
}
if(z!=1)
{
printf("user incorrecte\n");
j++ ;
}
else
{
sprintf(matiere,"SELECT matiere FROM profs WHERE username = '%s'",login);
mysql_query(&mysql, matiere);
MYSQL_RES *result = NULL;
MYSQL_ROW row;
result = mysql_use_result(&mysql);
while ((row = mysql_fetch_row(result)))
{
lengths = mysql_fetch_lengths(result);
printf("%.*s ", (int) lengths[0], row[0] ? row[0] : "NULL");
sprintf(spe,"%.*s",(int) lengths[0], row[0] ? row[0] : "NULL");
printf("\n");
}
}
Une fois toute les absence ajouté le programme demandera les username des élèves en retard.
C – Ajout de retard
Le choix de directement ajouté les retard peut accélérer le processus d'ajout de retard si le programme a été
interrompu avant d'ajouté un retard ou pendant justement l'ajout de retard.
L'ajout d'un retard supprimera automatiquement l'absence qui doit dure tout le cour pour ajouté un retard
mais si ce retard est supérieur a une heure il y aura alors ajout d'une absence pour la duré en heure du
retard.
Contrairement à l'ajout d'absence ici on ne demandera pas un nombre d'élève en retard, on demandera
juste si le professeur veut continuer a ajouté des retard ou si il veut couper sa session.
BTS IRIS
Session 2014
28
SURGIS VINCENT
SURGIS VINCENT
Rôle
Développe l'interface web pour le groupe des administrateurs, dans le cas présent, du CPE. Il a également
créé et géré l'ensemble de la base de données MySQL.
I – Les serveurs WEB et FTP
A – Le serveur web Internet
Afin de simuler cet accès depuis internet, j'ai installé un serveur web sur ma machine personnelle. C'est en
effet la solution offrant le plus de possibilités, la plupart des hébergeurs gratuits nous imposant des
contraintes d'accès à la base de données, ici je dispose de tous les droits dont je pourrais avoir besoin.
J'ai utilisé la suite WAMP, mon système d'exploitation étant Windows Seven. L'installation s'avère très
simple et propose un serveur web très complet : Windows Apache, MySQL & PHP, disposant notamment de
phpMyAdmin, un gestionnaire de base de données très efficace. Il suffit de se rendre sur le site, puis de
lancer l'exécutable d'installation.

http://www.wampserver.com/
S’agissant ici d’un serveur réservé au développement du site, et dans un cadre scolaire, nous nous sommes
contentés du système d’exploitation Windows Seven, et d’une machine n’étant pas strictement réservée à
une fonction de serveur, et donc non optimisée. Dans le cas d’une mise en service du site, il faudrait préférer
des machines et des systèmes axés « serveurs », Windows Server 2008 ou 2012 de chez Microsoft, ou bien
un Linux Fedora comme proposé dans le cahier des charges.
Dès l’installation terminée, il n’y a plus qu’à ouvrir le port 80 dans le pare-feu de la machine, et dans le
proxy, puis de lancer l’exécutable wampmanager.exe, et le serveur est en ligne.
Durant la période du développement, il peut également être intéressant d’accéder à phpMyAdmin via
Internet, afin d’apporter des modifications sur la structure ou le contenu de la base de données à distance,
ce qui nécessite un paramétrage supplémentaire. Il nous faut nous rendre dans le fichier de configuration
suivant : E:\Logiciels\wamp\alias\phpmyadmin.conf, puis changer les lignes suivante :
PHPMYADMIN.CONF
# to give access to phpmyadmin from outside
# replace the lines
#
#
Order Deny,Allow
# Deny from all
# Allow from 127.0.0.1
#
# by
#
#
Order Allow,Deny
#
Allow from IP
#
BTS IRIS
Session 2014
29
SURGIS VINCENT
B – Le serveur FTP
Afin de pouvoir travailler sur le serveur web à distance, j'ai également installé un serveur FTP : FileZilla
Server. De même, son installation sous Windows est très intuitive ; il ne s'agit que d’un exécutable à lancer.
Il faut toutefois veiller à le configurer. L'opération reste simple, il suffit de créer un identifiant ainsi que son
mot de passe, puis un chemin d'accès vers le répertoire que l'on souhaite lui lier. J'ai donc renseigné le
répertoire racine du serveur web, à savoir E:\Logiciels\wamp\www\ me concernant. Il faut également
veiller à donner les droits d'accès de ce répertoire à tout le monde dans ses propriétés.
Pour terminer, il nous faut ouvrir les ports nécessaires sur le proxy ainsi que sur le pare-feu de la machine ;
le port 21. Nous voilà désormais doté d'un serveur web fonctionnel, accessible depuis l'Internet, au lycée
comme ailleurs.
Son utilisation est très intuitive, nous retrouvons par exemple sur le client FileZilla le serveur distant à droite,
et les disques locaux à gauche. Il est ainsi possible de faire des copier/glisser, mais aussi de gérer
l’arborescence et les fichiers à distance.
BTS IRIS
Session 2014
30
SURGIS VINCENT
C – Le serveur web local
Le serveur local, bien qu’inaccessible via Internet dans le cas présent à cause des règles de sécurité du lycée,
représente le serveur final qui pourrait être déployé pour une mise en service.
Tournant sous Fedora, j'ai retenu la solution LAMP, nous offrant les mêmes services que WAMP. En ce qui
concerne l’installation, il n’y a qu’à suivre la très bonne documentation de Fedora :

http://doc.fedora-fr.org/wiki/LAMP
Par la suite, il nous incombe de paramétrer des droits d'accès dans le répertoire /var/www du serveur web,
ainsi que d'ouvrir les ports pour le service http dans le pare-feu de Fedora.
Une fois les serveurs installés, il est également possible d’ajouter phpMyAdmin à la suite LAMP, qui n’est pas
intégré par défaut, et qui permet une gestion de la base de données en dehors du site. De même que pour
l’installation des serveurs, la documentation de Fedora propose un excellent tutoriel d’installation.
BTS IRIS
Session 2014
31
SURGIS VINCENT

http://doc.fedora-fr.org/wiki/
PhpMyAdmin_:_gestion_de_vos_bases_de_données_MySQL
BTS IRIS
Session 2014
32
SURGIS VINCENT
33
II – Création de la base de donnée
La base de données est au centre de notre projet ; elle contiendra en effet toute les données relatives aux
élèves, aux professeurs, aux absences, aux retards, en somme : au lycée. La voici à ce jour :
absences
admin
agenda
annee
classes
eleves
emploi_du_temps
news
notes
profs
retards
stage
ID (int)
ID (int)
ID (int)
annee1
ID (int)
ID (int)
ID (int)
ID (int)
ID (int)
ID (int)
ID (int)
ID (int)
eleve
fonction
username
int
nb_eleves
prenom
classe
username
eleve
prenom
eleve
eleve
varchar(40)
enum
varchar(40)
annee2
int
varchar(40)
varchar(10)
varchar(40)
varchar(40)
varchar(40)
varchar(40)
varchar(40)
date
nom
titre
int
matiere1
nom
matiere
article
note
nom
date
classe
date
varchar(40)
varchar(100)
varchar(60)
varchar(40)
varchar(40)
text
float
varchar(40)
date
varchar(10)
heure
prenom
matiere
matiere2
username
prof
date
intitule
username
heure
entreprise
time
varchar(40)
varchar(50)
varchar(60)
varchar(40)
varchar(40)
timestamp
varchar(50)
varchar(40)
time
varchar(100)
duree
username
details
[...]
password
jour
titre
matiere
password
duree
adresse
int
varchar(40)
tinytext
varchar(32)
int
varchar(50)
varchar(41)
varchar(32)
int
varchar(200)
prof
password
date
classe
heure
prof
matiere
prof
code_postal
varchar(40)
varchar(32)
date
varchar(10)
int
varchar(40)
varchar(40)
varchar(40)
varchar(6)
matiere
varchar(40)
echeance
date
regime
enum
salle
int
date
date
classe
varchar(10)
ville
varchar(40)
classe
varchar(10)
classe
varchar(10)
type
enum
naissance
date
periode
enum
motif
enum
pays
varchar(40)
motif
adresse
coefficient
telephone
enum
varchar(200)
float
varchar(14)
justification
telephone
site
text
varchar(12)
varchar(100)
validation
enum
mail
varchar(80)
p1_lien
varchar(40)
p1_noms
varchar(80)
p1_tel1
varchar(12)
p1_tel2
varchar(12)
p2_lien
varchar(40)
p2_noms
varchar(80)
p2_tel1
varchar(12)
p2_tel2
varchar(12)
Chaque colonne représente une table, et chaque tuple représente un champ. En dessous des noms sont
renseigné le type des champs.
A – Outil de gestion et API PHP
La base de données a été créée depuis la machine serveur Internet, en utilisant l'interface phpMyAdmin
proposée par la suite WAMP. On y accède par navigateur, à l’adresse locale suivante :

http://localhost/phpMyAdmin
En ce qui concerne les scripts PHP du site, l’accès à la base de données se fait grâce à l’API MySQLi. Nous
avons retenu cette solution, écartant de ce fait les deux autres API « MySQL » et « PDO_MySQL » après la
lecture du tableau suivant, accessible sur le site http://php.net/.
BTS IRIS
Session 2014
SURGIS VINCENT
Les fonctionnalités des API MySQL en PHP :
En effet, MySQLi semble être l’API la plus complète, proposant notamment une interface procédurale qui
s’intègre mieux visuellement dans les scripts PHP basiques, ce projet ne nécessitant pas de programmation
orientée objet quant à la réalisation du site web.
B – Les tables
Passons à la description des tables de la base de données. Elles peuvent être classées en deux catégories ; les
tables de « personnes », contenant tous les utilisateurs du site, qui sont tous les membres du lycée, qu’ils
soient élèves, professeurs ou bien membres de l’administration, et les tables « d’informations », qui
contiennent des données qui sont liées aux tables dites de personnes. Il existe également une table à part, la
table « annee », qui contient l’année scolaire actuelle.
1 – Les tables de personnes
Les tables de personnes sont les tables « eleves », « profs » et « admin ». Détaillons les champs qu’elles ont
en commun.

Le champ « ID »
Ce champ contient un identifiant numérique entier unique pour chaque enregistrement, il d’agît donc d’une
clé primaire. Il permet d’éviter les confusions entre deux enregistrements, notamment grâce à la condition
WHERE des requêtes MySQL.
BTS IRIS
Session 2014
34
SURGIS VINCENT

Le champ « username »
Ce champ contient un identifiant unique pour chaque utilisateur, sous la forme d’une chaîne de 40
caractères. Il est composé de la première lettre du prénom de l’utilisateur, et de son nom. L’identifiant de
« Vincent Surgis » donnerai donc « vsurgis », pour donner un exemple. Dans les différentes interfaces de
gestion des professeurs et des administrateurs, les algorithmes se servent de ce champ pour définir un
élève.

Le champ « password »
Ce champ contient le mot de passe de l’utilisateur, qu’il doit utiliser pour se connecter à son compte sur le
site. Les mots de passe sont encodés en MD5, pour des raisons de sécurité, si une personne externe est
amenée à avoir accès à la base de données, le cryptage permet tout de même de ne pas révéler les mots de
passe des utilisateurs. Ils sont enregistrés sous la forme d’une chaîne de 32 caractères, la taille du résultat de
la fonction d’encodage.

Le champ « nom »
Ce champ contient le nom de famille de l’utilisateur, enregistré sous la forme d’une chaîne de 40 caractères.

Le champ « prenom »
Ce champ contient le premier prénom de l’utilisateur, enregistré sous la forme d’une chaîne de 40
caractères.
Le reste des champs selon la table contiennent des informations spécifiques au groupe de personne.
 Table « eleve »
La table des élèves contient un ensemble d’informations qui permettent d’établir une « fiche élève », tel
que :





L’adresse, contenue dans le champ « adresse », une chaîne de 200 caractères
La date de naissance, contenue dans le champ « naissance », sous le type « date »
Le numéro de téléphone de l’élève, dans le champ « telephone », une chaine de 12 caractères (dans
le cas d’utilisation de +33 à la place du 0 initial)
L’adresse mail de l’élève, dans le champ « mail », une chaine de 80 caractères.
Les informations concernant les personnes à contacter en cas d’urgence, contenues dans les
champs :
o « pX_lien », le lien social entre la personne et l’élève, une chaine de 40 caractères
o « pX_nom », les nom et prénom de la personne, une chaine de 80 caractères
o « pX_telX », deux numéros de téléphones à appeler pour contacter la personne, des chaînes
de 12 caractères.
On y trouve également des champs contenant des informations relatives à la place de l’élève à l’intérieur du
lycée, à savoir :

La classe, dans le champ « classe », une chaine de 10 caractères, qui correspond à l’ « ID » de la table
classe.
BTS IRIS
Session 2014
35
SURGIS VINCENT

Le régime de l’élève, dans le champ « regime », qui définit s’il est pensionnaire, demi-pensionnaire,
ou bien externe, une énumération.
 Table « profs »
La table des professeurs dispose, en plus des champs communs à toutes les tables de personnes, du champ
« matiere », qui contient la matière principale qu’il enseigne, une chaîne de 40 caractères.
 Table « admin »
La table des administrateurs dispose, en plus des champs communs à toutes les tables de personnes, du
champ « fonction », qui contient la fonction de l’utilisateur au sein de l’établissement, une énumération.
2 – Tables d’information
Les tables d’information contiennent toutes les informations nécessaires au fonctionnement du lycée tout
au long d’une année scolaire. Elles ont toutes en commun le champ « ID », qui a la même fonction et la
même forme que le champ du même nom des tables de personnes, excepté pour la table « classe » dans
laquelle ce champ est une chaîne de 10 caractères.
 Les tables « absences » et « retards »
Ces deux tables sont très similaires, puisqu’on retrouve tous les champs de la table « retard » dans la table
« absence », qui elle dispose de deux champs supplémentaires. Elles ont pour fonction de stocker toutes les
absences et tous les retards des élèves au cours de l’année.
Les champs qu’elles ont en commun sont :

Le champ « eleve »
Qui contient l’élève en cause, correspondant à l’ « username » de la table « eleve », une chaîne de 40
caractères.

Le champ « date »
Qui contient la date du jour de l’absence ou du retard, sous le format « date ».

Le champ « heure »
Qui contient l’heure de cours à laquelle l’élève était absent ou en retard, sous le format « time ».

Le champ « duree »
Qui contient la durée du retard en minutes ou la durée de l’absence en heures, une valeur entière.

Le champ « prof »
Qui contient l’ « username » du professeur ayant entré le retard ou l’absence, une chaîne de 40 caractères.
BTS IRIS
Session 2014
36
SURGIS VINCENT

Le champ « matiere »
Qui contient la matière manquée lors du retard ou de l’absence, une chaîne de 40 caractères.

Le champ « classe »
Qui contient l’ « ID » de la classe de l’élève absent ou en retard, une chaîne de 10 caractères.

Le champ « motif »
Qui contient le motif de l’absence ou du retard, une énumération.
Les deux autres champs de la table « absences » sont les champs « justification », un champ de type « text »
qui contient l’explication fournie par l’élève via son interface pour justifier son absence, et le champ
« validation », qui permet au CPE d’informer à l’élève si sa justification est correcte, ou s’il souhaite que
l’élève lui rende visite à son bureau pour de plus amples informations, ou dans le cas où la justification n’est
pas recevable.
 La table « notes »
Cette table contient les notes des élèves. Passons les champs en revue rapidement :








« eleve » contient l’ « username » de l’élève noté.
« note » contient la note.
« intitule » contient l’intitulé ou le titre du devoir dont est issu la note.
« matiere » contient la matière dans laquelle l’élève a été noté.
« prof » contient l’ « username » du professeur attribuant la note.
« date » contient la date du devoir.
« periode » contient le semestre pendant lequel la note est comptée.
« coefficient » contient le coefficient de la note.
 La table « agenda »
Cette table contient les devoirs à la maison et les cours postés par les professeurs à leurs élèves. Passons les
champs en revue rapidement :








« username » contient l’ « username » du professeur ayant posté.
« type » contient une énumération définissant si le post est un devoir à la maison, ou bien un cours.
« titre » contient le titre du post que choisit le professeur.
« matiere » contient la matière du professeur auteur du post.
« details » contient le corps de texte du post.
« date » contient la date à laquelle le professeur a posté.
« echeance » contient la date à laquelle les élèves doivent rendre leur devoir, si le post est un devoir
à rendre.
« classe » contient la classe concerné par le post.
BTS IRIS
Session 2014
37
SURGIS VINCENT
 La table « stage »
Cette table contient les informations de stage des élèves en première année. Passons les champs en revue
rapidement :








« eleve » contient l’ « username » de l’élève concerné.
« classe » contient la classe de l’élève concerné.
« entreprise » contient le nom de l’entreprise accueillant l’élève.
« adresse » contient l’adresse de l’entreprise, ou du bureau de l’entreprise dans lequel l’élève va
effectuer son stage.
« code_postal » contient le code postal de la ville où se situe l’entreprise.
« ville » et « pays » contiennent la ville et le pays dans lesquels se trouve l’entreprise.
« telephone » contient un numéro de téléphone de l’entreprise, du service des ressources humaines
ou bien du patron directement.
« site » contient l’adresse du site web de l’entreprise, s’il existe.
 La table « news »
Cette table contient toutes les actualités du lycée postées par les administrateurs. Passons les champs en
revue rapidement :




« username », qui contient l’ « username » de l’administrateur ayant posté la news.
« article », qui contient le corps de texte de la news.
« date », qui contient la date et l’heure à laquelle la news a été postée, dans le format
« timestamp ».
« titre », qui contient le titre de la news.
 La table « classes »
Cette table contient les informations relatives aux classes. Comme mentionné dans l’introduction de cette
sous partie, son « ID » est différent, il contient un chaîne de 10 caractères correspondant au système
classique d’identification d’une classe dans un établissement scolaire, tel que « TS2II » pour une classe de
deuxième année de BTS Informatique Industrielle (ou IRIS), pour donner un exemple.
Ses autres champs sont les suivants :


« nb_eleve », qui contient le nombre d’élèves présents dans la classe.
« matiereX » où X va de 1 à 10, et qui contient une chaine de 60 caractères formatée comme suit :
« matiere-username », avec « matiere » la matière suivie par la classe, et « username » l’
« username » du professeur donnant les cours.
BTS IRIS
Session 2014
38
SURGIS VINCENT
3 – La table « annee »
Cette table est un peu particulière, elle a pour fonction de déterminer l’année scolaire en cours. Elle est
composée de deux champs, « annee1 » et « annee2 », et d’un unique enregistrement correspondant aux
deux années civiles composant l’année scolaire.
BTS IRIS
Session 2014
39
SURGIS VINCENT
III – Authentification d’un utilisateur
Le site web, hébergeant les interfaces de gestion et de consultation des utilisateurs, doit être doté d’un
système de connexion de comptes, et ce pour des raisons simples : chacun des groupes d’utilisateurs ne doit
avoir accès qu’à sa propre interface, et donc à ses droit d’accès et de modification des informations stockées
dans la base de données. De même, chacun des élèves ne doit avoir accès qu’aux informations qui le
concerne, et chaque professeur ne doit avoir accès qu’aux informations et aux droits concernant ses classes.
Ce système de connexion est basé sur les tables « eleves », « profs » et « admin », détaillées dans la partie
précédente. Elles contiennent toutes les champs « username » et « password », qui permettent d'identifier
un utilisateur enregistré dans la base de données. L’authentification s’effectue sur trois étapes, que nous
allons détailler dès à présent.
A – Connexion
Le formulaire de connexion se trouve dans le fichier « login.php », et les utilisateurs y sont redirigés s'ils
tentent d'accéder aux autres pages sans se connecter, ce qui est dû à un script commun à toutes les pages
du site qui sera détaillé par la suite.
L’utilisateur renseigne ses informations de connexion sur le formulaire HTML, et une fois qu’il valide en
cliquant sur le bouton « Connexion », il est redirigé vers la même page PHP. La structure est telle qu’en cas
de requête de connexion, une condition s’occupe d’authentifier l’utilisateur.
Formulaire de connexion
FORMULAIRE HTML
<form action=\"login.php\" method=\"post\">
<table>
<tr>
<td>Votre login :</td>
<td><input type=\"text\" name=\"username\"></td>
</tr>
<tr>
<td>Votre mot de passe :</td>
<td><input type=\"password\" name=\"password\"></td>
</tr>
<tr>
<td></td>
<td>
<input type=\"submit\" value=\"Connexion\" name=\"submit\">
</td>
</tr>
</table>
</form>
BTS IRIS
Session 2014
40
SURGIS VINCENT
Voici le résultat visuel du formulaire :
Script PHP
Comme mentionné précédemment, la structure du script est telle qu’il va tester si les variables de type
« POST », issues du formulaire sont définies. Si ça n’est pas le cas, alors il nous affiche le formulaire
précédent. Si ça l’est, c’est qu’un utilisateur a envoyé une requête de connexion, qu’il faut traiter, avec
l’algorithme suivant :
BTS IRIS
Session 2014
41
SURGIS VINCENT
AUTHENTICATION PHP
if( isset($_POST['submit']) && isset($_POST['username']) &&
isset($_POST['password']) )
// Si les variables POST sont définies (si un utilisateur tente de se connecter)
{
$username = $_POST["username"];
$password = md5($_POST['password']);
// Récupération des variables POST (et encodage MD5 du mot de passe)
$host="";
$user="root";
$pw="";
// Déclaration des variables MySQL
$link=mysqli_connect($host,$user,$pw,'jacquard');
// Connexion à la base de données
$reponse1=$link->query("SELECT username,password
'".$username."'");
'".$username."'");
'".$username."'");
// Requêtes cherchant l'username dans les trois
FROM eleves WHERE username =
FROM profs WHERE username =
FROM admin WHERE username =
tables de personnes
if($row = mysqli_fetch_array($reponse1))
$group = "eleves";
else if($row = mysqli_fetch_array($reponse2))
$group = "profs";
else if($row = mysqli_fetch_array($reponse3))
$group = "admin";
// Récupération des données + définition du groupe d'accès selon la réponse
else
echo '<a href="index.php">Réessayer - Erreur nom de compte</a>';
// S'il n'y a aucune réponse pour les trois tables, redirection.
if($row['password']==$password)
// Vérification du mot de passe, s'il est juste...
{
session_start();
// Début de la session
$_SESSION['username']=$username;
$_SESSION['password']=$password;
$_SESSION['group']=$group;
// Définition des variables de sessions
echo '<p> Vous vous êtes connecté avec succès. </p>
<a href="index.php">Continuer</a>';
// Message de confirmation + redirection
}
else
// Sinon...
echo '<a href="login.php">Réessayer - Erreur mot de passe</a>';
// Redirection vers le formulaire
}
else
// Sinon, on affiche le formulaire
echo "[…]" ;
BTS IRIS
Session 2014
42
SURGIS VINCENT
B – Navigation
Une fois la session engagée, l’étape de la connexion est terminée. Maintenant que l’utilisateur s’est
authentifié « manuellement », et que ses informations de connexion ont été enregistrées dans la session, il
nous est possible d’automatiser l’authentification à chaque fois qu’il passe d’une page à une autre.
Ainsi, on retrouve un script similaire à celui présenté dans la partie A dans un fichier nommé « header.php ».
C’est un fichier qui est inclus dans toutes les pages du site, et qui contient une multitude de fonctions, de
déclarations de variables, et du code HTML qu’elles ont en commun.
AUTHENTIFICATION AUTO.
session_start() ;
// Début – ou récupération – de la session
if (isset($_SESSION['username'])&&isset($_SESSION['password']))
// Si les variables de session sont définies (et donc si la session existe)
{
// - - - - - - - Récupération de la session - - - - - - - - - - - - $session_user=$_SESSION['username'];
$session_pw=$_SESSION['password'];
$session_group=$_SESSION['group'];
// On récupère chaque variable de session
// […]
// - - - - - - - Authentification automatique - - - - - - - - - - - $reponse=$link->query("SELECT password FROM $session_group WHERE username =
'".$session_user."'")
;
$row = mysqli_fetch_array($reponse) ;
$bdd_pw = $row['password'];
// Récupération du mot de passe de l’utilisateur
if($bdd_pw==$session_pw)
// Vérification du mot de passe
$isConnected = true;
else
// S’il n’est pas correct
{
$isConnected = false;
session_unset();
session_destroy();
header("Location:login.php");
// Redirection vers le formulaire de connexion
}
}
else
// Sinon si les variables ne sont pas définies
{
session_unset();
session_destroy();
// Redirection vers le formulaire
}
Ces opérations sont transparentes, et permettent la navigation de plusieurs utilisateurs connectés à
plusieurs comptes.
BTS IRIS
Session 2014
43
SURGIS VINCENT
C – La déconnexion
Puisque les utilisateurs peuvent se connecter, il doivent également pouvoir se déconnecter, dans le cas où ils
utiliseraient un ordinateur public, ou s’ils souhaitent tout simplement empêcher d’autres personnes ayant
accès à leur machine de consulter leurs informations personnelles.
Pour se déconnecter, l’utilisateur a accès à un lien « Déconnexion » situé dans la balise de navigation du
header, et donc accessible quelque soit la page où il se trouve. Ce lien le redirige alors vers la page
« logout.php », dont voici le script, très court.
LOGOUT.PHP
<?php
session_unset();
// Destruction des variables de session
session_destroy();
// Destruction de la session
?>
On retrouve par ailleurs ces fonctions dans le script d’authentification, en cas de mauvais mot de passe, elles
servent à terminer la session immédiatement.
BTS IRIS
Session 2014
44
SURGIS VINCENT
IV – Structure du site et du PHP
Le développement des trois interfaces ayant été réalisé par trois candidats différents, il a fallu déterminer
des règles et des conventions de développement. Que ce soit pour l’arborescence du site ou pour
l’organisation du code PHP, chaque interface avait sa place bien définie.
A – L’arborescence du site
On retrouve dans le répertoire racine toutes les pages PHP principales du site, ainsi que les dossiers des
fichiers plus spécifiques.








« images » contient toutes les images du site, qui servent principalement au design développé par
Benjamin Guiffard
« includes » contient les scripts PHP (et éventuellement des fichiers HTML) qui peuvent être inclus
dans les pages principales. On y trouve notamment « header.php », que nous avons déjà évoqué, et
que nous étudierons dans cette partie.
« pdf » qui contient les scripts nécessaires à Benjamin Guiffard pour créer des fichiers PDF.
« rollback » qui contient une version antérieure du site, et qui constitue une sauvegarde en cas
d’erreur majeure dans un des scripts.
« scripts » qui contient le JavaScript
« sessions », un dossier nécessaire au fonctionnement des sessions
« styles » qui contient les fichiers CSS de Benjamin Guiffard
« tests », un dossier dans lequel un candidat peut tester un script PHP, utile au développement
uniquement.
BTS IRIS
Session 2014
45
SURGIS VINCENT
B – La structure du script PHP
Dans ce point, j’évoquerais la structure d’une page PHP, sans parler de la structure HTML, qui elle a été
travaillée par Benjamin Guiffard, et que vous trouverez dans sa partie.
1 – La structure des pages principales
Les pages principales désignent les pages sur lesquelles les utilisateurs navigueront. Ces pages sont les
suivantes :







absences.php
agenda.php
index.php
news.php
notes.php
search.php
services.php
Ce sont elles qui contiennent les trois interfaces différentes. Étudions leur structure.
BTS IRIS
Session 2014
46
SURGIS VINCENT
Elles sont donc composées de trois parties : le header, qui contient toutes les fonctions et les définitions de
variables communes à toutes les pages, l’interface du groupe de l’utilisateur qui affiche la page, ainsi que le
footer, qui contient des fonctions communes à toutes les fins de pages.
 Le header
HEADER.PHP P1
<?php
session_start();
if (isset($_SESSION['username'])&&isset($_SESSION['password']))
{
// - - - - - - - Récupération de la session - - - - - - - - - - - - $session_user=$_SESSION['username'];
$session_pw=$_SESSION['password'];
$session_group=$_SESSION['group'];
// - - - - - - - Etablissement de la connexion MySQL - - - - - - - $host="";
$user="root";
$pw="";
$link=mysqli_connect($host,$user,$pw,'jacquard');
$reponse=$link->query("SET NAMES UTF8");
// - - - - - - - Récupération de l'année scolaire actuelle - - - - - $reponse=$link->query("SELECT * FROM annee LIMIT 1");
$row = mysqli_fetch_array($reponse);
$annee1 = $row['annee1'];
$annee2 = $row['annee2'];
// - - - - - - - Gestion du temps - - - - - - setlocale (LC_TIME, 'fr_FR');
$year = date ('Y');
$month = date ('m');
$day = date ('d');
$week = date ('w');
function getDaystr($date)
// Renvoie le nom français du jour de la date en paramètre
{
$str_jour = date('w', strtotime($date));
switch($str_jour)
{
case 1 : $str_jour ="Lundi"; break;
case 2 : $str_jour ="Mardi"; break;
case 3 : $str_jour ="Mercredi"; break;
case 4 : $str_jour ="Jeudi"; break;
case 5 : $str_jour ="Vendredi"; break;
case 6 : $str_jour ="Samedi"; break;
case 0 : $str_jour ="Dimanche"; break;
}
return $str_jour;
}
BTS IRIS
Session 2014
47
SURGIS VINCENT
HEADER.PHP P2
function getDayint($date)
// Renvoie en entier (de 0 à 6) le jour de la date en paramètre
{
return date('w', strtotime($date));
}
function getMonthstr ($mois)
// Renvoie le nom français du mois “numérique” en paramètre
{
switch ($mois)
{
case "09" : $mois = "Septembre";
break;
case "10" : $mois = "Octobre" ;
break;
case "11" : $mois = "Novembre";
break;
case "12" : $mois = "Décembre";
break;
case "01" : $mois = "Janvier";
break;
case "02" : $mois = "Février";
break;
case "03" : $mois = "Mars";
break;
case "04" : $mois = "Avril";
break;
case "05" : $mois = "Mai";
break;
default: $mois = "Month not defined"; break;
}
return $mois;
}
// - - - - - - - Détermination de la période actuelle - - - - - - if (isset($_GET['periode']))
{
$periode = $_GET['periode'];
}
else
if($month >= "09" && $month <= "12")
$periode = "Semestre 1";
else
$periode = "Semestre 2";
À noter :


La fonction getMonthstr() ne traite que les mois scolaires, de septembre à mai.
La valeur numérique « 0 » renvoyée par la fonction « date » correspond au dimanche, qui est le
premier jour de la semaine dans le système temporel anglo-saxon.
BTS IRIS
Session 2014
48
SURGIS VINCENT
HEADER.PHP P3
// - - - - - - - Authentification automatique - - - - - - - - - - - $reponse=$link->query("SELECT password FROM $session_group WHERE username =
'".$session_user."'")
;
$row = mysqli_fetch_array($reponse) ;
$bdd_pw = $row['password'];
if($bdd_pw==$session_pw)
$isConnected = true;
else
{
session_unset();
session_destroy();
}
}
else
{
session_unset();
session_destroy();
}
if($_SERVER['REQUEST_URI']!="processing.php")
// On n’affiche pas de header pour le script de traitement de requêtes
« processing.php ».
{
?>
<header>

</header>
<?php } ?>
 L’interface
L’interface est l’élément principal de la page, toutes les structures autour ne permettant que de naviguer
d’une interface à l’autre. Comme vu dans l’algorithme, une condition générale teste la valeur contenue dans
la session correspondant au groupe d’accès de l’utilisateur, et affiche une des trois interfaces selon la
réponse, ou bien un message d’erreur dans le cas où aucune des conditions ne soient remplies –
théoriquement impossible avec l’existence de la redirection vers le formulaire de connexion.
INTERFACE
if ($session_group == "eleves")
{ /* […] */ }
else if ($session_group == "profs")
{ /* […] */ }
else if ($session_group == "admin")
{ /* […] */ }
else echo '<p> 403 - Forbidden</p>';
BTS IRIS
Session 2014
49
SURGIS VINCENT
 Le footer
Le footer quant à lui ne contient que la fonction de clôture de MySQLi, ainsi que du code HTML.
FOOTER.PHP
<?php
if (isset($link))
// Fermeture de la connexion MySQL si elle existe
{
mysqli_close($link);
}
?>
<footer>
< !-- CODE HTML FOOTER -->
</footer>
2 – La structure du script de traitement
Le script de la page « processing.php » permet le traitement de tous les formulaires des interfaces du site.
Par convention, ces formulaires utilisent la méthode « POST », et envoient des variables cachées afin de
permettre un traitement généralisé et automatisé. Voyons la structure d’un de ces formulaires.
 Les formulaire
FORMULAIRES HTML
<form action="processing.php" method="post" >
<table>
<tr>
<td>Type :</td>
<td>
<select name="type">
<option value="Devoirs"> Devoirs
<option value="Cours"> Cours
</select>
</td>
</tr>
<tr>

</tr>
<tr>
<td>
<input type="hidden" name="table" value="agenda">
<input type="submit" name="submit" value="Ajouter">
</td>
</tr>
</table>
</form>
Dans ce formulaire simplifié issu de l’interface de l’agenda des professeurs, emprunté à Amine Outaleb, on
retrouve la structure nécessaire pour le traitement dans le fichier « processing.php ».
On retrouve bien les paramètres « action » et « method » dans la balise <form> correctement définis, mais
aussi deux balises <input /> particulières à la fin du formulaire, de type « hidden » et « submit », ce sont
elles qui permettront de définir les tables de la base de données sur lesquelles agir, ainsi que les requêtes.
BTS IRIS
Session 2014
50
SURGIS VINCENT
 Le script de traitement
Étudions le script « processing.php » afin de comprendre l’utilité de ces deux balises dans les formulaires.
PROCESSING.PHP
<?php
// On retrouve ici les mêmes déclarations et fonctions contenues dans le header,
// qui n'est pas inclus dans cette page.
// ############################## HEADER ##################################
/* […] */
// ############################# TRAITEMENT ##############################
if(!isset($_POST['table'])||!isset($_POST['submit']))
header("Location:index.php");
// Redirection vers l'index si l'utilisateur se perd
else
{
$table = $_POST['table'];
$submit = $_POST['submit'];
// Récupérations des variables conditionnelles
switch($table)
// En fonction de la variable $table
{
case "news" :
// Pour le cas “news”
switch($submit)
// En function ensuite de la variable $submit
{
case "Poster" :
// Pour le cas “Poster”
$query="[…]";
// On définit une requête
break;
case "Modifier" :
$query="[…]";
break;
}
break;
case "agenda" :
switch($submit)
{
// […]
}
/* […] */
}
if(!empty($query)) $reponse=$link->query($query);
if(!empty($query2)) $reponse=$link->query($query2);
// En fin de conditions, on execute jusqu’à deux requêtes si elles existent
BTS IRIS
Session 2014
51
SURGIS VINCENT
PROCESSING.PHP P2
// ---------------------- Redirection --------------------if(isset($_POST['username']))
// Définition de la redirection vers l’interface définie dans $table
// Et définition via l’URL de l’élève ou la classe précédemment traitée
switch($table)
{
case "absences" : $continue="absences.php?eleve=".$_POST['username'] ;
break;
// […]
}
else if(isset($_POST['classe']))
switch($table)
{
case "absences" : $continue="absences.php?eleve=".$_POST['classe'] ;
break;
// […]
}
else
switch($table)
{
case "absences" : $continue="absences.php" ;
break;
// […]
}
if($reponse!=false)
// Si les requêtes de traitement se sont bien passées, redirection
{
header("Location:$continue");
}
else
// Sinon
{
// Affichage de l’erreur MySQLi
}
}
Ce script fonctionne pour la très grande majorité des traitements des différentes interfaces pour les
différents groupes d’accès. On teste successivement les variables « POST » issues des deux derniers
<input/>, à savoir le « submit » et le « hidden », qui ont pour valeur l’action à effectuer, ainsi que la table
sur laquelle l’effectuer.
Ainsi, pour prendre un exemple, pour ajouter une absence, nous aurons les balises suivantes :
BALISES INPUT
<input type="submit" value="Ajouter" />
<input type="hidden" name="table" value="absences" />
Il ne reste plus qu’à écrire une requête pour ajouter une absence dans la variable $query dans les bons
switch/case – ici donc une requête INSERT, et d’y ajouter les variables nécessaires, préalablement
demandées dans le formulaire d’ajout d’une absence.
BTS IRIS
Session 2014
52
SURGIS VINCENT
Cependant, si ce script permet de traiter la majeure partie des cas, ça n’est pas le cas de quelques
fonctionnalités qui nécessitent plus de deux requêtes, ou bien certains qui nécessitent d’interroger la base
de données avant d’y apporter des modifications.
La solution est simple, il suffit d’inclure directement le code dans le case correspondant, et de bien veiller à
vider les variables $query et $query2 si nécessaire, étant donné qu’elles sont toujours traitées en fin de
script.
BTS IRIS
Session 2014
53
SURGIS VINCENT
V – Elaboration de l'interface WEB CPE
Le CPE, dont le rôle dans un établissement est de veiller sur l'ensemble des élèves afin de maximiser leurs
chances de réussite, a donc un contrôle total sur les informations concernant les classes et les élèves.
Il a également un contrôle total sur les retards et les absences, même si une saisie automatique est mise en
place, il doit avoir ces outils à disposition en cas d'erreur de la part d’un professeur, ou de cas particuliers.
Il contrôle aussi la table des actualités, « news », cette fonction a été mise en place après que nous ayons
remarqué que notre CPE nous envoyait beaucoup de mails pour proposer des sorties, nous informer à
propos d'évènements extrascolaires, ou à propos de notre lycée.
Il peut ensuite consulter le relevé de notes, l'agenda, afin de suivre les résultats et le travail des élèves, et la
table contenant les informations sur les stages de première année, qu’il peut éditer en cas d’erreur ou de
problème avec l’entreprise.
Détaillons toutes ces interfaces.
A – Fonction de recherche
Dans un but purement ergonomique, la fonction de recherche a été créée à la moitié du développement de
l’interface administrateur. En effet, jusqu’alors le seul moyen d’accéder aux informations d’un élève était de
connaitre sa classe et son nom, et de les renseigner dans l’interface correspondant aux informations que l’on
souhaitait consulter. Devant suivre un nombre conséquent d’élèves, il est plus aisé de pouvoir accéder à une
fonction de recherche, qui lui permet de retrouver un élève avec le minimum d’informations.
Cette fonction de recherche est toutefois assez basique, bien qu’elle soit suffisamment efficace pour la
gestion d’un lycée. L’utilisateur peut rechercher un élève, ou bien une classe, dans une barre de recherche
BTS IRIS
Session 2014
54
SURGIS VINCENT
présente dans la barre de navigation. Le script propose une liste de résultats, cherchant les termes proposés
parmi les noms, prénoms, username des élèves, et parmi les identifiants des classes.
La recherche s’effectue sur la page autonome « search.php », qui n’utilise pas le script de traitement global
dans « processing.php ». Cette page affiche une barre de recherche, ainsi que les résultats si recherche il y a
eu.
SEARCH.PHP
$table = $_POST['table'];
$submit = $_POST['submit'];
// Récupération des variables du formulaire
$recherche = explode(' ',$_POST['keyword']);
// Décomposition de la recherches en plusieurs termes
$query="SELECT ID,nb_eleves FROM classes WHERE (ID='".$recherche[0]."') ";
for($nb_termes=1;$nb_termes<count($recherche);$nb_termes++)
{
$query = $query."OR (ID='".$recherche[$nb_termes]."')";
}
$reponse=$link->query($query);
// On vérifie si l'un des termes est un ID d'une classe
if(mysqli_num_rows($reponse)>0)
// Si l'un des termes est une classe
{
while($row = mysqli_fetch_array($reponse))
// On affiche un aperçu des infos de la classe en haut de la liste des résultats
{
$reponse2=$link->query("SELECT duree,motif FROM absences WHERE classe =
'".$row['ID']."' ");
// On récupère des informations sur les absences de la classe
$absences = 0;
$abs_justif = 0;
$abs_non_justif = 0;
while($row2 = mysqli_fetch_array($reponse2))
{
$absences += $row2['duree'];
if ($row2['motif']=="N/A")
$abs_non_justif += $row2['duree'];
}
// On stocke des statistiques telles que le nombre d'heures d'absences
// manquées
echo '<article class = "left">
<span class="header_news">
// Lien vers la fiche de la classe
// Lien vers l’édition de la fiche de la classe
</span>
<ul>
<li> Identifiant : <b>'.$row['ID'].'</b></li>
<li> Absences à traiter : <b>'.$abs_non_justif.' heures</b> <br/>
// Lien vers l’interface des absences de la classe
// Lien vers l’interfaces des notes de la classe
</li> <br/>
<li> Nombre d\'élèves : <b>'.$row['nb_eleves'].'</b></li>
</ul>
</article>
';
// On affiche une multitude d'informations dans une balise "article"
}
}
BTS IRIS
Session 2014
55
SURGIS VINCENT
SEARCH.PHP P2
$query="SELECT username,nom,prenom,classe FROM eleves WHERE
(username='".$recherche[0]."' OR nom='".$recherche[0]."' OR
prenom='".$recherche[0]."' OR classe='".$recherche[0]."') ";
// Ensuite on recherche les termes dans la table des élèves
// Cette boucle sert à faire une recherche de plusieurs termes
{
$query = $query."AND (username='".$recherche[$nb_termes]."' OR
nom='".$recherche[$nb_termes]."' OR prenom='".$recherche[$nb_termes]."' OR
classe='".$recherche[$nb_termes]."') ";
}
$reponse=$link->query($query);
// Exécution de la requête
echo "<hr> <div class=\"titre\"> Recherche de « ".$_POST['keyword']."
»</div>";
if(mysqli_num_rows($reponse)>0)
// Si on obtient des résultats
{
while($row = mysqli_fetch_array($reponse))
// On les affiche, avec une multitude d'informations également
{
// Le code ci dessous sert à calculer et afficher la moyenne générale
anuelle de l'élève
$reponse1=$link->query("SELECT DISTINCT matiere FROM notes,eleves WHERE
notes.eleve='".$row['username']."' AND eleves.classe='".$row['classe']."' AND
eleves.username=notes.eleve");
// Récupération de toutes les matières où l'élève est noté
for($i=0;$row1 = mysqli_fetch_array($reponse1);$i++)
{
$matiere[$i] = $row1['matiere'];
}
for($j=0;$j<$i;$j++)
// Calcul des moyennes des différentes matières
{
$reponse2=$link->query("SELECT note,coefficient FROM notes WHERE eleve
= '".$row['username']."' AND matiere ='".$matiere[$j]."'");
$notes = 0;
$coeff = 0;
{
$notes += $row2['note']*$row2['coefficient'];
$coeff += $row2['coefficient'];
}
if($notes==0)
{
$moyennes[$j]=0;
}
else
{
$moyennes[$j] = $notes/$coeff;
}
}
BTS IRIS
Session 2014
56
SURGIS VINCENT
SEARCH.PHP P3
for($k=0,$l=$j,$moyenneG=0;$k<$j;$k++)
// Calcul de la moyenne des moyennes des matières - la moyenne générale.
{
if($moyennes[$k] == 0)
$l--;
else
$moyenneG += $moyennes[$k];
}
if($l==0)
$moyenneGenerale = "Pas encore de notes.";
else
{
$moyenneGenerale = $moyenneG/$l;
$moyenneGenerale = number_format($moyenneGenerale, 2, ',', '');
}
// Puis on récupère des informations sur les absences de l'élève
$reponse2=$link->query("SELECT duree,motif FROM absences WHERE eleve =
'".$row['username']."' ");
$absences = 0;
$abs_justif = 0;
$abs_non_justif = 0;
{
$absences += $row2['duree'];
if ($row2['motif']=="N/A")
$abs_non_justif += $row2['duree'];
}
// On différentie absences justifiées et non justifiées
echo ' […]';
// Puis on affiche toute ces informations, ici le nom, prénom, classe,
// moyenne générale annuelle, absences à traiter, de la même manière que
// pour les classes, ainsi qu’un lien vers la fiche élève détaillée.
}
}
else
echo "<p>Pas de résultat <br/> <a href = \"search.php\"> Retour </a></p>";
// Puis enfin si les termes ne renvoient aucun résultat, on l’affiche.
if(count($recherche)>1)
// Si la recherche est composée de plusieurs terme, alors on effectue des recherches
étendues
// Il s'agit simplement de la recherche des termes un à un, dont les résultats sont
affichés après ceux de la recherche de la totalité des termes.
{
// - - - Recherches complémentaires - - {
echo "<hr> <div class=\"titre\"> Recherche pour le terme
«".$recherche[$nb_termes]."»</div>";
// On recommence la recherche pour chacun des termes
// Avec le même script que précédement.
}
}
BTS IRIS
Session 2014
57
SURGIS VINCENT
Voici ce que donne ce script pour la recherche « surgis vincent ts2ii ».
BTS IRIS
Session 2014
58
SURGIS VINCENT
B – Gestion d’élèves et de classes
La gestion des classes et des élèves se fait sur la même page que la fonction de recherche. Une fois la liste
des résultats affichée, on peut alors accéder aux liens proposant l’affichage des fiches élèves et des fiches
classes. Ces liens sont également accessibles depuis les autres interfaces, et sont sous la forme suivante.

http://localhost/projet/search.php?eleve=vsurgis
C’est la définition d’une variable « eleve » ou « classe » dans l’URL qui permet d’accéder à ces fiches. Elles
proposent un certain nombre d’informations et de liens vers les interfaces de gestion d’absences, et de
consultation des notes.
On retrouve les informations « travaillées » déjà exposées dans la fonction de recherche, comme le calcul et
l’affichage de la moyenne annuelle, mais on trouve aussi d’autres informations issues de la base de données
par la simple requête suivante.
$query= "SELECT * FROM eleves WHERE username='".$_GET['eleve']."';" ;
On trouve un affichage similaire pour la fiche d’une classe.
BTS IRIS
Session 2014
59
SURGIS VINCENT
Concernant l’édition, elle est accessible par l’image du crayon, à côté du nom et prénom de l’élève, ou bien
de l’identifiant de la classe. Il s’agît en fait d’un lien qui ajoute la variable « module » dans l’url, lui donnant
également la valeur « edition »

http://localhost/projet/search.php?eleve=vsurgis&module=edition
Voyons la structure de la page « search.php »
BTS IRIS
Session 2014
60
SURGIS VINCENT
On accède ainsi à un formulaire permettant d’éditer toutes les informations de l’élève.
FORMULAIRE HTML
echo '
<article class = "left">
<span class="header_news"><a class="header_news"
href="?eleve='.$row['username'].'">'.$row['nom'].' '.$row['prenom'].'</a></span>
<form action="processing.php" method = "post">
<table>
<tr>
<td>Classe :</td>
<td><input type ="text" name="classe" value="'.$row['classe'].'"/></td>
</tr>
<tr>
<td>Identifiant : </td>
<td><input type ="text" name="username" value="'.$row['username'].'"/></td>
</tr>
<tr>
<td>Prénom</td>
<td><input type ="text" name="prenom" value="'.$row['prenom'].'" /></td>
</tr>
BTS IRIS
Session 2014
61
SURGIS VINCENT
Formulaire HTML p2
<tr>
<td>Nom</td>
<td><input type ="text" name="nom" value="'.$row['nom'].'" /></td>
</tr>

<tr>
<td>
<input type = "hidden" name = "table" value = "eleves" />
<input type = "hidden" name = "ID" value = "'.$row['ID'].'" />
</td>
<td> <input type="submit" name="submit" value="Modifier"> </td>
</tr>
</table>
</form>
</article>
';
On reprend les informations déjà dans la base de données afin de pré-remplir les champs qui ne seront pas
modifiés, puis on envoie des variables cachés pour permettre le traitement dans « processing.php », comme
la variable « table » déjà évoquée dans un point précédent, ou la variable « ID » qui permet de définir l’élève
ou la classe modifiée dans la requête de modification. Voyons désormais la requête dans
« processing.php » :
$query = "UPDATE `jacquard`.èleves` SET
prenom = '".$_POST['prenom']."',
nom = '".$_POST['nom']."',
username = '".$_POST['username']."',
classe = '".$_POST['classe']."',
naissance= '".$_POST['naissance']."',
adresse ='".$_POST['adresse']."',
telephone = '".$_POST['telephone']."',
mail = '".$_POST['mail']."',
p1_lien = '".$_POST['p1_lien']."',
p1_noms = '".$_POST['p1_noms']."',
p1_tel1 = '".$_POST['p1_tel1']."',
p1_tel2 = '".$_POST['p1_tel2']."',
p2_lien = '".$_POST['p2_lien']."',
p2_noms = '".$_POST['p2_noms']."',
p2_tel1 = '".$_POST['p2_tel1']."',
p2_tel2 = '".$_POST['p2_tel2']."'
WHERE ID = '".$_POST['ID']."' ";
Cette requête est propre au cas « Modifier » de la table « eleves ». Elle met à jour toutes les informations du
formulaire. Il existe également une seconde requête, propre à toute la table « eleves », qui met à jour la
table « classes » :
$query2 = "UPDATE classes INNER JOIN eleves SET nb_eleves=(SELECT COUNT(*) FROM
eleves WHERE eleves.classe = classes.ID)";
BTS IRIS
Session 2014
62
SURGIS VINCENT
 NB : Les prochaines interfaces seront présentées de manière descriptive, et ne seront présentés
les algorithmes ainsi que le code des interfaces les plus intéressantes, afin de ne pas surcharger
le rapport de scripts PHP et de code HTML.
C – Gestion des absences et retards
La gestion des absences et des retards se fait via la même interface. On parle d’interface de gestion des
retards, mais il s’avère en fait que les retards n’ont pas besoin du même système de justification que les
absences. Les retards n’ont qu’un motif, choisi parmi une liste de propositions générales.
L’interface dispose d’une structure telle qu’elle se divise en plusieurs sous-interfaces. Voyons l’algorithme :
BTS IRIS
Session 2014
63
SURGIS VINCENT
La gestion d’une absence se fait sur la fiche absence, où le CPE peut éditer les informations, consulter la
justification de l’élève, donner un motif, valider ou supprimer une absence.
Pour ajouter une absence, le CPE doit sélectionner un élève. Le formulaire se trouve sous le calendrier des
absences. N’étant pas censé ajouter un grand nombre d’absences, ce système n’a pas besoin d’optimisation
particulière.
 La sélection de classe
L’étape de la sélection d’une classe, proposée dans l’interface d’une journée (dans le cas particulier où
aucune classe n’est auparavant déclarée), mais aussi quand aucune variable n’est déclarée sur la page
« absences.php », ce qui arrive quand l’utilisateur y accède par la balise de navigation, ne consiste qu’à
proposer une liste de liens permettant de définir la variable « classe » dans l’URL.
La liste est construite notamment grâce à une requête SQL qui interroge la table « classes » de la base de
données.
SELECT ID FROM classes ;
 La sélection d’élève et le suivi d’une classe
Cette interface s’affiche une fois la classe sélectionnée. Elle propose des statistiques d’absentéisme de la
classe, ainsi que d’un suivi mensuel des absences notamment composé d’une liste des élèves cliquable. En
cliquant sur un élève, alors on le sélectionne en définissant la variable « eleve » dans l’URL, ce qui permet de
passer au calendrier des absences.
Le suivi mensuel propose également des liens de redirection vers l’interface d’une journée et vers les fiches
des absences affichées, ainsi que la possibilité de changer le mois visualisé.
Il s’agit d’un tableau à double entrée, avec d’une part les élèves de la classe, et de l’autre les jours du mois.
Dans chaque case est inscrit le nombre d’heures manquées par les élèves, avec un code de couleur
permettant de déterminer d’un coup d’œil si les absences ont été traitées, et l’état du traitement dans
lequel elles se trouvent.
BTS IRIS
Session 2014
64
SURGIS VINCENT
Le résultat visuel du suivi mensuel :
 La fiche d’absence
La fiche des absences fonctionne de la même manière que la fiche élève, ou que la fiche classe. Il s’agit d’un
formulaire pré-rempli également, nous ne détaillerons donc pas le code. Voici le résultat visuel :
BTS IRIS
Session 2014
65
SURGIS VINCENT
 Absences d’une journée
Cette interface, qu’elle soit pour une classe ou pour un élève, permet de suivre les retards et les absences
sur une journée. Elle est composée d’un tableau HTML qui regroupe l’emploi du temps du jour à gauche,
puis les absences et les retards à droite.
On trouve dans la colonne des absences les liens menant à la fiche absence pour chaque entrée, avec la
prévisualisation du motif, et de la validation.
Voici comme elle se présente :
 Le calendrier des absences
Et enfin, gardons le meilleur pour la fin, le calendrier des absences. Il s’agit d’un calendrier divisé en deux
semestres, composés des mois de septembre à mai. Il affiche toutes les absences d’un élève sur un
semestre, suivant le même principe que le suivi mensuel, ce qui permet au CPE d’avoir une vue d’ensemble
des journées manquées par l’élève.
Il propose, tout comme le suivi mensuel, des redirections vers les fiches absences et les interfaces de gestion
de journées correspondantes, ainsi qu’un code de couleur pour juger du traitement des absences.
BTS IRIS
Session 2014
66
SURGIS VINCENT
CALENDRIER ABSENCES.PHP
if(!isset($_GET['classe']))
{
$reponse=$link->query("SELECT classe FROM eleves WHERE
username='".$_GET['eleve']."'");
$data = mysqli_fetch_array($reponse);
$classe = $data[0];
}
else
$classe = $_GET['classe'];
// Définition de la classe
echo'<div class="periode">';
if($periode=="Semestre 1")
echo '[…]';
else
echo '[…]';
// Barre de sous-navigation
echo '</div> <section class="contenu">';
// Contenu de la page
echo "<table>";
switch($periode)
// Selon la période...
{
case "Semestre 1":
// Cas du premier semestre
$annee = $annee1;
// L'année actuelle est l' "annee1" de la table "annee" de la base de donnée
echo "<tr class=\"coul1> […] </th>";
// On affiche un tableau
for($i=1;$i<=31;$i++)
// De 31 lignes (pour les 31 jours du mois)
{
echo"<tr class=\"grey\"> <th>$i</th>";
// On affiche le numéro du jour à gauche du tableau
for($j=0;$j<4;$j++)
// Et le tableau est composé de 5 colonnes (le header de ligne + 4 mois)
{
if($i<10)
$jour = "0".$i;
else
$jour = $i;
// Formattage de variable, le jour correspond au compteur de ligne
switch($j)
// Selon le mois dans le semestre 1...
{
case 0 : $mois = "09"; break;
default : break;
}
// On définie les mois en fonction du compteur de la boucle de colonne
if(($i==31&&$j==0)||($i==31&&$j==2))
echo "<td class=\"white\"></td>";
// On vide les cases "31 septembre" et "31 novembre" qui n'existent pas
BTS IRIS
Session 2014
67
SURGIS VINCENT
CALENDRIER ABSENCES.PHP
else
// Pour le reste
{
$reponse2=$link->query("SELECT
ID,heure,duree,date,matiere,validation,justification FROM absences WHERE date=
'$annee-$mois-$jour' AND eleve='".$_GET['eleve']."'");
// On récupère les absences du jour
echo "<td class=\"abs\">
<div class=\"abs_header_jour\">
<a href=\"[…]\" >".getDaystr("$annee-$mois-$jour")."</a>
</div>";
// On affiche le jour, avec un lien vers l'interface de journée
while($row2=mysqli_fetch_array($reponse2))
// On affiche les absences tant qu'il y en a
{
if($row2)
{
if($row2['validation']=="Doit visiter le CPE")
{
echo"<div class=\"red\">";
}
else if($row2['validation']=="N/A")
{
if(empty($row2['justification']))
{
echo "<div class=\"orange\">";
}
else
{
echo"<div class=\"yellow\">";
}
}
else
{
echo "<div class=\"green\">";
}
// En fonction de la validation, du motif et de la
// justif, on affiche un code de couleur différent
echo "<a href=?id=".$row2['ID'].">".$row2['heure']." ".$row2['duree']."h (".$row2['matiere'].")</a> <br/> </div>";
// Et enfin on affiche les informations relative à
// l'absence.
}
}
// Fin affichage des absences dans une journée
echo"</td>";
}
// Fin d’affichage d’une journée
}
// Fin d’affichage d’une ligne
echo"</tr>";
}
// Fin du calendrier, et de la période semestre 1
break;
case "Semestre 2":
// Cas du semestre deux, script similaire.
break;
}
echo "<table class='legend'> […]</table>";
// La légende en bas du calendrier
BTS IRIS
Session 2014
68
SURGIS VINCENT
Juste en dessous du calendrier se trouvent également des statistiques et le formulaire d’ajout d’absences.
Voici le résultat visuel du calendrier pour mes absences, sur le second semestre :
Sont donc cliquables les noms des jours, qui redirigent vers l’interface d’une journée, et les informations des
absences, qui amènent sur leurs fiches respectives.
D – Gestion de l’emploi du temps
L’emploi du temps est accessible sur la page « services.php », tout comme la gestion des stages. Il sert à
renseigner professeurs et élèves de leurs emplois du temps. C’est au groupe d’admin de les définir pour
chaque classe du lycée.
La consultation de l’emploi du temps se fait grâce à une imbrication de boucle, à la manière du calendrier
des absences, avec pour double entrée le coupe « jour – heures ». A chaque itération, on envoie une requête
à la base de donnée pour récupérer la matière ayant lieu au jour $j et à l’heure $h, ces variables étant les
compteurs des deux boucles, pour afficher la matière correspondante. On teste aussi si la variable
« module » existe, et est définie par « edition ». Si c’est le cas, on propose de changer la matière pour une
autre.
BTS IRIS
Session 2014
69
SURGIS VINCENT
L’algorithme de la page de gestion d’emploi du temps :
Enfin, la requête SQL permettant de récupérer les informations sur l’heure de cours à chaque itération est la
suivante :
$query = 'SELECT matiere,prof FROM emploi_du_temps
WHERE jour='.$j.' AND heure ='.$h.' AND classe='.$_GET['classe'].' ; ' ;
Ce qui nécessite bien sûr que la classe soit définie dans l’URL.
BTS IRIS
Session 2014
70
SURGIS VINCENT
E – Gestion des stages
L’interface dite de « gestion des stages » n’a pas vraiment vocation à « gérer », malgré le nom que nous lui
donnons. Il s’agit plutôt d’une interface de consultation, même s’il peut arriver au CPE d’apporter des
modifications occasionnelles.
Cette interface sert avant tout à suivre l’évolution de la recherche de stage des élèves de première année,
ainsi qu’à fournir un carnet d’adresses aux élèves rencontrant des difficultés lors de cette dernière.
On retrouve une étape de sélection de classe, sur laquelle on a également accès à l’ensemble de la base de
données des stages. Une fois la classe sélectionnée, nous avons l’ensemble des stages pour cette classe,
dont les informations sont éditables, comme mentionné précédemment, pour occasionnellement corriger
des erreurs, ou bien mettre à jour certaines informations
F – Gestion des actualités
Les actualités du lycée sont postées par le groupe administrateurs. Les six dernières actualités sont visibles
directement sur l’index du site, qui s’affiche à chaque fois qu’un utilisateur se connecte. Il est également
possible d’y poster une actualité, pour le groupe « admin », sinon la gestion se fait sur la page « news.php ».
La structure de cette interface est assez simple :


Si l’ « ID » de l’article est défini dans l’URL, alors on affiche l’article. Si en plus la variable « action »
est définie par « editer », alors on propose un formulaire pour modifier l’article.
Si l’ « ID » renseigné n’existe pas dans la base de données, alors on informe l’utilisateur que le lien
ne fonctionne pas.
BTS IRIS
Session 2014
71
SURGIS VINCENT

Si aucune variable n’est définie, alors on affiche la liste des actualités, qu’on propose de classer par
ordre chronologique ou antéchronologique, puis on affiche le formulaire permettant de poster une
nouvelle actualité.
G – Consultation des notes et de l’agenda
J’ai pris soin de réunir ces deux interfaces dans la même sous partie pour une simple raison ; le groupe
d’administrateur n’a que le droit de consulter la base de données pour ces tables. Il s’agit d’un outil pour
suivre le travail des élèves. Ces deux tables sont gérées par les professeurs, aussi les administrateurs ont la
même interface que les élèves à la seule exception près qu’ils peuvent accéder aux notes et à l’agenda de
n’importe quelle classe ou élève.
Je laisse le soin à mes camarades de décrire ces interfaces en détails, d’autant que ce sont eux qui m’ont
gentiment mis leur code à disposition afin que je l’adapte pour l’utilisation du groupe administrateurs. En
quelques mots :

Les notes sont classées par période, autrement dit par semestre.
BTS IRIS
Session 2014
72
SURGIS VINCENT




Le groupe administrateur dispose de statistiques supplémentaires, par rapport à l’interface élève,
que j’ai développé pour afficher les moyennes annuelles, semestrielles, générales ou par matière et
permettre un suivi des élèves.
La structure de « notes.php » reprend celle de « absences.php », quant à la navigation étape par
étape. On débute par la sélection d’une classe, puis par la sélection d’un élève, puis enfin par la
sélection d’une période de l’année, ces variables se trouvant dans l’URL à chaque clic.
L’agenda propose aux élèves un suivi des cours et des devoirs à faire à la maison. Les « posts » des
professeurs sont classés par « type », à savoir « cours » ou « devoirs ».
Par défaut les variables « mois » et « jour » sont définies pour afficher les devoirs pour le
lendemain. Ces variables peuvent être changées grâce à un système de calendrier simplifié.
BTS IRIS
Session 2014
73
OUTALEB AMINE
OUTALEB AMINE
Rôle
Développe l'interface web pour le groupe des professeurs, ainsi que les scripts JavaScript à partir de JQuery.
I – Lancement et fonctionnalités de l’interface professeur
A – Connexion
Pour se connecter en tant que professeur on utilisera les données suivantes :



Droit d'accès : Professeur
Identifiant : bguilbert
Mot de passe : spoke

Page de connexion
B – Fonctionnalités
Après la connexion en tant que professeur on est dirigé vers « index.php » qui est l’accueil ou nous pouvons
consulter les actualités.
 Accueil
BTS IRIS
Session 2014
74
OUTALEB AMINE
Et nous avons aussi accès au header.
 Header
Le header permet d’accéder à différentes fonctionnalités :






Accueil : permet de voir les actualités récentes.
Actualités : permet de voir les actualités avec leurs dates de mise en ligne.
Notes : Ajouts, modifications, consultations des notes.
Absences : consultations et ajouts d’absences.
Agenda : ajout d’un devoir.
Services : emploie du temps personnel et des classes.
 Code du header
Ici chaque bouton renvoie à une page « .php ».
BTS IRIS
Session 2014
75
OUTALEB AMINE
C – Bases de données utilisé
 La base de données
Pour la session professeur on utilisera principalement les tables « profs, notes, eleves ».
1 – Notes
 Table notes
Pour la table notes, nous avons plusieurs colonnes.









ID : le numéro d’identifiant d’une note.
Eleve : soit l’username de l’élève commence par la première lettre du prénom suivie du nom de
famille.
Note : une note d’un contrôle.
Intitule : l’intitulé du contrôle.
Matière : la matière du devoir (maths, physique).
Prof : l’username du professeur.
Date : la date de l’entré de la note.
Periode : semestre 1 ou semestre 2.
Coefficient : coefficient de la note.
BTS IRIS
Session 2014
76
OUTALEB AMINE
2 – Elèves
 Table eleves
On prend que les données que l’on va utiliser :






ID : le numéro d’identifiant de l’élève.
Prénom : le prénom de l’élève.
Nom : nom de famille de l’élève.
Username : le nom d’utilisateur de l’élève commence par la première lettre du prénom suivie du
nom de famille.
Password : le mot de passe crypté sous md5.
Classe : la classe de l’élève.
3 – Profs
 Table profs






ID : le numéro d’identifiant du professeur.
Prenom : le prénom du professeur.
Nom : le nom du professeur.
Username : le nom d’utilisateur du professeur commence par la première lettre du prénom suivie du
nom de famille.
Password : le mot de passe crypté sous md5.
Matiere : la matière enseignée.
BTS IRIS
Session 2014
77
OUTALEB AMINE
II – Notes
A – Sélections
1 – Classe
L’arrivé sur « notes.php »

Liste des classes
Nous arrivons sur les différentes classes dont le professeur est responsable.
 Code liste des classes
$reponse=$link->query('SELECT ID FROM classes');
Cette ligne herche dans la base de donné toute les ‘ID’ de chaque classe puis avec une boucle for on affiche
les classes sous forme de bouton.
2 – Élèves
Après avoir sélectionné une classe, la liste des élèves de cette classe s’afficherons et on pourra les
sélectionnés pour des ajouts personnels d’une note ou bien pour une modification de note.
BTS IRIS
Session 2014
78
OUTALEB AMINE
 Notes d’une classe définie
 Code affichage des notes d’une classe selon le semestre sélectionné
BTS IRIS
Session 2014
79
OUTALEB AMINE
Nous avons un tableau avec trois colonnes – Elèves – Notes – Ajout.
Dans la colonne Elèves on récupère les données des élèves de la classe sélectionné auparavant avec la
méthode GET :
$reponse=$link->query("SELECT username,nom,prenom FROM eleves WHERE classe
='".$_GET['classe']."'");
Et dans un while on affiche le nom et prénom des élèves.
Dans la colonne Notes on récupère les notes, les coefficients des élèves de la colonne précédente avec
seulement les notes viennent du professeur connecté « $session_user ».
$reponse1=$link->query("SELECT note,coefficient FROM notes WHERE
eleve='".$donnee['username']."' AND periode= '$periode' AND prof =
'".$session_user."' ");
Et dans un while on affiche les notes et coefficients des élèves.
On peut cliquer sur un élève ce qui nous donnera ses informations personnelles.
 Notes d’un élève définie
Nous pouvons d’ici lui ajouter une note ou modifier une actuel seulement dans sa propre matière.
BTS IRIS
Session 2014
80
OUTALEB AMINE
 Code affichage des notes d’un élève défini
$reponse3=$link->query("SELECT * FROM notes WHERE eleve='".$_GET['eleve']."' AND
periode= '$periode' AND prof = '".$session_user."' ");
On récupère toute les notes ou les notes ont comme matière celle du professeur enseignant fais en haut du
code pour affecter tout le code.
Nous avons accès à toutes ses notes dans toutes les matières et à sa moyenne générale.
 Moyennes de l’élève
BTS IRIS
Session 2014
81
OUTALEB AMINE
 Code affichage des moyennes
B – Ajouts
1 – Ajout à une personne
Pour cela il faut entrer dans les informations personnelles de l’élève comme montrer ci-dessous :
 Ajout d’une note
BTS IRIS
Session 2014
82
OUTALEB AMINE
Puis cliquer sur le bouton ajouter.
La note a bien été ajoutée.
Pour ajouter une note il faut faire une requête SQL, un INSERT. Pour ces requêtes nous avons
« processing.php ». C’est une page PHP on l’on envoie toute les requêtes de ce genre. On envoie ces
données de « notes.php ».
 Code ajout d’une note à un élève sélectionné
On envoie la note, la matière, l’intitulé, l’username de l’élève, le semestre, le coefficient, l’username du
professeur. Grace à :
Qui permettra d’entrer dans la partie notes dans processing.php « case "notes" : » puis avec un switch
aller dans « case "Ajouter" : ».
BTS IRIS
Session 2014
83
OUTALEB AMINE
 code d’insertion du nouvel note
Quand on a accomplie tout cela il suffit de récupérer les données avec la méthode POST.
2 – Ajout d’un contrôle
Il faut retourner à la sélection d’une classe.
 Ajout d’un contrôle
Le coefficient, l’intitulé et la période ici sont générale contrairement à la note personnelle puis on clique sur
« Nouveau ».
 Code d’ajout d’un contrôle
BTS IRIS
Session 2014
84
OUTALEB AMINE
Ici on a simplement la saisie des données sauf des notes qui est la seul qui change.
On prend les notes une par une avec une boucle while puis on envoie à processing.php comme avec l’ajout
personnelle sauf que ici le switch entrera « Nouveau ».
Dans processing.php on récupère d’abord l’username des élèves de la classe récupéré avec la méthode
POST puis on lance une boucle ou on ajoute les notes en fonction du nom de l’élève choisi et on suit avec
une requête vide en dehors de la boucle car le système affichera une seconde fois la dernière valeur entrée.
 Code insertion des nouvelles notes
BTS IRIS
Session 2014
85
OUTALEB AMINE
On voit bien que les notes sont ajoutés et pour la case vide il n’y a rien d’ajouté.
C – Modification
Pour la modification d’une note il faut entrer dans sa page personnelle prenons pour exemple l’élève
« Loann Bugega »
 Modification d’une note
En cliquant sur une note on pourra la modifier.
 Code de modification
Qui renvoie à notes.php?id=X à l’identifiant de la note sélectionné. Soit à :
BTS IRIS
Session 2014
86
OUTALEB AMINE
 Page de modification
 Code d’envoie de la nouvelle note


On récupère toute les données de la note avec son identifiant en utilisant la méthode GET.
On envoie le tout à processing.php avec la nouvelle note avec le submit « Modifier ».
Le UPDATE permet de charger la nouvelle note sans toucher au reste.
Pour l’exemple on change le 13 en 14.
La note a bien été changée.
BTS IRIS
Session 2014
87
OUTALEB AMINE
III – Autres fonctions
A – Absence
1 – Consultation
La consultation se fait par choix de la classe. Après sélection on arrive sur cette page.
 Tableau d’absence d’une classe
On y voit les absences de la classe avec les justifiés ou pas
 Code du tableau d’absence d’une classe
BTS IRIS
Session 2014
88
OUTALEB AMINE
Ici on utilise la table absences.
 Table absences
 Calendrier d’absence.
On fait les conditions identiques pour chaque mois pour sélectionner le mois voulu.
BTS IRIS
Session 2014
89
OUTALEB AMINE
On lance une requête pour récupérer – ID – heure – duree – date – matiere – validation – justification dans
la table absences correspondant à un élève d’une classe.
En cliquant sur un élève défini on a ses absences personnelles sous forme de calendrier.
B – Ajout d’une absence
Il faut choisir une date heure de l’absence suivie de sa durée ici en tant que professeur la matière est
directement envoyer à la base de donnée.
BTS IRIS
Session 2014
90
OUTALEB AMINE
 Code ajout d’une absence
Ici contrairement au CPE l’absence doit avoir automatiquement le nom du professeur et sa matière. Avec :
Qui permettra d’entrer dans la partie notes dans processing.php « case "absences" : » puis avec un switch
aller dans « Ajouter ».
On récupère les données avec POST. Pour l’exemple, pour l’élève David Sa.
On lui ajoute une absence le 3/5/2014 de 9 heures à 11 heures.
Son absence apparait bien.
BTS IRIS
Session 2014
91
OUTALEB AMINE
C – Service
Tout d’abord choisir un service.
1 – Emploi du temps personnel
Les professeurs ont accès à leur emploi du temps
 Code affichage de l’emploi du temps personnel
BTS IRIS
Session 2014
92
OUTALEB AMINE
On récupère les données dans la table emploi_du_temps, dans eleves et dans profs :
 Table profs
Grace à :
D – Horaires des classes
Après une sélection d’une classe par exemple la classe TS2II.
BTS IRIS
Session 2014
93
OUTALEB AMINE
E – Agenda
1 – Datepicker
Le datepicker est une fonction téléchargeable sur internet nous permettant de sélectionné une date lié à un
champ de saisie de formulaire standard. Il suffit donc de cliquer sur la date pour qu’elle soit dans le champ.
Mais le datepicker est seulement en anglais et la sélection de la date se fait sous forme (jj/mm/aaaa) alors
que pour notre base de donnée on doit l’entrer sous forme (aaaa/mm/jj).Pour changer sa forme on utilise
une fonction javascript qui est :
 Code javascript datepicker
BTS IRIS
Session 2014
94
OUTALEB AMINE
Dans ce code on change d’abord le nom des mois que l’on met en français puis nous faisons de même avec
leurs diminutions puis le nom des jours avec leurs diminutions et leurs premières lettres. Le format de la
date vient ensuite que l’on met sous forme (aaaa-mm-jj) avec des tirets c’est important sinon la base de
donnée ne reconnait pas la date. Le isRTL signifie is Right to Left qui veut dire de droite à gauche c’est l’ordre
de lecture car dans certains pays on lit de droite à gauche donc on retourne false car nous lisons de gauche à
droite.
Mais avant tout il faut signaler l’utilisation du datepicker
 Code d’utilisation du datepicker
2 – Ajout d’un devoir
BTS IRIS
Session 2014
95
96
 Utilisation de la table agenda
 Code d’envoi du devoir
 Code d’insertion du nouveau devoir
BTS IRIS
Session 2014
GUIFFARD BENJAMIN
GUIFFARD BENJAMIN
Rôle
Développe l'interface web pour le groupe des élèves. Il gère également le design graphique du site, utilisant
le CSS.
I – En tant qu’élève, que puis-je fais ?
Etant élève je peux accéder au site, pour cela je dois m’identifier à l’aide des identifiant que mon CPE ou
professeur principal m’aura au préalable donnés.







Une fois connecté, j’ai accès directement aux dernières actualités que le CPE aura mis sur le site.
A partir de là, je peux naviguer sur les différentes parties du site.
Je peux visualiser toute les news que le CPE a mis en allant sur la page des actualités.
Je peux prendre connaissance de mes notes obtenues tout au long des deux semestres.
Je peux également voir mes absences depuis le début de l’année et les justifier directement sur le
site.
J’ai accès à l’agenda de ma classe, avec les devoirs à faire ainsi que les grandes lignes des cours de
chaque jour.
Enfin je peux voir mon emploi du temps, envoyer les détails de mon stage et obtenir la convention
de stage en format PDF.
BTS IRIS
Session 2014
97
GUIFFARD BENJAMIN
A – Détaillons ces parties
1 – Les actualités
Une fois que l’on est connecté au site, on accède aux dernières actualités posté par le CPE, ces « news » sont
disposé de tel sorte que une fois sur deux la news est soit collé à droite de la fenêtre, soit à gauche.
Afin d’afficher ces news on se connecte à la base de donnée du site, et on sélectionne toute les données
entré dans la table « news », mais on ne veut pas surcharger la page donc on ne demande que les 6
dernières news, à l’aide de la requête SQL :
SELECT * FROM `news` ORDER BY id DESC LIMIT 6
Pour obtenir l’effet de gauche / droite, il suffit de créer une boucle qui s’incrémentera et à chaque fois que la
news aura un chiffre pair, elle sera à droite, sinon elle sera à gauche.
INDEX.PHP
for($i=0;$line = mysqli_fetch_array($reponse);$i++)
{
if ($i%2==1)
// Le calcul de modulo permet d’avoir une condition vraie pour $i impaire
$style = "right";
else
$style = "left";
echo '
<article class = "'.$style.'">
// L’alternance du style se retrouve directement ici
<span class="header_news">
<a class="header_news"
href="news/?id='.$line['ID'].'">'.$line['titre'].'</a>
</span>
<p>'.$line['article'].'</p>
<span class="info_news">
Posté le '.$line['date'].', par '.$line['username'].'
</span>
</article>
';
}
Si l’on désire revoir une actualité plus ancienne on peut tout à fait le faire en allant sur la page des actualités,
sur cette page on obtient la liste des toute els actualités posté depuis le début du site et ranger par ordre
croissant (ou décroissant selon l’envie de l’utilisateur) de date de création.
NEWS.PHP
<div class='titre'> Actualités </div><br/>
<span class=\"order\">
<a href=\"?\"> Plus ancien </a> - <a href = \"?order=DESC\"> Plus récent </a>
</span>
<hr class='actual'/>";
if(!isset($_GET['order']))
$reponse=$link->query("SELECT * FROM `news` ORDER BY id");
else
$reponse=$link->query("SELECT * FROM `news` ORDER BY id ".$_GET['order']);
// Ici, on ordonne par ordre décroissant si “order” est défini
BTS IRIS
Session 2014
98
GUIFFARD BENJAMIN
NEWS.PHP P2
echo "<ul class='news'>";
while($line = mysqli_fetch_array($reponse))
{
echo "
<li>
<a href="?id='.$line['ID'].'">'.$line['titre'].'</a>, par '.$line['username'].',
le '.$line['date'].'
</li>';
// On affiche la liste du résultat
}
echo "</ul>";
1 – Les notes
Les élèves ont accès à la totalité des notes qu’ils ont obtenu tout au long de l’année scolaire. La partie note
du site est décomposé en deux parties, en deux semestres pour être exacte, lorsque l’élève est sur la partie
note, il peut choisir le semestre qu’il souhaite voir en cliquant soit sur le bouton du Semestre 1, soit sur celui
du Semestre 2 (par défaut il sera sur le semestre 1). Les notes sont inscrites dans un tableau contenant les
matières, les professeurs, les notes, et les coefficients de ces notes.
Pour obtenir ce tableau des notes, on sélectionne tout d’abord la période que l’on veut observer à l’aide de
bouton :
HTML
<a href="?periode=Semestre 1" class="button3">Semestre 1</a>
<a href="?periode=Semestre 2"class="button3"> Semestre 2</a>
Pour afficher un tableau ergonomique on le fera en deux temps. Dans un premier temps on va sélectionner à
l’aide d’une requête SQL les colonnes « matiere » et « prof » de la table « notes » de la base de donné, en
faisant attention à avoir les notes de la période demandé, que ce soit les notes de l’élève connecté et en
enlevant les doublons.
SELECT DISTINCT matiere, prof FROM notes WHERE periode= '".$periode."' AND
eleve='".$session_user."'
On affiche ensuite les matières et nom des professeurs dans un tableau à l’aide d’une boucle.
NOTES.PHP
while($matiere = mysqli_fetch_array($reponse))
{
echo " <tr class = \"grey\"><td class=\"discipline\">".$matiere[0]."<br/><span
id=\"prof\">".$matiere[1]."</span></td>
}
Puis on affichera les notes et coefficients à l’aide d’une seconde requête à l’intérieur même du tableau. Une
requête qui permettra d’obtenir les notes et coefficients à partir de la période sélectionné ainsi que de
l’élève comme précédemment, mais également à partir de la matière qu’on à obtenu juste avant. On créer
alors une table dans une table.
BTS IRIS
Session 2014
99
GUIFFARD BENJAMIN
NOTES.PHP
echo "<td class=\"resultats\">";
$reponse1=$link->query("SELECT note,coefficient FROM notes WHERE periode=
'".$periode."' AND eleve='".$session_user."' AND matiere='".$matiere[0]."'");
while($notes = mysqli_fetch_array($reponse1))
{
echo $notes[0]."(coeff ".$notes[1].") ";
}
echo "</td> " ;
On obtient alors un tableau affichant les notes de l’élève de chaque matière dans le semestre demandé.
3 – Les absences
Le sujet de notre projet étant la gestion des absences, il parait logique que nous ayons une partie consacré
aux absences de nos très chers élèves. Le système des absences coté élève est sensiblement identique au
système des notes. L’élève doit pouvoir accéder à toutes ses absences de l’année, pour chacune de ses
absences il y a la date de l’absence, l’heure, la durée, le statut, le motif, et la justification. Comme pour les
notes, les absences sont divisé en deux semestre, et l’ont récupère les données de la base de données dans
un tableau.
Contrairement aux notes, il est plus simple de récupérer les absences. Une condition est faite concernant la
période. Et selon la période sélectionné, la requête SQL changera.
ABSENCES.PHP
if($periode == "Semestre 1")
{
// On affiche les lignes du tableau une à une à l'aide d'une boucle
$reponse=$link->query("SELECT * FROM absences WHERE eleve='".$session_user."'
AND date<='$annee1-12-31'");
}
BTS IRIS
Session 2014
100
GUIFFARD BENJAMIN
ABSENCES.PHP P2
else
{
$reponse=$link->query("SELECT * FROM absences
AND date>='$annee2-01-01'");
}
WHERE eleve='".$session_user."'
Ensuite il ne reste plus qu’à afficher les résultats de cette requête dans un tableau et le tour est joué. Mais
afin de rajouter un peu de difficulté un système de parité à était mis en place pour ce tableau a l’aide d’un
compteur. C’est-à-dire qu’à chaque ligne du tableau, le numéro de la ligne s’incrémente de 1, et lorsque la
ligne a un chiffre pair, elle sera d’une certaine couleur (ici grise), et lorsque le chiffre est impair la couleur
sera autre (blanche dans notre cas).
ABSENCES.PHP P3
$i=0;
while($donnees = mysqli_fetch_array($reponse))
{
if ($i%2)
{
echo"
<tr class = \"grey\">
<td class='afk'>".$donnees['date']."</td>
<td class='afk'>".$donnees['heure']."</td>
<td class='afk'>".$donnees['duree']." heures</td>
<td class='afk'>".$donnees['validation']."</td>
<td class='afk'>".$donnees['motif']."</td>
<td>".$donnees['justification']."</td>
</tr>
";
}
else
{
echo"
<tr class = \"white\">
<td class='afk'>".$donnees['date']."</td>
<td class='afk'>".$donnees['heure']."</td>
<td class='afk'>".$donnees['duree']." heures</td>
<td class='afk'>".$donnees['validation']."</td>
<td class='afk'>".$donnees['motif']."</td>
<td>".$donnees['justification'</td>
</tr>
";
}
$i++;
}
Une fois que l’élève a vu ses absences, il reste une dernière chose qu’il peut faire dans cette partie, c’est
apporté une justification à ses absences. Soit la créer, soit la modifier. Pour cela, un icone représentant un
crayon a était implanter dans la colonne « justification » du tableau pour chaque absence. Au clic de la souris
sur l’icône, le site nous redirige vers une sous-partie de la partie absence, et c’est ici que l’on peut ajouter ou
apporter une modification à une justification.
De plus, chaque absence possède un ID propre. Ainsi lorsqu’on clique sur l’icône, on est redirigé vers la
justification de l’absence à laquelle l’icône correspond et non une absence aléatoire.
HTML
<a href=\"absences.php?id=".$donnees['ID']."\"><img src='images/+.gif'></a>
BTS IRIS
Session 2014
101
GUIFFARD BENJAMIN
Donc, une fois avoir cliqué sur le stylo, on a deux possibilités. Soit il n’y a aucune justification, il faut donc en
créer une. Soit il y en a déjà une, auxquelles cas il faudra la modifier et non la créer. Pour cela, nous
envoyons une requête SQL qui sélectionnera la justification de l’absence sélectionné grâce à son « ID », puis
une condition est faite qui, si elle reçoit une réponse de la requête, affichera la justification ; si elle n’en
reçoit pas, elle créera la justification.
ABSENCES.PHP P4
$reponse=$link->query("SELECT justification FROM absences
ID='".$_GET['id']."'");
$donnees=mysqli_fetch_array($reponse);
// Récupération du contenu de la BDD
if($donnees)
// Si les données existent
{
$rp2=$link->query("SELECT * FROM absences
$dn2 = mysqli_fetch_array($rp2);
WHERE
WHERE ID='".$_GET['id']."'");
echo "
<div class='justif'>Justification du ".$dn2['date']." à ".$dn2['heure']."</div>
<section class='contenu'>
<form action = 'processing.php' method ='POST'>
<textarea name='justif'>".$dn2['justification']."</textarea>
<input type='hidden' name ='id' value =".$_GET['id'].">
<input type='hidden' name ='table' value ='absences'><br>
<input type='submit' name='submit' value='Justifier'>
</form>
</section>
";
// On propose de modifier la justification
}
Else
// Sinon
{
$rp2=$link->query("SELECT * FROM absences WHERE ID='".$_GET['id']."'");
echo "
<div class='justif'>Justification du ".$dn2['date']." à ".$dn2['heure']."</div>
<section class='contenu'>
<form action = 'processing.php' method ='POST'>
<textarea name='justif'>Saisir une justification ici.</textarea>
<input type='hidden' name ='id' value =".$_GET['id'].">
<input type='hidden' name ='table' value ='absences'><br>
<input type='submit' name='submit' value='Justifier'>
</form>
</section>
";
// On propose d’entrer une justification
}
BTS IRIS
Session 2014
102
GUIFFARD BENJAMIN
Voici l’algorithme de la page « absences.php » :
BTS IRIS
Session 2014
103
GUIFFARD BENJAMIN
On obtient alors le résultat suivant :
Lorsque l’élève a fini d’écrire/modifier sa justification, il lui suffit de cliquer sur le bouton « Justifier » en bas.
Lorsque ce bouton est actionné, une requête est envoyée à la base de données. La requête a pour but de
modifier les données présentes dans la colonne justification de la table absence de la BDD.
PROCESSING.PHP
case "Justifier":
$query = "UPDATE `jacquard`.àbsences` SET justification='".$link>real_escape_string($_POST['justif'])."' WHERE ID='".$_POST['id']."'";
break;
Ainsi la justification est directement mise à jour et est désormais visible dans la partie absence de l’élève. Il
ne restera plus qu’à attendre que le CPE visualise la justification et l’accepte ou non.
BTS IRIS
Session 2014
104
GUIFFARD BENJAMIN
4 – L’agenda
Le site ne propose pas qu’un système de gestion de notes et d’absences, il propose également un système
de cahier de textes. Parmi ces services on trouve un agenda de l’élève avec les devoirs à faire ainsi que les
grandes lignes du cours de chaque jour. Il y a également l’emploi du temps de la classe de l’élève. Enfin
l’élève peut envoyer les informations de son stage à la base de donnée afin d’avoir une convention de stage
pré-rempli e en pdf.
 L’agenda
L’agenda se décompose en 3 partie, soit on affiche seulement les devoirs, soit les cours, soit on affiche les
deux. Chacune de ces parties correspond à une valeur de la variable « type » de la table agenda, dans la base
de données.
Par défaut on affichera les cours ainsi que les devoirs. Et la date afficher sera celle du lendemain. Le jour, le
mois et l’année est définis au préalable dans le header du site (non afficher). Il reste juste à donner le
nombre de jours qu’il y a par mois.
AGENDA.PHP
if(!isset($_GET['type']))
$type="all";
else
$type=$_GET['type'];
if(!isset($_GET['mois']))
$mois = $month;
else
$mois = $_GET['mois'];
if($mois >= "09")
$annee = $annee1;
else
$annee = $annee2;
if($mois == "02")
$jour_max = 28;
else if ($mois == "04" OR $mois == "09" OR $mois == "11")
$jour_max = 30;
else
$jour_max = 31;
if(!isset($_GET['jour']))
{
if($day!=$jour_max)
$jour = $day+1;
else
$jour = 1;
}
else
$jour = $_GET['jour'];
Donc trois possibilités sont disponibles, soit trois requête SQL. On choisit alors ce que l’on veut afficher : soit
juste les cours, soit juste les devoirs, soit les deux.
BTS IRIS
Session 2014
105
GUIFFARD BENJAMIN
AGENDA.PHP P2
echo "
<div class=\"periode\">
<a href = \"?type=1&mois=".$mois."&jour=".$jour."\" class=\"button3\">Tout
Afficher</a>
<a href = \"?type=devoirs&mois=".$mois."&jour=".$jour."\"
class=\"button3\">Devoirs</a>
<a href = \"?type=cours&mois=".$mois."&jour=".$jour."\"
class=\"button3\">Cours</a>
</div> ‘’;
if($type=="all")
$reponse=$link->query("SELECT * FROM àgenda` WHERE ( echeance = '$annee-$mois$jour' AND classe='".$row0['classe']."' )");
else
$reponse=$link->query("SELECT * FROM àgenda` WHERE ( echeance = '$annee-$mois$jour' AND classe='".$row0['classe']."' AND type='".$type."') ");
Il ne reste plus qu’à récupérer la requête dans un tableau et l’afficher.
BTS IRIS
Session 2014
106
GUIFFARD BENJAMIN
Le type étant : Cours,
Devoirs, ou les deux.
BTS IRIS
Session 2014
107
GUIFFARD BENJAMIN
5 – Les services
L’emploi du temps, et tout ce qui concerne le stage sont dans l’onglet « Services », le même système que
pour les périodes des semestres vus précédemment est utilisés. C’est-à-dire qu’au lieu de changer de page à
chaque fois qu’on clique sur une sous-partie de « Services » on ne change pas de page, c’est le contenu de la
page qui change.
SERVICES.PHP
echo '<div class ="periode"><a href = "?service=edt" class="button3">Emploi du
temps</a><a href ="?service=vote" class="button3">Vote</a><a class="button3"
href="pdf/convention.php">Convention de Stage</a><a href = "?service=stage"
class="button3">Stage</a></div>
<section class=\'contenu\'>';
if(!isset($_GET['service']))
{
echo 'Selectionnez un service';
}
else if ($_GET['service'] == "edt")
{
echo 'Emploi du temps';
}
else if ($_GET['service'] == "stage")
{
echo 'Information du stage';
}
else
{
// Message d’erreur
}
 L’emploi du temps
L’emploi du temps est un tableau. On affiche tout d’abord les jours dans la première balise tr. Ensuite à
l’aide d’une boucle on affiche les heures de la journée dans la colonne de gauche. Enfin comme pour la
partie « notes », on créer une boucle dans notre boucle dans laquelle on fera une requête SQL afin de
récupérer la matière et le nom du professeur dans la table « emploi du temps » de la BDD, en sachant le jour
et l’heure de la case du tableau et où la classe de l’élève correspond à la classe de la BDD dans la table
« emploi du temps ».
$query = 'SELECT emploi_du_temps.matiere,emploi_du_temps.prof
FROM emploi_du_temps,eleves
WHERE emploi_du_temps.jour='.$j.'
AND emploi_du_temps.heure ='.$h.'
AND emploi_du_temps.classe=eleves.classe
AND eleves.username=\''.$session_user.'\';
Il ne reste plus qu’à afficher les résultats envoyé par la BDD dans notre tableau.
SERVICES.PHP?SERVICE=EDT
echo "
<table>
<tr class=\"coul1\">
<th>Heure</th>
<th>Lundi</th>
BTS IRIS
Session 2014
108
GUIFFARD BENJAMIN
SERVICES.PHP P2
<th>Mardi</th>
<th>Mercredi</th>
<th>Jeudi</th>
<th>Vendredi</th>
</tr>";
for($i=0;$i<10;$i++)
{
$h = $i + 8;
$h2 = $h + 1;
echo"<tr class=\"grey\"> <th>".$h."h <br> ".$h2."h</th>";
for($j=1;$j<=5;$j++)
{
$reponse=$link->query('SELECT emploi_du_temps.matiere,emploi_du_temps.prof
FROM emploi_du_temps,eleves WHERE emploi_du_temps.jour='.$j.' AND
emploi_du_temps.heure ='.$h.' AND emploi_du_temps.classe=eleves.classe AND
eleves.username=\''.$session_user.'\';');
if($reponse)
{
$row = mysqli_fetch_array($reponse);
echo "<td class=\"discipline\">".$row['matiere']."<br><span
id=\"prof\">".$row['prof']."</span></td>";
}
else
echo "<td></td>";
}
echo "</tr>";
}
echo "</table>";
On obtient alors un résultat comme ceci (avec du CSS) :
BTS IRIS
Session 2014
109
GUIFFARD BENJAMIN
 Information du stage
Lorsqu’on clique sur l’onglet « Stage » on arrive sur une page dans laquelle les informations du stage de
l’élève lui sont demandées. Nom de l’entreprise, adresse, code postal, ville, etc… Il y a deux possibilité sur
cette page, soit aucun champ n’est remplis, auxquelles cas il est demandé à l’élève de les remplir, soit les
champs sont déjà remplis et l’élève peut alors les modifier si besoin.
Afin de savoir si l’élève a déjà rempli les informations du stage, le même système que pour la justification
des absences est utilisée. On fait une requête SQL afin de sélectionné tout ce qu’il y a dans la BDD en rapport
au stage de l’élève. Si la BDD renvois quelque chose, on les affichera, sinon les champs resteront vides.
SERVICES.PHP
else if ($_GET['service'] == "stage")
{
$reponse=$link->query("SELECT * FROM stage
$donnees=mysqli_fetch_array($reponse);
if($donnees)
{}
else
{}
}
WHERE eleve='".$session_user."'");
Par la suite, le formulaire est en forme de tableau et les champs à remplir son des balise de type <input>,
lorsqu’il y a déjà des donnée en rapport au stage de l’élève, la valeur de cette input correspond aux données
de la BDD.
if($donnees)
{
echo "<div class='titre'>Modifiez les détails de votre entreprise dans
laquelle vous allez effectuer votre stage.</div>
<form action = \"processing.php\" method=\"POST\">
<table>
<tr> <td>Nom de l'entreprise :</td> <td> <input type ='text' name
='entreprise' value='".$donnees['entreprise']."'/></td>
</tr>
<tr> <td>Adresse :</td> <td> <input type ='text' name ='addr'
value='".$donnees['adresse']."'/></td> </tr>
<tr><td>Code postal :</td> <td> <input type ='text' name ='cp'
value='".$donnees['code_postal']."'/></td></tr>
<tr><td>Ville :</td><td><input type ='text' name ='ville'
value='".$donnees['ville']."'/></td></tr>
<tr><td>Pays :</td><td><input type ='text' name ='pays'
value='".$donnees['pays']."'/></td></tr>
<tr><td>Numéro de téléphone :</td><td><input type ='text' name ='num'
value='".$donnees['telephone']."'/></td></tr>
<tr><td>Site Web :</td><td><input type=\"text\"
name=\"site\"value='".$donnees['site']."'> </td></tr>
<tr>
<td> <input type ='hidden' name='table' value='stage'> <input type
='hidden' name='eleve' value='".$session_user."'/></td>
<td><input type ='submit' name='submit' value='Modifier'></td>
</tr>
</table>
</form>";
}
else
{
echo "<div class='titre'>Entrez les détails de votre entreprise dans laquelle
vous allez effectuer votre stage.</div>
BTS IRIS
Session 2014
110
GUIFFARD BENJAMIN
<form action = \"processing.php\" method=\"POST\">
<table>
<tr><td>Nom de l'entreprise :</td> <td> <input type ='text' name
='entreprise'/></td></tr>
<tr><td>Adresse :</td> <td> <input type ='text' name ='addr'/></td></tr>
<tr><td>Code postal :</td> <td> <input type ='text' name ='cp'/></td></tr>
<tr><td>Ville :</td><td><input type ='text' name ='ville'/></td></tr>
<tr><td>Pays :</td><td><input type ='text' name ='pays'/></td></tr>
<tr><td>Numéro de téléphone :</td><td><input type ='text' name
='num'/></td></tr>
<tr><td>Site Web :</td><td><input type=\"text\" name=\"site\"> </td></tr>
<tr>
<td><input type ='hidden' name='table' value='stage'>
<input type ='hidden' name='eleve' value='".$session_user."'/></td>
<td><input type ='submit' name='submit' value='Envoyer'></td>
</tr>
</table>
</form>";
}
Quand nous avons fini de compléter le formulaire, soit on clique sur Modifier (pour ceux qui avaient déjà
rempli le formulaire, soit sur Envoyer pour ceux qui n’avait jamais rempli. Pour chacun des deux cas une
requête se fait à la clique de la souris. Soit on fait un UPDATE de la table stage correspondant à l’élève, soit on
fait un INSERT.
PROCESSING.PHP
case "stage" :
switch($submit)
{
case "Envoyer":
$query ="INSERT INTO `jacquard`.`stage`
(eleve,entreprise,adresse,code_postal,ville,pays,telephone)
VALUES
(
'".$_POST['eleve']."',
'".$_POST['entreprise']."',
'".$_POST['addr']."',
'".$_POST['cp']."',
'".$_POST['ville']."',
'".$_POST['pays']."',
'".$_POST['num']."'
);
";
break;
case "Modifier":
$query ="UPDATE `jacquard`.`stage`
SET entreprise='".$_POST['entreprise']."',
adresse='".$_POST['addr']."',
code_postal='".$_POST['cp']."',
ville='".$_POST['ville']."',
pays='".$_POST['pays']."',
telephone='".$_POST['num']."'
WHERE eleve='".$_POST['eleve']."'";
break;
Une fois la requête effectué, on pourra voir les informations directement dans le formulaire et seront
sauvegarder.
BTS IRIS
Session 2014
111
GUIFFARD BENJAMIN
 La convention de stage
On peut donc obtenir la convention de stage au format pdf via le site, si on a au préalable remplis le
formulaire de stage alors la convention sera déjà pré-remplie.
La création d’un pdf demande l’utilisation d’un mélange de PHP et de Java. Son élaboration est longue et
répétitive.
Tout d’abord on fait deux requêtes SQL afin de récupérer toute les informations de l’élève ainsi que les
informations de son stage.
SELECT * FROM stage WHERE eleve='".$session_user."'
SELECT * FROM eleves WHERE username='".$session_user."'
Ensuite il faut faire appel à un fichier nommé « fpdf.php » c’est notre bibliothèque qui nous servira à créer le
pdf.
require('fpdf.php');
On créer par la suite notre page PDF à l’aide de deux lignes de code :
$pdf = new FPDF();
$pdf->AddPage();
Maintenant que l’on a notre pdf, il reste plus qu’à incorporer toute les informations qu’une convention de
stage possède. Pour cela on utilise différente fonction.
Il faut savoir qu’à chaque fois que l’on veut incorporer quelque chose à un pdf, ce qu’on envoi est mis sous
forme de cellule à laquelle on doit donner une taille. De plus pour que le pdf prenne en compte
l’information, il faut mettre au début de chaque cellule la variable qu’on a utilisé pour créer le pdf suivi
d’une flèche.
BTS IRIS
Session 2014
112
GUIFFARD BENJAMIN
 Les fonctions que l’on utilise pour ce pdf sont les suivantes :
$pdf->Image('../images/jacquard.gif');

Incorpore une image.
$pdf->SetFont('Arial','',10);

Police et taille de la police pour toutes les cellules qui suivent. On peut également ajouter un
soulignement ou un texte en gras (etc) dans le champ vide ‘’ .
$pdf->Cell(5,4,utf8_decode('Lycée Jacquard'));

Cellule avec sa largeur, hauteur, et texte en UTF8. Le cas général de la cellule est la suivante.
Cell(float w , float h , string txt , mixed border , int ln , string align
, boolean fill , mixed link)

Largeur, hauteur, texte, bordure, indique où se déplace la position courante après l'appel à la
méthode, position du texte dans la cellule, indique si le fond de la cellule doit être coloré, URL
$pdf->Ln();

Saut de ligne.
$pdf->MultiCell(0,4,utf8_decode("Texte"));

Même fonction que Cell mais permet également de faire un retour à la ligne lorsque le texte atteint
la fin de la cellule (w = 0 correspond à toute la largeur de la page).
BTS IRIS
Session 2014
113
GUIFFARD BENJAMIN
 On récupère les donnée de la BDD de la façon suivante :
$pdf->Cell(50,4,'Nom: '.$donnees['nom'].'');

étant la variable dans laquelle nous avons stocké toute les informations reçu par la
requête, et nom étant le champ que l’on souhaite afficher.
$donnees
SERVICES.PHP / PDF
$reponse=$link->query("SELECT * FROM eleves WHERE username='".$session_user."'");
$donnees = mysqli_fetch_array($reponse);
$rp2=$link->query("SELECT * FROM stage WHERE eleve='".$session_user."'");
require('fpdf.php');
$pdf = new FPDF();
$pdf->AddPage();
$pdf->Image('../images/jacquard.gif');
$pdf->SetFont('Arial','',10);
$pdf->Cell(5,4,utf8_decode('Lycée Jacquard'));
$pdf->Cell(180,4,$annee1.'-'.$annee2,0,0,'R');
$pdf->Ln();
$pdf->Cell(5,3,'75019 Paris');
$pdf->Ln();
$pdf->SetFont('Arial','BU',16);
$pdf->Cell(180,20,'Convention de Stage',0,0,'C');
$pdf->Ln();
$pdf->SetFont('Arial','I',10);
$pdf->Cell(180,10,utf8_decode('La présente convention règle les rapports entre les
soussignés.'));
$pdf->Ln();
BTS IRIS
Session 2014
114
GUIFFARD BENJAMIN
II – Le design du site
A – Les couleurs
Sur le site les couleurs prédominantes sont le noir (couleur passe-partout) ainsi que des nuances de bleu.
Avec du orange lors d’interaction avec le site par exemple lors du passage de la souris sur un bouton.
Par conséquent un système a été établi, lorsqu’on descend sur chaque page du site, on observe que l’on
passe du noir pour le header, à un bleu foncé pour les titres important, puis du bleu plus clair pour les titres
de moindre importance. De plus pour les barres de navigation autre que celle du Header, le même système a
été mis en place, si ce n’est que pour les barres un dégradé a été fait. Une barre passant du noir au bleu
foncé, et la barre d’en dessous passant du bleu foncé au bleu clair.

La couleur en hexadécimale pour les titres est : #003399. Exemple :

Pour les sous-titres on utilisera plutôt : #0066CC. Exemple :

Pour le orange on utilise : #FF9900. Exemple :

Les différentes barres du site :
o -webkit-linear-gradient(top, #000000, #0c275e);
o
-webkit-linear-gradient(top, #0c275e, #0355a6);
BTS IRIS
Session 2014
115
GUIFFARD BENJAMIN
B – Ce qui est commun à tout le site
Certaines choses ne changent pas dans les différentes pages du site. Par-dessus tout, certaine ligne de code
ne changeront jamais et seront toujours présente :
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 La meta balise qui permet au bon encodage des pages du site.
<link href="styles/style.css" rel="stylesheet" type="text/css" />
 Cette balise permet d’utiliser le fichier style.css qui s’occupe de tout le design du site.
<?php include("includes/header.php"); ?>
 Ici on appelle le header, cela nous permet de ne pas réécrire dans chaque page le header.
<?php include("includes/footer.php"); ?>
 Même système que pour le header.
<body> </body>
 Il s’agit du corps de page d’où le nom « body ».
<section></section>
 Deux sections à l’intérieur du body pour rendre le contenu plus ergonomique.
Ainsi, le header tout comme le footer ne changent jamais et sont toujours affiché.
 Le header
Le Header est l’en-tête du site, il contient le menu qui permet à l’utilisateur de naviguer dans le site ainsi que
de se déconnecter.
HEADER HTML
<header>
<nav>
<a
<a
<a
<a
<a
<a
<a
</nav>
</header>
href="index.php" class = "button" >Accueil</a>
href="news" class="button">Actualités</a>
href="notes.php"class = "button">Notes</a>
href="absences.php"class = "button">Absences</a>
href="agenda.php" class="button">Agenda</a>
href="services.php"class = "button">Services</a>
href="logout.php" class="button1">Déconnexion</a>
BTS IRIS
Session 2014
116
GUIFFARD BENJAMIN
On observe ici que le menu est composé de lien cliquable <a> qui nous redirige vers différentes parties du
site, avec une classe « button » pour chaque lien. Ce code permet d’afficher un menu avec du texte. Mais
pour rendre ce menu ergonomique il faut faire un peu de CSS.
On change le design du header avec le CSS en mettant dans le fichier style.css la balise header{}.
CSS
header
{
z-index:1000; /* Permet au header d'être toujours superposé aud essus des autres
éléments du site*/
position: fixed; /* Permet au header d'être toujours présent, et descendre avec le
scroll de la souris*/
top: 0px; /* On positionne le header en haut de la fenetre*/
height: 40px; /* La hauteur du header*/
margin:0px; /* On supprime les marges externe*/
padding:0px; /* De même pour les marges interne*/
vertical-align:top;
font-family: "Calibri"; /*Police du texte du header*/
text-align:center; /* Alignement de la police*/
color: white; /*Couleur de la police*/
font-size: large; /* Taille de la police*/
width: 100%; /* Largeur du header*/
min-width:750px; /*Largeur minimal du header*/
background-color:black; /*Couleur du fond du header*/
}
Ensuite on s’occupe des boutons qui ne sont pas encore des boutons mais seulement des liens cliquables.
Etant donné que les boutons sont des liens, on leur donne une classe qui est la classe « button », ensuite
dans le fichier CSS il suffit de mettre la balise .button{} et ajouter le design dans les accolades. Le point
devant le nom de la classe désigne le fait que ça soit une classe, de ce fait chaque balise contenant la classe
« button » sera changer.
CSS
.button
{
font-size: 1em;/*Taille de la police en em*/
background-color:black;
padding:10px 15px;/* Ajout de marge interne de 10px en haut et en bas, ainsi que de
15px à gauche et à droite*/
margin: 0px;/*Pas de marge externe*/
display:inline-block;/*On fait en sorte que chaque bouton soit un bloque et que ces
bloques s'alignent à la suite*/
color: white;
height:20px;
width:8%;
min-width: 30px;
text-align : center;
border-right: 1px solid #0099FF;/* Une bordure de px à droite de chaque bouton afin
de les délimiter*/
}
On peut également à l’aide du CSS changer la couleur du bouton au passage de la souris sur celui-ci. Il suffit
d’utiliser la fonction hover.
BTS IRIS
Session 2014
117
GUIFFARD BENJAMIN
CSS
.button:hover
{
background-color:#FF9900;
text-decoration: none;
}
Grâce au CSS, on obtient un très bon rendu du header de couleur noir avec des bordures de couleur bleu.
 Le footer
Le footer est le pied de page du site, sur les sites professionnels on retrouve très souvent dans ce footer des
liens pour les mentions légales, charte de confidentialité, conditions générales d’utilisation, contact, etc…
Notre site n’étant que pour un projet scolaire, nous n’avons rien mis de tel.
HTML
<footer>
Projet Gestion des Absences - Lycée Jacquard - 2013/2014 - Vincent SURGIS Benjamin GUIFFARD - Amine OUTALEB - Damien TAUNAY
</footer>
Et avec une touche de CSS :
CSS
footer
{
text-align:CENTER;
width:100%;
z-index:200000;
color:white;
padding-top:0.5%;
padding-bottom:0.5%;
height:15px;
position: fixed;
bottom:0px;
background-color: black;
}
On obtient :
 Le body
Pour ce qui est du body, un fond d’écran rayé a été choisi et créer à l’aide d’une seule image qui se répète
jusqu’à prendre la totalité de la fenêtre.
BTS IRIS
Session 2014
118
GUIFFARD BENJAMIN
Ce body prend toute la largeur de la fenêtre, mais ne prend que 100%-170px de la hauteur, les 170px étant
la hauteur du header et du footer combiné.
CSS
body
{
background-image: url("../images/wallpaper.png");
background-repeat:repeat;
font-family: Calibri, Verdana, Trebuchet MS;
margin: 0;
padding: 0;
width: 100%;
min-width:750px;
font-size:14.5px;
height:calc(100% - 170px);
overflow: auto;
color:black;
}
 Les sections
Pour finir, deux sections ont été créée.
La première section qui se situe dans le body à une largeur de 80% de la fenêtre et à un fond blanc afin de le
différencier du reste du body qui est lui rayé. Cette section a été centré à l’aide d’un margin left et right de
même pourcentage (on aurait également pu mettre un margin auto pour les deux coté).
CSS
section.global
{
width:80%;
min-width:750px;
margin-right:7%;
margin-left:7%;
margin-top:5%;
margin-bottom:3%;
background-color:white;
}
A l’intérieur de cette section on trouvera la barre de navigation pour les sous parties de chaque onglet.
La seconde section se situe dans la première section et n’a pour seule but que d’afficher le contenu du site
de façon à ce qu’il ne colle pas les bords de la première section. On était obligé de créer une autre section,
car nous voulions que la barre de navigation pour les sous parties quant à elle, colle aux bordures de la
section (de ce fait, le padding n’aurait pas donné le résultat escompté).
BTS IRIS
Session 2014
119
GUIFFARD BENJAMIN
CSS
section.contenu
{
padding:3% ;
}
C – Quelques plus
Revenons aux barres de navigation des sous-parties. Chacune de ces barres possèdent la même classe, la
classe .periode . Il est connu que chaque navigateur se comporte différemment des autres, et que de ce fait
certaine manipulation fonctionneront sur l’un et pas forcément sur les autres. C’est pourquoi le dégradé fait
sur ces barres à était conçu de tel sorte que tous les navigateurs le prenne en compte (oui, oui même
internet explorer).
CSS
.periode
{
border:2px solid white;
background: #0c275e;
background: -webkit-gradient(linear, left top, left bottom, from(#000000),
to(#0c275e));
background: -webkit-linear-gradient(top, #000000, #0c275e);
background: -moz-linear-gradient(top, #000000, #0c275e);
background: -ms-linear-gradient(top, #000000, #0c275e);
background: -o-linear-gradient(top, #000000, #0c275e);
}
Grâce à ces différents background, tous les navigateurs prendront en compte le fond demandé, on remarque
le « moz » de Mozilla Firefox, ou encore le « o » de Opéra (Comprend également Safari), « ms » pour
Microsoft (soit Internet Explorer) et enfin « webkit » pour Chrome.
Une barre de recherche a été créée pour le CPE afin d’accéder plus rapidement aux élèves souhaité. On
observe une loupe à côté du champ de recherche de l’élève, lorsqu’on passe la souris dessus, la loupe
change de couleur. C’est à nouveau à l’aide de la fonction « hover » que cela est possible. On avait vu plus
tôt que la fonction hover pouvait changer la couleur d’un texte au passage de la souris, désormais on sait
que l’on peut également changer une image pour une autre.
CSS
#search .btn-right-fleche {
display:block;
background:url(../images/icone_loupe.png) no-repeat center;
width:24px;
height:24px;
margin: 0 0;
}
#search .btn-right-fleche:hover {
background:url(../images/icone_loupe2.png) no-repeat center;
}
BTS IRIS
Session 2014
120
GUIFFARD BENJAMIN
On avait vu au début que les actualités était placé une fois à droite, une fois à gauche de l’écran grâce à un
compteur et une parité des actualités. Lorsque le chiffre est pair, l’article est à droite, il utilise alors la classe
.right de l’article ; en revanche lorsque l’article est à gauche, celui-ci utilise la classe .left de l’article.
CSS
article.left
{
margin-left:0px;
margin-right:25%;
background: white;
border-left: 3px #003366 solid;
}
article.right
{
margin-right:0px;
margin-left: auto;
background: white;
border-right: 3px #003366 solid;
}
BTS IRIS
Session 2014
121

BTS IRIS Lycée Jacquard – Paris PROJET TECHNIQUE Gestion

Transcription

Documents pareils

lycee saint-aspais

ACADEMIE DE GRENOBLE - Lycée Louise Michel

SUIVI DES ELEVES AU LYCEE GAMBETTA

Motifs d`exclusions

affiches portes ouvertes postbac lycée Flaubert 2016

Brochure - Forum des métiers

023 - Lycée Silvia Monfort

BTS • BANQUE – Conseiller de clientèle

BTS MUC - CFA de Bourges

BTS BANQUE OPTION A : MARCHÉ DES PARTICULIERS