Issuu on Google+

Technologies Multimédia et Internet

Projet : Site innovant

Définition du projet / cahier des charges Etudiants concernés : • •

Maxime LUTZ, Master 1 PSM : maxime.lutz@wanadoo.fr Yoann PIERRE, Master 1 PSM : yoannpierre@wanadoo.fr

Titre provisoire du projet : Plateforme d'échanges et de gestion de projets

Présentation : La plateforme d’échanges et de gestion de projets (PEGP) est une interface en ligne permettant à des groupes de travail (entreprises, associations ou groupes de particuliers) de s’organiser (gestion de projet), de communiquer et de partager des ressources. Des responsables (ou chef de projets) vont pouvoir créer des projets et associer différentes ressources à ceux-ci (personnels, fichiers informatiques, …). Toute personne affiliée à un projet possède un espace réservé ou il pourra consulter différentes informations et partager des documents.

Support : • •

En ligne, site internet Hos ligne, intranet

Objectifs : • •

Améliorer le télétravail Echange de fichiers

Cibles : • • • •

(petites) Entreprises Auto entrepreneurs, freelance Experts Etudiants

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

1


Technologies Multimédia et Internet

Les types d’utilisateurs par défaut

Suppr

Administrateur Il paramètre la plate-forme.

Gérer

Contact Coordonnées d’une personne.

Client Membre à droits particuliers.

Membre (abstrait) Contact concerné par un projet.

Responsable Gérant de plusieurs projets.

Collaborateur Membre actif d’un projet.

Droits des catégories d'utilisateurs Administrateur (unique) o Modifier son profil o Gérer les responsables de projets  Ajouter  Modifier  Supprimer o Gérer les contacts  Supprimer  Recevoir une demande de suppression o Gérer les catégories d'utilisateurs  Ajouter  Modifier  Supprimer o Gérer tous les projets en cours  Afficher  Réaffecter des projets  Exporter le récapitulatif d’un projet o Afficher les archives de tous les projets  Exporter le récapitulatif d’un projet  Exporter les statistiques o Paramétrer la plate-forme Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

2


Technologies Multimédia et Internet Responsables de projet o Modifier son profil o Gérer des projets (détaillé plus tard)  Créer  Afficher  Modifier  Exporter le récapitulatif d’un projet  Archiver o Consulter ses projets archivés o Envoyer un mail à un contact o Gérer des contacts  Ajouter  Modifier o Gérer des contacts propres au projet  Ajouter  Modifier  Supprimer o Assigner une catégorie à un membre  Ajouter  Modifier  Supprimer

Fonctionnalités partie projet Fonctionnalités partie projet o Listing de l'ensemble des projets de l'utilisateur  Ajouter  Détails du projet  Exporter le récapitulatif  Archiver o Rubrique information o Rubrique salon de discussions (topic)  Listing des membres en ligne o Rubrique conception  Devis / Factures  Cahier des charges  Diagramme de Gant  Calendrier o Rubrique membres  Ajouter  Filtres de tris o Rubrique ressources  Créer un dossier  Renommer un dossier  Supprimer un dossier  Up/Down-loader des fichiers  Archiver des dossiers (zip puis dl) Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

3


Technologies Multimédia et Internet

Version 0.1 du projet Concept La plateforme permet à des utilisateurs connectés de travailler sur un projet commun à travers différents modules spécifiques. Elle est composée de deux parties : • • •

La gestion des utilisateurs : Cet élément permet de gérer les informations et accès de chaque utilisateur de la plateforme. On retrouve ainsi les : Contacts, Membres, Groupes, etc… La création d'un projet : Donne l'accès à la gestion de modules pour ce dernier. la gestion des modules : Un module représente une fonctionnalité supplémentaire ajoutée aux projets. Ces modules apporterons de nouvelles possibilités tels que : la création de diagrammes, la gestion du temps de travail, le partage de fichiers, ... pour chaque projet. Chaque nouveau module s'intègre dans la chaine de création des projets comme une extension de celui-ci.

