TP4: Creation d'un jeu et intégration dans Facebook

De $1

Version de 17:23, 25 Avr 2024

cette version.

Revenir à liste des archives.

Voir la version actuelle

 

Introduction

Dans ce TP vous allez transformer le paint des TPs précédents en véritable jeu multipiarticipants. Par exemple vous pourrez créer un "jeu à 4" pour lequel vous invitez des joueurs à "rejoindre la partie".

  • Classiquement, chaque joueur pourra décider de "créer une partie" ou de "rejoindre une partie".
  • Lors de la création d'une partie, le jeu demandera peut être des paramètres (combien de joueurs ? Mode de jeu ? etc).
  • Lorsqu'il rejoint une partie, les interfaces graphiques de tous les joueurs  afficheront : "il y a 1 joueur de prêt", "il y a 2 joueurs de prêts", etc... pour finalement dire "la partie commence".
  • Lorsque la partie commence, un compteur de temps sera décrémenté, seule une personne à la fois pourra dessiner etc. etc.

Nous allons dans ce TP commencer à mettre la première pierre pour développer ce genre de scénario.


Règle du jeu

On va s'inspirer du jeu Pictionnary ( http://en.wikipedia.org/wiki/Pictionary ), dont vous pouvez essayer une version en ligne ici : http://en.wikipedia.org/wiki/ISketch

Le principe de round (ou de "tour")

On va créer un mode de jeu : le serveur décide d'un mot, et d'un utilisateur qui devra dessiner, les autres doivent deviner le mot - celui qui aura deviné le mot en premier gagne la partie.

En résumé :

  1. Le serveur donne le mot et le premier utilisateur qui doit dessiner
  2. Ce premier utilisateur commence à dessiner,
  3. Les autres joueurs proposent des mots,
  4. Le serveur contrôle les propositions et décide si elles sont valides ou non 

On peut imaginer que celui qui gagne la partie prendra la place du dessinateur à la partie suivante.

Structure des rooms/"chambres d'appel"

Il va falloir implémenter la création de partie : chaque utilisateur doit avoir la possibilité de créer une partie ou avoir le choix de participer à une partie existante. Chaque partie sera caractérisée par :

  1. un nombre d'utilisateurs (2-4),
  2. un nom de partie,
  3. un mode de jeu,
  4. ...

Je vous propose d'utiliser l'api memstore pour gérer l'information : on l'utilisera pour stocker le nom d'utilisateur dans la session. Le "roomid" sera un entier, les paramètres seront passés via JSON.

Protocole

Dans le protocole vous devrez ajouter au minimum les commandes suivantes, qui seront envoyées comme d'habitude via le chat et interprétées par le code situé sur le serveur nodeJS, par exemple dans l'application chat-server.js (branchez vous sur les callbacks qui sont déclenchés lorsque des messages arrivent)

  • /goto roomid - pour aller dans une room.
  • /restart - pour lancer un nouveau jeu avec un mot au hasard (et effacer le canvas).
  • /createroom - pour crée la partie, il faut aussi ajouter des paramètres (nom de la partie et combien d'utilisateurs peuvent participer)
  • /checkword - obtenir le mot recherché
  • etc.

 

Intégrer le jeu dans Facebook

Vous vous en doutiez, un de ces jours on va le faire, on en a déjà parlé, certains l'ont déjà fait dans la classe lors du TP 2 que vous nous avez rendu. L'application étant pure HTML5 + Javascript, on peut l'intégrer à l'application du facebook du TP1. Il faut juste copier/coller le code dans la page JSP du TP1 en faisant un peu attention.

On pourra se servir des APIs de facebook plus tard pour "inviter des amis" à installer eux aussi l'application dans leur mur.

Première partie du travail donc : faire fonctionner l'application dans l'application facebook. Vous pouvez supprimer la partie "google map" du TP1 que l'on avait mis là pour vous montrer l'utilisation d'une API du web 2, mais qui au final n'est peut être pas trop pertinente dans le cadre d'un pictionary en ligne.

Optionnel (pour les forts): Utiliser Facebook Connect (voir : http://developers.facebook.com/blog/post/344), une technologie pour exporter les informations de profil facebook vers une application externe à vous (sur un site dédié externe). Vous devez récupérer les informations utiles concernant l'utilisateur (Nom, Avatar...) et les sauvegarder dans la session de connexion. Dans la session, vous gérerez ensuite l'information qui peut s'avérer utile (par exemple: numéro de la chambre d'appel où se trouve l'utilisateur, son rôle dans le jeu, les points etc.).

Après l'autorisation, l'utilisateur se retrouve dans la" chambre principale" avec des choix : créer sa propre partie (en "host") ou participer à une partie existante.