SHOW:
|
|
- or go back to the newest paste.
1 | /* Initialisation des variables */ | |
2 | /* Informations passés par les fichiers de niveaux */ | |
3 | /* Carte du jeu -> 0 = sol ; 1 = mur ; 2 = sol traversé */ | |
4 | /* A revoir -> Carte du jeu -> 0 = mur ; 1 = sol traversé ; 2 = sol */ | |
5 | /* Informations sur le joueur */ | |
6 | ||
7 | - | /* Variables utilitaires */ |
7 | + | var |
8 | - | var |
8 | + | canvas = document.getElementById('canvas'), |
9 | - | canvas = document.getElementById('canvas'), |
9 | + | context = canvas.getContext('2d'), |
10 | - | context = canvas.getContext('2d'), |
10 | + | niveauLargeur = 0, niveauHauteur = 0, |
11 | - | niveauLargeur = 0, niveauHauteur = 0, |
11 | + | nbCasesVide = 0, nbCaisses = caisses.length, nbDeplacementsTotalNecessaire = 0, |
12 | - | nbCasesVide = 0, nbCaisses = caisses.length, nbDeplacementsTotalNecessaire = 0, |
12 | + | nbDeplacementsJoueur = 0, nbDeplacementsCaisses = 0; |
13 | - | nbDeplacementsJoueur = 0, nbDeplacementsCaisses = 0; |
13 | + | image = {}, |
14 | - | image = {}, |
14 | + | images = { |
15 | - | images = { |
15 | + | joueur: 'images/joueur.png', |
16 | - | joueur: 'images/joueur.png', |
16 | + | mur: 'images/mur.png', |
17 | - | mur: 'images/mur.png', |
17 | + | sol: 'images/sol.png', |
18 | - | sol: 'images/sol.png', |
18 | + | solTraverse: 'images/solTraverse.png', |
19 | - | solTraverse: 'images/solTraverse.png', |
19 | + | caisse: 'images/caisse.png', |
20 | - | caisse: 'images/caisse.png', |
20 | + | interrupteur: 'images/interrupteur.png', |
21 | - | interrupteur: 'images/interrupteur.png', |
21 | + | porte: 'images/porte.png' |
22 | - | porte: 'images/porte.png' |
22 | + | }, |
23 | - | }, |
23 | + | cases = { |
24 | - | cases = { |
24 | + | sol: 0, |
25 | - | sol: 0, |
25 | + | mur: 1, |
26 | - | mur: 1, |
26 | + | solTraverse: 2 |
27 | - | solTraverse: 2 |
27 | + | }; |
28 | - | }; |
28 | + | |
29 | /* Fonctions */ | |
30 | /* Fonction de jeu */ | |
31 | - | /* Fonction exécuté SEULEMENT à l'exécution du jeu */ |
31 | + | /* Fonction exécuté SEULEMENT à l'exécution du jeu */ |
32 | - | function Create() { |
32 | + | function Create() { |
33 | - | niveauLargeur = niveau[0].length; |
33 | + | niveauLargeur = niveau[0].length; |
34 | - | niveauHauteur = niveau.length; |
34 | + | niveauHauteur = niveau.length; |
35 | ||
36 | - | canvas.width = niveauLargeur * niveauZoom; |
36 | + | canvas.width = niveauLargeur * niveauZoom; |
37 | - | canvas.height = niveauHauteur * niveauZoom; |
37 | + | canvas.height = niveauHauteur * niveauZoom; |
38 | ||
39 | - | $(canvas).css('width', (niveauLargeur * niveauZoom) + 'px'); |
39 | + | $(canvas).css('width', (niveauLargeur * niveauZoom) + 'px'); |
40 | - | $(canvas).css('height', (niveauHauteur * niveauZoom) + 'px'); |
40 | + | $(canvas).css('height', (niveauHauteur * niveauZoom) + 'px'); |
41 | ||
42 | - | for (var lien in images) { |
42 | + | for (var lien in images) { |
43 | - | image[lien] = new Image(); |
43 | + | image[lien] = new Image(); |
44 | - | image[lien].src = images[lien]; |
44 | + | image[lien].src = images[lien]; |
45 | } | |
46 | ||
47 | - | Update(); |
47 | + | Update(); |
48 | - | nbDeplacementsTotalNecessaire = nbCasesVide - nbCaisses; |
48 | + | |
49 | - | } |
49 | + | nbDeplacementsTotalNecessaire = nbCasesVide - nbCaisses; |
50 | } | |
51 | - | /* Mise à jour du jeu */ |
51 | + | |
52 | - | function Update() { |
52 | + | /* Mise à jour du jeu */ |
53 | - | /* Liste des fonctions à exécuter en permanence */ |
53 | + | function Update() { |
54 | dessineNiveau(); | |
55 | dessineCaisses(); | |
56 | dessineJoueur(); | |
57 | dessineInterrupteurs(); | |
58 | victoire(); | |
59 | - | } |
59 | + | |
60 | ||
61 | - | /* Déstruction du jeu */ |
61 | + | /* Destruction du jeu */ |
62 | - | function Destroy() { |
62 | + | function Destroy() { |
63 | - | /* Affiche un fond coloré */ |
63 | + | /* Affiche un fond coloré */ |
64 | - | context.rect(0, 0, canvas.width, canvas.height); |
64 | + | context.rect(0, 0, canvas.width, canvas.height); |
65 | - | context.fillStyle = 'rgba(236, 236, 236, .5)'; |
65 | + | context.fillStyle = 'rgba(236, 236, 236, .5)'; |
66 | - | context.fill(); |
66 | + | context.fill(); |
67 | ||
68 | - | /* Afficher le texte de la victoire */ |
68 | + | /* Afficher le texte de la victoire */ |
69 | - | context.font = '24px Arial'; |
69 | + | context.font = '24px Arial'; |
70 | - | context.fillStyle = 'rgb(50, 120, 50)'; |
70 | + | context.fillStyle = 'rgb(50, 120, 50)'; |
71 | - | context.textAlign = 'center'; |
71 | + | context.textAlign = 'center'; |
72 | - | context.fillText('Victoire!', canvas.width / 2, canvas.height / 2 + 12); |
72 | + | context.fillText('Victoire!', canvas.width / 2, canvas.height / 2 + 12); |
73 | - | } |
73 | + | |
74 | ||
75 | - | /* Victoire */ |
75 | + | /* Fonctions utilitaires */ |
76 | - | function victoire() { |
76 | + | /* Annonce la fin du niveau */ |
77 | - | /* Si toutes les sols ont été recouvert, on lance la victoire */ |
77 | + | function victoire() { |
78 | - | if (nbCasesVide == nbCaisses) { |
78 | + | /* Si toutes les sols ont été recouvert, on lance la victoire */ |
79 | - | /* Stop la boucle de mise à jour du jeu */ |
79 | + | if (nbCasesVide == nbCaisses) { |
80 | - | clearInterval(Update); |
80 | + | /* Stop la boucle de mise à jour du jeu */ |
81 | clearInterval(Update); | |
82 | - | /* Destruction du jeu après 0.5 secondes */ |
82 | + | |
83 | - | setTimeout(Destroy, 500); |
83 | + | /* Destruction du jeu après 0.5 secondes */ |
84 | setTimeout(Destroy, 500); | |
85 | - | } |
85 | + | |
86 | } | |
87 | - | /* Dessiner les murs du niveau */ |
87 | + | |
88 | - | function dessineNiveau() { |
88 | + | /* Fonctions de dessins */ |
89 | - | nbCasesVide = 0; |
89 | + | /* Dessine le niveau */ |
90 | function dessineNiveau() { | |
91 | - | for (var y = 0 ; y < niveauHauteur ; y++) { |
91 | + | nbCasesVide = 0; |
92 | - | for (var x = 0 ; x < niveauLargeur ; x++) { |
92 | + | |
93 | - | var contenu = niveau[y][x]; |
93 | + | for (var y = 0 ; y < niveauHauteur ; y++) { |
94 | for (var x = 0 ; x < niveauLargeur ; x++) { | |
95 | - | if (contenu >= 0) { |
95 | + | var contenu = niveau[y][x]; |
96 | - | if (contenu == cases.sol) { |
96 | + | |
97 | - | context.drawImage(image.sol, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); |
97 | + | if (contenu >= 0) { |
98 | - | nbCasesVide += 1; |
98 | + | if (contenu == cases.sol) { |
99 | - | } else if (contenu == cases.mur) { |
99 | + | context.drawImage(image.sol, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); |
100 | - | context.drawImage(image.mur, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); |
100 | + | nbCasesVide += 1; |
101 | - | } else if (contenu == cases.solTraverse) { |
101 | + | } else if (contenu == cases.mur) { |
102 | - | context.drawImage(image.solTraverse, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); |
102 | + | context.drawImage(image.mur, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); |
103 | } else if (contenu == cases.solTraverse) { | |
104 | context.drawImage(image.solTraverse, x * niveauZoom, y * niveauZoom, niveauZoom, niveauZoom); | |
105 | } | |
106 | } | |
107 | - | } |
107 | + | |
108 | } | |
109 | - | /* Dessiner le joueur */ |
109 | + | |
110 | - | function dessineJoueur() { |
110 | + | |
111 | - | context.fillStyle = 'rgb(255, 0, 0)'; |
111 | + | /* Dessiner le joueur */ |
112 | - | // context.drawImage(image.joueur, joueur.x * niveauZoom, joueur.y * niveauZoom, niveauZoom, niveauZoom); |
112 | + | function dessineJoueur() { |
113 | - | context.drawImage(image.joueur, 0, 0, niveauZoom, niveauZoom, joueur.x * niveauZoom, joueur.y * niveauZoom, niveauZoom, niveauZoom); |
113 | + | context.fillStyle = 'rgb(255, 0, 0)'; |
114 | - | } |
114 | + | // context.drawImage(image.joueur, joueur.x * niveauZoom, joueur.y * niveauZoom, niveauZoom, niveauZoom); |
115 | context.drawImage(image.joueur, 0, 0, niveauZoom, niveauZoom, joueur.x * niveauZoom, joueur.y * niveauZoom, niveauZoom, niveauZoom); | |
116 | - | /* Dessiner le joueur */ |
116 | + | |
117 | - | function dessineCaisses() { |
117 | + | |
118 | - | for (var i in caisses) { |
118 | + | /* Dessiner les caisses */ |
119 | - | context.drawImage(image.caisse, caisses[i].x * niveauZoom, caisses[i].y * niveauZoom, niveauZoom, niveauZoom); |
119 | + | function dessineCaisses() { |
120 | for (var i in caisses) { | |
121 | - | } |
121 | + | context.drawImage(image.caisse, caisses[i].x * niveauZoom, caisses[i].y * niveauZoom, niveauZoom, niveauZoom); |
122 | } | |
123 | - | /* Dessiner le joueur */ |
123 | + | |
124 | - | function dessineInterrupteurs() { |
124 | + | |
125 | - | for (var i in interrupteurs) { |
125 | + | /* Dessiner les interrupteurs (+ les portes avec des traits) */ |
126 | - | if (interrupteurs[i].ouvert == false) { |
126 | + | function dessineInterrupteurs() { |
127 | - | /* Dessine l'interrupteur */ |
127 | + | for (var i in interrupteurs) { |
128 | - | context.drawImage(image.interrupteur, interrupteurs[i].xInterrupteur * niveauZoom, interrupteurs[i].yInterrupteur * niveauZoom, niveauZoom, niveauZoom); |
128 | + | if (interrupteurs[i].ouvert == false) { |
129 | /* Dessine l'interrupteur */ | |
130 | - | /* Dessine la porte */ |
130 | + | context.drawImage(image.interrupteur, interrupteurs[i].xInterrupteur * niveauZoom, interrupteurs[i].yInterrupteur * niveauZoom, niveauZoom, niveauZoom); |
131 | - | context.drawImage(image.porte, interrupteurs[i].xPorte * niveauZoom, interrupteurs[i].yPorte * niveauZoom, niveauZoom, niveauZoom); |
131 | + | |
132 | /* Dessine la porte */ | |
133 | - | /* Dessine le trait qui relie la porte et l'interrupteur */ |
133 | + | context.drawImage(image.porte, interrupteurs[i].xPorte * niveauZoom, interrupteurs[i].yPorte * niveauZoom, niveauZoom, niveauZoom); |
134 | - | context.beginPath(); |
134 | + | |
135 | - | context.strokeStyle = 'rgba(150, 50, 50, .3)'; |
135 | + | /* Dessine le trait qui relie la porte et l'interrupteur */ |
136 | - | context.lineWidth = 1; |
136 | + | context.beginPath(); |
137 | - | context.lineCap = 'round'; |
137 | + | context.strokeStyle = 'rgba(150, 50, 50, .3)'; |
138 | - | context.moveTo(interrupteurs[i].xInterrupteur * niveauZoom + (niveauZoom / 2), interrupteurs[i].yInterrupteur * niveauZoom + (niveauZoom / 2)); |
138 | + | context.lineWidth = 1; |
139 | - | context.lineTo(interrupteurs[i].xPorte * niveauZoom + (niveauZoom / 2), interrupteurs[i].yPorte * niveauZoom + (niveauZoom / 2)); |
139 | + | context.lineCap = 'round'; |
140 | - | context.stroke(); |
140 | + | context.moveTo(interrupteurs[i].xInterrupteur * niveauZoom + (niveauZoom / 2), interrupteurs[i].yInterrupteur * niveauZoom + (niveauZoom / 2)); |
141 | context.lineTo(interrupteurs[i].xPorte * niveauZoom + (niveauZoom / 2), interrupteurs[i].yPorte * niveauZoom + (niveauZoom / 2)); | |
142 | context.stroke(); | |
143 | - | } |
143 | + | |
144 | } | |
145 | - | /* Déplacement du joueur */ |
145 | + | |
146 | - | $(document).keydown(function(event) { |
146 | + | |
147 | - | if (event.keyCode == '38' || event.keyCode == '90') { deplacement('haut'); } |
147 | + | /* Fonctions de déplacement du joueur */ |
148 | - | if (event.keyCode == '40' || event.keyCode == '83') { deplacement('bas'); } |
148 | + | /* Appuie sur une touche déclenche le mouvement du joueur*/ |
149 | - | if (event.keyCode == '37' || event.keyCode == '81') { deplacement('gauche'); } |
149 | + | $(document).keydown(function(event) { |
150 | - | if (event.keyCode == '39' || event.keyCode == '68') { deplacement('droite'); } |
150 | + | if (event.keyCode == '38' || event.keyCode == '90') { deplacement('haut'); } |
151 | - | }); |
151 | + | if (event.keyCode == '40' || event.keyCode == '83') { deplacement('bas'); } |
152 | if (event.keyCode == '37' || event.keyCode == '81') { deplacement('gauche'); } | |
153 | - | /* Déplacements du joueur */ |
153 | + | if (event.keyCode == '39' || event.keyCode == '68') { deplacement('droite'); } |
154 | - | function deplacement(ou) { |
154 | + | }); |
155 | - | var |
155 | + | |
156 | - | nvJoueur, |
156 | + | /* Déplace le joueur */ |
157 | - | nvCaisse, |
157 | + | function deplacement(ou) { |
158 | - | touche = false; |
158 | + | var |
159 | nvJoueur, | |
160 | - | if (ou == 'haut') { nvJoueur = { |
160 | + | nvCaisse, |
161 | - | x: joueur.x, |
161 | + | touche = false; |
162 | - | y: joueur.y - 1 |
162 | + | |
163 | - | } } else if (ou == 'bas') { nvJoueur = { |
163 | + | /* Vers où se dirige le joueur */ |
164 | - | x: joueur.x, |
164 | + | if (ou == 'haut') { nvJoueur = { |
165 | - | y: joueur.y + 1 |
165 | + | x: joueur.x, |
166 | - | } } else if (ou == 'gauche') { nvJoueur = { |
166 | + | y: joueur.y - 1 |
167 | - | x: joueur.x - 1, |
167 | + | } } else if (ou == 'bas') { nvJoueur = { |
168 | - | y: joueur.y |
168 | + | x: joueur.x, |
169 | - | } } else if (ou == 'droite') { nvJoueur = { |
169 | + | y: joueur.y + 1 |
170 | - | x: joueur.x + 1, |
170 | + | } } else if (ou == 'gauche') { nvJoueur = { |
171 | - | y: joueur.y |
171 | + | x: joueur.x - 1, |
172 | - | } } |
172 | + | y: joueur.y |
173 | } } else if (ou == 'droite') { nvJoueur = { | |
174 | - | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'caisse') != false) { |
174 | + | x: joueur.x + 1, |
175 | - | var i = yAQuoiLa(nvJoueur.x, nvJoueur.y, 'caisse') - 1; |
175 | + | y: joueur.y |
176 | } } | |
177 | - | if (ou == 'haut') { nvCaisse = { |
177 | + | |
178 | - | x: caisses[i].x, |
178 | + | /* Si il y a une caisse, on la pousse si possible */ |
179 | - | y: caisses[i].y - 1 |
179 | + | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'caisse') != false) { |
180 | - | } } else if (ou == 'bas') { nvCaisse = { |
180 | + | var i = yAQuoiLa(nvJoueur.x, nvJoueur.y, 'caisse') - 1; |
181 | - | x: caisses[i].x, |
181 | + | |
182 | - | y: caisses[i].y + 1 |
182 | + | if (ou == 'haut') { nvCaisse = { |
183 | - | } } else if (ou == 'gauche') { nvCaisse = { |
183 | + | x: caisses[i].x, |
184 | - | x: caisses[i].x - 1, |
184 | + | y: caisses[i].y - 1 |
185 | - | y: caisses[i].y |
185 | + | } } else if (ou == 'bas') { nvCaisse = { |
186 | - | } } else if (ou == 'droite') { nvCaisse = { |
186 | + | x: caisses[i].x, |
187 | - | x: caisses[i].x + 1, |
187 | + | y: caisses[i].y + 1 |
188 | - | y: caisses[i].y |
188 | + | } } else if (ou == 'gauche') { nvCaisse = { |
189 | - | } } |
189 | + | x: caisses[i].x - 1, |
190 | y: caisses[i].y | |
191 | - | if (caisses[i].x == nvJoueur.x && caisses[i].y == nvJoueur.y) { |
191 | + | } } else if (ou == 'droite') { nvCaisse = { |
192 | - | if (niveau[nvCaisse.y][nvCaisse.x] == cases.mur || niveau[nvCaisse.y][nvCaisse.x] == cases.solTraverse) { |
192 | + | x: caisses[i].x + 1, |
193 | - | nvJoueur.x = joueur.x; |
193 | + | y: caisses[i].y |
194 | - | nvJoueur.y = joueur.y; |
194 | + | } } |
195 | - | nvCaisse.x = caisses[i].x; |
195 | + | |
196 | - | nvCaisse.y = caisses[i].y; |
196 | + | if (caisses[i].x == nvJoueur.x && caisses[i].y == nvJoueur.y) { |
197 | - | nbDeplacementsCaisses--; |
197 | + | if (niveau[nvCaisse.y][nvCaisse.x] == cases.mur || niveau[nvCaisse.y][nvCaisse.x] == cases.solTraverse) { |
198 | nvJoueur.x = joueur.x; | |
199 | nvJoueur.y = joueur.y; | |
200 | - | caisses[i].x = nvCaisse.x; |
200 | + | nvCaisse.x = caisses[i].x; |
201 | - | caisses[i].y = nvCaisse.y; |
201 | + | nvCaisse.y = caisses[i].y; |
202 | - | nbDeplacementsCaisses++; |
202 | + | nbDeplacementsCaisses--; |
203 | - | touche = true; |
203 | + | } |
204 | ||
205 | caisses[i].x = nvCaisse.x; | |
206 | caisses[i].y = nvCaisse.y; | |
207 | - | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'interrupteur') != false) { |
207 | + | nbDeplacementsCaisses++; |
208 | - | var i = yAQuoiLa(nvJoueur.x, nvJoueur.y, 'interrupteur') - 1; |
208 | + | touche = true; |
209 | - | interrupteurs[i].ouvert = true; |
209 | + | } |
210 | } | |
211 | ||
212 | - | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'porte') == true) { |
212 | + | /* Si il y a un interrupteur, on l'active */ |
213 | - | nvJoueur.x = joueur.x; |
213 | + | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'interrupteur') != false) { |
214 | - | nvJoueur.y = joueur.y; |
214 | + | var i = yAQuoiLa(nvJoueur.x, nvJoueur.y, 'interrupteur') - 1; |
215 | interrupteurs[i].ouvert = true; | |
216 | } | |
217 | - | if (niveau[nvJoueur.y][nvJoueur.x] == cases.sol && touche == false) { |
217 | + | |
218 | - | niveau[nvJoueur.y][nvJoueur.x] = cases.solTraverse; |
218 | + | /* Si il y a une porte, le mouvement du joueur est annulé */ |
219 | - | joueur.x = nvJoueur.x; |
219 | + | if (yAQuoiLa(nvJoueur.x, nvJoueur.y, 'porte') == true) { |
220 | - | joueur.y = nvJoueur.y; |
220 | + | nvJoueur.x = joueur.x; |
221 | - | nbDeplacementsJoueur++; |
221 | + | nvJoueur.y = joueur.y; |
222 | } | |
223 | - | } |
223 | + | |
224 | /* Déplacement du joueur */ | |
225 | - | /* Y a quoi là ? */ |
225 | + | if (niveau[nvJoueur.y][nvJoueur.x] == cases.sol && touche == false) { |
226 | - | function yAQuoiLa(x, y, quoi) { |
226 | + | niveau[nvJoueur.y][nvJoueur.x] = cases.solTraverse; |
227 | - | if (quoi == 'niveau') { |
227 | + | joueur.x = nvJoueur.x; |
228 | - | return niveau[y][x]; |
228 | + | joueur.y = nvJoueur.y; |
229 | - | } else if (quoi == 'caisse') { |
229 | + | nbDeplacementsJoueur++; |
230 | - | for (var i in caisses) { |
230 | + | |
231 | - | if (x == caisses[i].x && y == caisses[i].y) { |
231 | + | |
232 | - | return parseInt(i + 1); |
232 | + | |
233 | /* Y a quoi là ? */ | |
234 | function yAQuoiLa(x, y, quoi) { | |
235 | - | } else if (quoi == 'interrupteur') { |
235 | + | if (quoi == 'niveau') { |
236 | - | for (var i in interrupteurs) { |
236 | + | return niveau[y][x]; |
237 | - | if (x == interrupteurs[i].xInterrupteur && y == interrupteurs[i].yInterrupteur && interrupteurs[i].ouvert == false) { |
237 | + | } else if (quoi == 'caisse') { |
238 | - | return parseInt(i + 1); |
238 | + | for (var i in caisses) { |
239 | if (x == caisses[i].x && y == caisses[i].y) { | |
240 | return parseInt(i + 1); | |
241 | - | } else if (quoi == 'porte') { |
241 | + | |
242 | - | for (var i in interrupteurs) { |
242 | + | |
243 | - | if (x == interrupteurs[i].xPorte && y == interrupteurs[i].yPorte && interrupteurs[i].ouvert == false) { |
243 | + | } else if (quoi == 'interrupteur') { |
244 | - | return true; |
244 | + | for (var i in interrupteurs) { |
245 | if (x == interrupteurs[i].xInterrupteur && y == interrupteurs[i].yInterrupteur && interrupteurs[i].ouvert == false) { | |
246 | return parseInt(i + 1); | |
247 | } | |
248 | } | |
249 | - | return false; |
249 | + | } else if (quoi == 'porte') { |
250 | - | } |
250 | + | for (var i in interrupteurs) { |
251 | if (x == interrupteurs[i].xPorte && y == interrupteurs[i].yPorte && interrupteurs[i].ouvert == false) { | |
252 | return true; | |
253 | } | |
254 | } | |
255 | } | |
256 | ||
257 | return false; | |
258 | } | |
259 | ||
260 | /* Fonctions à exécuter */ | |
261 | Create(); | |
262 | Update = setInterval(Update, 1000 / 60); |