La version V0.1 de la plateforme est composée de toute la structure utilisateur et projets ainsi que la gestion de modules mais sans aucun module en soit. L'ajout de fonctionnalités (modules) dans un projet se fera dans les futures versions.

Fonctionnalités de l'utilisateur de la version 0.1 o o o o o o

Pas d’administration Pas de gestion de projet Pas d’échange de fichiers Gestion des utilisateurs : Créer, modifier et supprimer des utilisateurs organisés suivants des catégories prédéfinies à droits spécifiques Gestion de groupes de travail (projets) : Créer et supprimer un groupe de travail avec la possibilité d’y affecter des utilisateurs Gestion des modules : Ajouter et supprimer des modules de la plate-forme

Interface fonctionnelle Sur le principe de module, l’interface éventuelle se présenterait sur la forme de catégories et souscatégories (modules) qui afficheraient dans la zone principale le contenu de celui-ci ! PEGP : Plate-forme d’Echange et de Gestion de Projet Module 1 Module 2 [Zone d’affichage principal] Module 3 Module 4

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

4


Technologies Multimédia et Internet

Catégories prédéfinies Dans la version 0.1, les catégories sont figées et ne peuvent être modifiées sauf par ajout dans la BDD. Une catégorie correspond à un type d’utilisateur qui a des droits spécifiques sur le projet… Les catégories ci-dessous sont celles prédéfinies dans la v0.1 : • • •

Responsable Client Collaborateur

Modèle Conceptuel de Données • • • • • • • • • • • • • • • • • •

Contact Prénom Nom Société Fonction Adresse mail Adresse messagerie instantanée Page web Profil Facebook Profil Tweeter Avenue, Rue, Impasse Complément d’Adresse Code postal Ville Téléphone bureau Téléphone domicile Téléphone portable Fax Commentaire Membre

• • • •

Contact Projet

Catégorie d'utilisateur •

Intitulé

• • • • • • •

Projet Nom projet Responsable de projet Date de début Date de fin Client Ressources personnel Description

• • • • •

Droit Module catégorie d'utilisateur Action Executable Nom

Module • Nom • Description • Version

Catégorie d'utilisateurs Commentaire

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

5


Technologies Multimédia et Internet Est

1,1

Responsable IdResponsable

0,n

Gère

1,1

Affiliée

Tâche IdTache Nom Responsable DateDebut DateFin Description Terminé

0,n

0,n

0,1 Contact IdContact Prenom Nom Societe Fonction Mail Messenger PageWeb Facebook Tweeter Rue ComplementAdr CodePostal Ville TelBureau TelDomicile TelPortable Fax Commentaire

0,n

Etre Membre

1,n

IdContact IdProjet IdCatUtilisateur IdTache Commentaire

Projet IdProjet Nom Responsable DateDebut DateFin Description Terminé

1,1

1,1 A le droit

CatUtilisateur IdCatUtilisateur Nom

1,n

IdModule IdCatUtilisateur IdAction Executer (Bool) Nom

0,n Module idModule Nom Description Version

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

6


Technologies Multimédia et Internet

Modèle Relationnel de Données

Contact

Accès

CatUtilisateur

Projet

IdContact Prenom Nom Societe Fonction Mail Messenger PageWeb Facebook Tweeter Rue ComplementAdr CodePostal Ville TelBureau TelDomicile TelPortable Fax Commentaire

IdModule IdCatUtilisateur IdAction Executer (Bool) Nom

IdCatUtilisateur nom

Membre

Module

IdProjet Nom Responsable DateDebut DateFin Description Terminé

IdContact IdProjet IdCatUtilisateur Commentaire

idModule Nom Description Version

Responsable

Tache IdTache Nom Responsable DateDebut DateFin Description Terminé

IdResponsable IdContact

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

7


Technologies Multimédia et Internet

