1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
$(function(){
init();
});
function init(){
//STRUCTURE
//Titre
$("#titre").html("<h1>Clic'Balles</h1>");
//Texte d'explication du jeu
$("#texte").html("Dans chacun des niveaux de jeu, cliquez sur les balles correspondant à la consigne affichée avant qu'elles ne touchent le bas du cadre !");
//Image du jeu
$("#image").html("<img src=\"\./images/jeu.jpg\" alt=\"image du jeu\">");
//Boutons
$("#boutonJeu").html("<input type=\"submit\" name=\"boutonJeu\" id=\"boutonJeu\" VALUE=\"Jouez !\" onclick=\"afficheJeu()\"/>");
$("#boutonQuitter").html("<input type=\"submit\" name=\"boutonQuitter\" id=\"boutonQuitter\" VALUE=\"Quittez !\" onclick=\"afficheAccueil()\"/>");
$("#boutonAccueil").html("<input type=\"submit\" name=\"boutonAccueil\" id=\"boutonAccueil\" VALUE=\"Accueil\" onclick=\"afficheAccueil()\"/>");
$("#boutonRejouer").html("<input type=\"submit\" name=\"boutonRejouer\" id=\"boutonRejouer\" VALUE=\"Rejouez !\" onclick=\"afficheJeu()\"/>");
//Déclaration du canvas
$("#animation").html("<canvas id=\"canvas\">Texte pour les navigateurs qui ne supportent pas canvas</canvas>");
//Pied de page
$("footer").html("MOOC HTML5 - R. ALBA - Mai 2014");
//DONNEES
creeDonnees();
//VARIABLES
var tempsJeu = 0;
var niveauCourant = 1;
var ecranCourant = "accueil";
//GESTIONNAIRES
//REGLES
//LANCEMENT
afficheAccueil();
}
//Fonctions
function creeDonnees(){
// On définit la consigne par niveau (couleur et taille des balles à cliquer)
var listeNiveaux = new Array();
listeNiveaux[0]=["rouges","petite"];
listeNiveaux[1]=["vertes","grande"];
// On définit les balles (idniveau, couleur, taille, position/x, vitesse, position/y, visible(1))
var listeBalles = new Array();
listeBalles[0]=[0,0,0,5,1,0,1];
listeBalles[1]=[0,1,1,20,2,0,1];
listeBalles[2]=[1,0,0,5,1,0,1];
listeBalles[1]=[1,1,1,20,2,0,1];
// On définit les couleurs avec le code hexadécimal
var listeCouleurs = new Array();
listeCouleurs[0]=["rouge","#FF0000"];
listeCouleurs[1]=["vert","#00FF00"];
// On définit le rayon des balles
var listeTailles = new Array();
listeTailles[0]=[5,"petite"];
listeTailles[1]=[20,"grande"];
}
function afficheAccueil(){
ecranCourant = "accueil";
$('#accueil').show();
$('#jeu').hide();
$('#bilan').hide();
}
function afficheConsigne(){
$("#consigne").html("Cliquez sur les balles "+listeNiveaux[0][0]+" de "+listeNiveaux[0][1]+" taille !");
}
function afficheJeu(){
ecranCourant = "jeu";
$('#accueil').hide();
$('#jeu').show();
$('#bilan').hide();
afficheConsigne();
} |
