Sujet du projet
Ressources importantes :
- la librairie GSON de Google qui sert à convertir des objets Java en JSON et vice versa : http://code.google.com/p/google-gson/
- Le site http://www.generatedata.com pour générer une base de données.
Sujet = un gestionnaire de films en Dojo.
Vous allez vous inspirer de l'application proposé par le tutorial suivant : http://www.ibm.com/developerworks/web/tutorials/wa-dojotoolkit/index.html
Travail à faire :
- regarder ce tutorial,
- télécharger les sources, essayez (à la maison de le faire marcher).
Notez que ce tutorial (voir index.html) va chercher dojo chez Google chaque fois que vous l'exécutez, je vous conseille de modifier les lignes en question pour utiliser une version locale de Dojo, comme nous l'avons fait en TP (il faut changer les deux lignes en bas de index.html et les trois lignes qui incluent les css, en haut. Attention, le projet utilise par défaut un style qui n'existe pas dans dojo 1.3.2, remplacez par "tundra" comme en tp si vous voulez tourner en 1.3.2.
Ce tutorial propose de réaliser avec Dojo un gestionnaire de contacts à l'interface graphique très évoluée. Dans le back end on a une base de données qui gère des contacts (nom, prénom, email, tel fixe maison, tel fixe travail, tel mobile, identificateur sur facebook, identificateur sur twitter, identificateur sur linkedin.
Les utilisateurs appartiennent aussi à un groupe de contact : Famille, Amis, Collegues ou Autre, mais on doit pouvoir modifier, ajouter ou supprimer un egroupe.
Dans l'interface graphique on aura sur la gauche un arbre avec la liste des groupes et dans la partie droite en haut un tableau avec la liste des contacts, mais juste id, nom et tel. Lorsque on clique sur une ligne du tableau, dans une zone située en dessous on a le contact mais beaucoup plus détaillé.
Pour le détail des opérations possibles suivez le tutorial (le code est téléchargeable). Pour votre projet vous ferez marcher les fonctionnalités une à une, de manière incrémentale : afficher les contacts, voir le détail, modifier, afficher les groupes, etc.
TRAVAIL A FAIRE : faire fonctionner ce projet, le modifier pour gérer des films dont vous inventerez les caractéristiques (réalisateur, année, liste des acteurs (une String, pas besoin de relations ici...), photo de l'affiche ou mieux ensemble de photos (qu'on affichera dans une gallerie à côté des détails, à l'aide d'un widget dojo), etc.... Les catégories seront "film d'action etc"
Vous pouvez soit partir du projet fourni, soit lentement en faire un à vous en java ou en ASP ou autre... Dans ce cas, regardez dans le projet exemple quels sont les endroit dans le fichier index.html et script.js où sont appelés les fichiers php, vous aurez à écrire un code équivalent. Pour voir ce que ces fichiers php reçoivent comme paramètres et renvoient comme valeur (le plus souvent au format JSON), faites tourner le projet et activez firebug pour tracer ce qu'il se passe.
Vous serez récompenser si votre projet est original et ne ressemble pas à 100% à celui du tutorial. Vous aurez du bonus si le code serveur n'est pas en PHP, vous aurez du bonus si vous prenez la peine de comprendre ce projet et si vous arrivez à vous l'approprier:
Regardez comment on "connecte" les menus à des fonctions, les événements "je selectionne une ligne dans la table des contacts" avec une fonction qui affiche le détail. Toute cette "connexion" est faite dans le script script.js lors du chargement de la page : dojo.addOnLoad(function() { ..... }); exécute tout ce qui est entre parenthèse juste après que la page ait été chargée... dans ces actions il y a un bon nombre de dojo.connec(....) à la fin du fichier. Notez que toutes les actions possibles sont dans des fonctions javascript bien propres, certaines faisant des appels Ajax.
Si vous ne comprenez pas un élément, par exemple, le modèle d'un Tree, le TreeStoreModel situé quelque part dans index.html -> direction la doc de référence en ligne ! Idem pour tout ce que vous
ne comprenez pas. La réponse est peut être dans le cours, mais le cours a détaillé les modèles pour les tableaux (Grid) ou pour les listes dérolantes (dijit.form.FilteringSelect), mais pas ceux
des Tree ! Donc à vous de chercher dans la doc !
Vous avez le droit de vous faire aider par vos collègues, voir que plusieurs groupes utilisent le code écrit par un autre mais JE DOIS ETRE PREVENU de qui a ait quoi, sinon j'assimile cela à de la copie
et j'enlève des points.
Le projet est à me rendre lorsque je reviens, au mois de décembre. Il me faut une archive qui porte le nom du binome + des screenshots + une doc pour installer et qui explique le détail de ce que vous
avez fait avec une section spéciale "originalités par rapport au projet d'exemple et originalités qu'aucun autre groupe a faites à ma connaissance". Si cette dernière section est vide ou bidonnée
vous n'aurez pas le maximum de points.
Une démo sera effectuée devant moi pendant la première journée quand je viendrai vous voir en Décembre.
Vous n'êtes pas connecté. Connexion 