Structure du projet Le projet étant conséquent nous avons décidé d’utiliser le modèle MVC dans la conception de celuici. Nous espérons ainsi mettre en place une plateforme facile à mettre à jour et modulaire. La plateforme s’articule autour d’un kernel, cœur du programme, sur lequel viendront s’ajouter différents modules. Bien que plus difficile à mettre en place, cette stratégie permet de découper le projet et de ne travailler que sur des blocs indépendants qui n’interfèrent pas avec les autres blocs. A l’heure actuelle le cœur du programme n’est pas encore achevé, mais quelques blocs sont déjà fonctionnels ce qui permet d’avoir un premier aperçu du programme sans l’avoir fini. Cette découpe en bloc permet également de mieux se partager le travail, ainsi chaque membre travail de manière indépendant, mais également de mieux suivre l’évolution du projet en mettant à jour une check-list des modules réalisés.

Structure de la plateforme

La plateforme est structurée en 5 parties : •

• •

Le modèle, ou plus exactement le gestionnaire de contenu dans le package « database ». Ces classes vont permettre d’accéder à la base de données et de récupérer toutes les informations souhaitées. La vue, ou visuel dans les dossiers « pages » et « template ». Ces fichiers constituent la structure et l’aspect des pages. Le contrôleur dans le dossier « kernel ». A l’aide des outils du package « utils », il va gérer l’accès, et la modification du contenu. C’est à lui de relier les différentes informations du modèle suivant les interactions de l’utilisateur. On retrouve plusieurs fonctionnalités comme la connexion sécurisé, la jointure entre les projets et les contacts, la création d’espaces de travail, l’ajout de nouvelle fonctionnalités, … Le package « utils » contient différents outils réutilisables tel qu’un explorateur de fichier, un validateur de dates, des effets visuels, etc. Le dossier « system » quand à lui contient des informations propres à la plateforme et à son

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

8


Technologies Multimédia et Internet

• •

emplacement tel que des fichiers de configurations, l’initialisation de variables, des constantes du système, ou encore une classe de diffusion (Dispatch.php permet de transmettre des messages entre les différentes classes du programme). Le dossier « modules » permet d’ajouter des nouvelles fonctionnalités à la plateforme, sous forme de package. Le dossier « data » est le seul ouvert à l’écriture, il permet aux membres des la plateforme de stocker des fichiers et de les partager. Chaque fichier est rangé par projet et seuls les membres du projet peuvent y accéder.

Modèle Dans le dossier « database » du modèle, on retrouve une succession de classes permettant d’accéder à la base de données. Pour chaque table il existe une classe faisant la liaison entre le programme et les données, les classes restantes servent à faire des jointures entre les données. Cette technique permet de changer facilement le support de conservations des informations sans pour autant gêner le travail du contrôleur. Le programme accède aux données en appelant les différentes méthodes des classes de « database ».

Structure de la table Contact

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

9


Technologies Multimédia et Internet

Modèle des contacts : la classe Contact.php Les méthodes des classes de « database » permettent de créer, modifier ou supprimer des informations dans les tables de la base de données en vérifiant que les informations soient au bon format.

Vue La structure visuelle de la plateforme est définie suivant les fichiers du package « page » qui vont créer des mises en page pour les différentes étapes.

Changement du template du site dans les préférences d’utilisateur Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

10


Technologies Multimédia et Internet L’aspect graphique quand à lui est définie suivant un template par défaut. Le template gère la couleur, la forme ou le positionnement des blocs. Il est possible de changer le template dans la rubrique préférence du site, il est alors conservé dans les données de l’utilisateur. La liste des templates disponibles est générée dynamiquement suivant l’arborescence du dossier template. Dès qu’un template est ajouté dans le dossier « template », il est automatiquement ajouté à la liste des templates.

Contrôleur Le contrôleur est le cœur de la plateforme, c’est lui qui va répondre aux demandes des internautes en cherchant parmi les données du modèle. Le package « kernel » est constitué de plusieurs classes répondant à des demandes précises. Ainsi la classe « User » permet de chercher un ou plusieurs membres, contacts ou représentants suivants plusieurs paramètres, de créer des contacts, de les modifier ou de les supprimer. Les classes « GestProject » et « GestModules » réalisent le même travail mais pour respectivement les projets et les modules de la plateforme. La classe « Session » permet de stocker des informations dans la session de l’utilisateur, on retrouve notamment des éléments de navigation ou des éléments de contrôles (des autorisations d’accès). Le fichier « treatment.php » sert d’interface entre les actions utilisateurs (formulaires, navigation, …) et les classes du kernel. Le package « utils » possède des outils accessibles par le kernel et les modules. Validator permet de vérifier le format des dates avant l’envoie de celles-ci dans la base de données. Explorer permet de parcourir l’arborescence des dossiers du serveur et de récupérer des informations précises (exemple : tous les fichiers .pdf, seulement les dossiers de « data », …). Mootools permet d’ajouter des effets visuels à la plateforme (messages de notifications, navigation dynamique, …). Fpdf permet de générer des pdf. Etc.

