6
Application web nombre caché 77 ? 77 ? 1 © Philippe Genoud – UJF Grenoble – Janvier 2013

NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

Application web

nombre caché

77 ?77 ?

1© Philippe Genoud – UJF Grenoble – Janvier 2013

Page 2: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

Carlita se connecte sur

le site du nombre caché

Un nombre est tiré au hasard et un

formulaire permettant de faire une

première proposition est affiché

le joueur abandonne

La navigation dans le site

© Philippe Genoud – UJF Grenoble – Janvier 2013 2

elle est mauvaise et c'était le

dernier essai du joueur

c'est la bonne !elle est mauvaise et le joueur

n'a pas épuisé tous ses essais

le joueur soumet une proposition

Page 3: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

La navigation dans le site (suite)

A tout moment le joueur

peut basculer sur la page

d'aide

Le joueur revient

dans la page de jeu

dans l'état où elle était

précédemment

© Philippe Genoud – UJF Grenoble – Janvier 2013 3

Page 4: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

ActionDebuter

servlet

2La requête est redirigée vers une servlet qui débute une partie

Carlita se connecte sur le site du nombre caché Un nombre est tiré au hasard et un

formulaire permettant de faire une

première proposition est affiché

Comment les traitements sont-ils mis en place ?

1

ni = new NombreInconnu(…)5l'exécution de la page JSP produitle code de la page

http://www.cci.com/NombreCache

6serveur

de l'application

NombreCache

© Philippe Genoud – UJF Grenoble – Janvier 2013 4

valeur

nbEssaisRestant

4

3

La servlet crée un objet NombreInconnu34

la requête est redirigée vers une page JSP

pageJeu.jsp

5page JSP produitle code de la page HTML retournée auclient

Page 5: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

Comment les traitements sont-ils mis en place ?

ActionDebuter

servlet

2

5

CONTROLEUR

Carlita se connecte sur le site du nombre caché

1

6

http://www.cci.com/NombreCache

© Philippe Genoud – UJF Grenoble – Janvier 2013 5

valeur

nbEssaisRestant

4

3

34

pageJeu.jsp

5

VUE MODELE

Desing Pattern MVC :

Model – View - Controler

Page 6: NombreCacheJQuerylig-membres.imag.fr/genoud/ENSJAVA/M2CCI/cours/NombreCacheJ… · 4 3 pageJeu.jsp VUE MODELE DesingPattern MVC : Model –View-Controler. int v = Integer.parseInt(request

int v =

Integer.parseInt(request.

getParameter("proposition");

ni.testerValeur(v)

JsonGenerator gen =

ActionJouer

servlet

3La requête est redirigée vers une servlet qui gère une action de jeu

Carlita fait une proposition

Comment les traitements sont-ils mis en place ?

La servlet compare la

le serveur compare la proposition

du joueur avec la valeur du nombre inconnu et

renvoie au client la situation de sa proposition

(trop grande, trop petit, gagné, perdu … )

5

2

HTTP POST

url : jouer

proposition=6

66 est trop grand

JsonGenerator gen =

Json.createGenerator(out);

gen.writeStartObject().write(…)

...

© Philippe Genoud – UJF Grenoble – Janvier 2013 6

valeur

nbEssaisRestant

4

3

La servlet compare laproposition avec le nombreinconnu

4

5

La servlet construit un objet JSONqui regroupe les informations nécessaires au client pour mettre à jour l'affichage

appel AJAX au serveuravec la valeur proposée

1

{

"proposition": 4,

"nbEssaisRestant": 2,

"comparaison": -2

}

6

lorsque la réponse du serveurarrive, appel de la fonction

callback

7mise à jourdu DOM

6 est trop grand

il vous reste 2 essai(s): Rejouez