Add ice texture + ice under snake head fixed

This commit is contained in:
Mathieu 2020-03-31 15:46:02 +02:00
parent b7f1dbf148
commit bf9f525d58
2 changed files with 19 additions and 15 deletions

BIN
assets/map/ice.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 133 KiB

View File

@ -84,6 +84,8 @@ const scoreTarget = byId("scoreTarget")
// Get map texture
const imgGrass = new Image();
imgGrass.src = './assets/map/grass.png';
const imgIce = new Image();
imgIce.src = './assets/map/ice.jpg';
// Get wall texture
const imgWall = new Image();
@ -301,19 +303,9 @@ async function startGame(gameID) {
let pattern = ctx.createPattern(imgGrass, 'repeat');
ctx.fillStyle = pattern;
ctx.fillRect(0, 0, canvas.width, canvas.height);
// First, draw the grid
ctx.lineWidth = 0.3;
for(let i = 0; i <= level.dimensions[1]; i++) {
drawLine(ctx, i*cell_width, 0, i*cell_width, canvas.height)
}
for(let i = 0; i <= level.dimensions[0]; i++) {
drawLine(ctx, 0, i*cell_height, canvas.width, i*cell_height, canvas.height)
}
// Now draw the map
// First draw the map
for(let y = 0; y < map.length; y++) {
for(let x = 0; x < map[y].length; x++) {
@ -330,8 +322,7 @@ async function startGame(gameID) {
case ICE:
case ICE_SNAKE:
ctx.fillStyle = "white";
ctx.fillRect(x*cell_width, y*cell_height, cell_width, cell_height)
ctx.drawImage(imgIce, x*cell_width, y*cell_height, cell_width, cell_height);
// If the snake is on the cell, we must render it too.
// That's why I put a condition to this break
@ -348,7 +339,10 @@ async function startGame(gameID) {
if(headPos[0] == y && headPos[1] == x) {
ctx.clearRect(x*cell_width+1, y*cell_height+1, cell_width-2, cell_height-2);
// Restore the background
ctx.drawImage(imgGrass, x*cell_width+1, y*cell_height+1, cell_width-2, cell_height-2);
if(map[y][x] == ICE_SNAKE)
ctx.drawImage(imgIce, x*cell_width+1, y*cell_height+1, cell_width-2, cell_height-2);
else
ctx.drawImage(imgGrass, x*cell_width+1, y*cell_height+1, cell_width-2, cell_height-2);
// Head Orientation
if(key == "ArrowDown")
@ -368,6 +362,16 @@ async function startGame(gameID) {
}
}
// Now, draw the grid
ctx.lineWidth = 0.3;
for(let i = 0; i <= level.dimensions[1]; i++) {
drawLine(ctx, i*cell_width, 0, i*cell_width, canvas.height)
}
for(let i = 0; i <= level.dimensions[0]; i++) {
drawLine(ctx, 0, i*cell_height, canvas.width, i*cell_height, canvas.height)
}
// Manage automated acceleration of snake