Modules Les modules ajoutés à la plateforme sont présents dans le dossier modules de celle-ci. Ils doivent respecter une certaines structure, à savoir : être organisés en dossier (« images », pour les images du modules, « pages » pour les différentes structures de page, « script » pour les différentes actions), posséder un fichier « menu.php » valide (permettant de générer le menu du module dans la plateforme), et un fichier « conf.xml » (permettant d’enregistrer le module dans la base de données).

Arborescence d’un module Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

11


Technologies Multimédia et Internet

Syntaxe du fichier menu.php pour la génération du menu du module La syntaxe du fichier « menu.php » se construit sous forme d’un tableau listant les différents sousmenus. Chaque ligne possède le numéro du sous-menu, son nom, sa page de lien et l’identifiant unique du module.

Syntaxe du fichier cong.php pour l’ajout du module dans la base de données Le fichier conf.xml doit respecter la dtd suivante : Avoir un nom, une description, un numéro de version, des accès au différentes actions du module (si l’on souhaite mettre des contrôleurs d’accès sur certains boutons du module), des liens vers les différentes pages du module (avec le nom du lien et son identifiant).

Structure des classes php Afin de limiter l’accès aux classes php nous avons utilisé le principe du Singleton en programmation, à savoir qu’il n’est possible d’ouvrir qu’une seul occurrence de chaque classe, et cela pour éviter de surcharger la mémoire du serveur.

Initialisation d’une classe : méthode du Singleton La méthode du Singleton se traduit par le blocage du constructeur de la classe avec la propriété private. Pour créer une instance de la classe il faut obligatoirement passer par la méthode static Singleton. Avant de créer une instance de la classe, cette méthode vérifie si elle n’a pas déjà été Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

12


Technologies Multimédia et Internet instanciée. Si la classe existe déjà la méthode renvoie l’instance existante, sinon elle créait une nouvelle instance.

Structure de la classe Dispatch (System) La classe Dispatch est au centre de la communication entre les différents scripts de la plateforme. Cette classe permet de transmettre un message d’une classe à une autre et de vérifier à chaque étape du programme l’existence d’erreurs. Elle permet ainsi de mieux remonter à la source d’erreur et de corriger rapidement le problème.

Utilisation de la classe Dispatch pour envoyer un message Chaque méthode de la plateforme utilise la classe Dispatch pour communiquer un message ou une erreur. Si une erreur apparait dans la classe Dispatch, celle-ci remonte immédiatement dans le programme et stop le processus en cours pour affiche le lieu de l’erreur.

Présentation de la plateforme

Interface de connexion sécurisée à la plateforme

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

13


Technologies Multimédia et Internet Pour accéder à la plateforme et à ses projets il faut dans un premier temps se connecter. Seuls les administrateurs du site peuvent créer un contact et ainsi limiter le nombre de personnes ayant accès aux projets. Les mots de passe sont conservés dans la base de données au format md5 pour plus de sécurité. Une fois connecté, un id de connexion est conservé dans la session permettant de naviguer librement dans la plateforme. La checkbox « se souvenir de moi » permet de conserver l’id de connexion dans un cookie et ainsi de passer l’étape de connexion au prochain passage sur le site.

Page « Mes projets » La première page « Mes projets » concerne la liste des projets du membre divisés en 2 parties : les projets en cours au-dessus et les projets archivés. Chaque projet possède un Nom, un Responsable, une Date de début, une Date de fin, une Description, un taux d’avancement, et un indice d’Archivage du projet. Le panneau de gauche permet d’afficher des informations complémentaires ou des modules de bases pour le contact.

Page Tests unitaires Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

14


Technologies Multimédia et Internet La page « Tests unitaires » est présente dans la phase de réalisation mais sera supprimée dans la version finale de la plateforme. Cette page permet d’afficher tous les scripts du serveur et de les tester de manière indépendante. Chaque script est créait de manière autonome, permettant ainsi de le réutiliser à plusieurs endroits de la plateforme. Avant d’intégrer un script dans la plate forme celui-ci est testé au travers de cette page. Cette façon de travailler permet de mieux identifier les scripts défaillant et de les corriger avant leur intégration définitive.

Page Préférence du membre

La page préférence permet à un membre de changer son mot de passe ou son template graphique suivant les templates disponibles dans le dossier template. Ces données sont conservées parmi les données de l’utilisateur dans la base de données.

Action Me déconnecter Le bouton me déconnecter permet de quitter la plateforme en supprimant toutes les variables de session et le cookie. Cette action est recommandée lors de l’utilisation de la plateforme sur un ordinateur public ou dans un cyber-café car elle permet de supprimer toutes ses traces (propres à la PEGP) de l’ordinateur. Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

15


Technologies Multimédia et Internet

Page d’accueil d’un projet

En cliquant sur l’un des projets de la page « Mes projets » on arrive sur la page d’accueil de celui-ci. L’espace projet est composé de deux éléments, à gauche s’affiche les différentes pages du projet avec toutes les informations le concernant, à droite un menu permet d’accéder aux fonctionnalités que l’on possède sur le projet. Le menu de droite représente les modules que l’on a ajoutés à la plateforme. Chaque membre possède un droit d’accès aux modules dispensé par le responsable du projet. Les membres voient uniquement les modules auquel ils ont accès.

Les modules A l’heure actuelle seule deux modules sont disponibles. Le module de Gestion de modules permet d’ajouter un module suivant ceux disponibles dans le dossier modules. Les informations seront ajoutées automatiquement dans la base de données permettant ainsi aux membres de l’utiliser. Le module Manager permet de créer, modifier ou supprimer un projet sur lequel on est identifié en tant que responsable.

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

16


Technologies Multimédia et Internet

Conclusion Dès le début de ce projet nous avons voulu créer une plateforme complète et polyvalente, sachant très bien que nous n’arriverions pas à la finir à temps. C’est pourquoi nous somme parti sur un système de modules permettant d’ajouter facilement des fonctionnalités supplémentaires. A l’heure actuelle le cœur de la plateforme n’est pas encore totalement opérationnel, mais une bonne partie des fonctionnalités principales sont déjà présentent, les autres étant encore en phase de test unitaire.

L’objectif de notre projet n’était pas de pouvoir montrer un travail fini pour la fin de l’année mais de travailler sur un système conséquent avec des techniques de travail adaptées tel que le modèle MVC ou la gestion de modules. Ce projet a demandé beaucoup de temps de conception et d’élaboration du système afin de connaitre précisément les capacités de la plateforme avant même d’avoir écrit la première ligne de code.

Concernant la répartition des tâches, nous avons correctement progressé et en toute équité. Bien que Maxime ayant une touche un peu plus orienté sur la programmation et Yoann ayant une fibre artistique un tantinet plus développé, nous restons tout deux polyvalents et avons finalement trouvé un équilibre et une bonne entente. La première phase du travail, c'est à dire la conception, la logique de fonctionnement ainsi que les classes d'accès à la base de données, a été faite à 50-50. Par la suite, Maxime a passé un peu plus de temps sur le kernel que Yoann, qui, ce dernier, s'est plus occupé de l'intégration des différentes fonctionnalités de base sous le format template et modules.

Nous espérerons trouver assez de temps et de courage pour amener à terme ce projet qui nous a fait découvrir de nouvelles logiques de programmation inexplorées jusque là et qui pourrait nous apporter une plus-value non négligeable autant sur notre carrière future que sur nos connaissances.

Maxime LUTZ & Yoann PIERRE | M1 PSM | Mai 2010

17


Rapport de conception PEGP