From 7cbca4005b5c0e3781a8f4f6ca7e9900482c9124 Mon Sep 17 00:00:00 2001 From: HPNeo Date: Sat, 28 Nov 2015 05:00:35 -0500 Subject: [PATCH] Fix movement in grid --- scripts/objects/enemy.js | 80 ++++++++++++++---- scripts/objects/player.js | 171 +++++++++++++++++++++++++------------- scripts/states/game.js | 158 ++++++++++++++++------------------- 3 files changed, 250 insertions(+), 159 deletions(-) diff --git a/scripts/objects/enemy.js b/scripts/objects/enemy.js index 6b74960..6ec4b73 100755 --- a/scripts/objects/enemy.js +++ b/scripts/objects/enemy.js @@ -2,6 +2,7 @@ var DEFAULT_ENEMY_SPEED = 100 ; function Enemy(game, x, y) { Phaser.Sprite.call(this, game, x, y, 'enemy', 0); + this.game = game; this.game.physics.enable(this); this.body.allowGravity = false; @@ -16,7 +17,7 @@ function Enemy(game, x, y) { this.animations.add('left', [5, 6, 7, 4], 8, true); this.animations.add('right', [9, 10, 11, 8], 8, true); this.animations.add('down', [1, 2, 3, 0], 8, true); - this.facing = "down"; + this.facing = 'down'; this.body.immovable = true; } @@ -27,28 +28,73 @@ function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; }; -Enemy.prototype.easyStarMovement = function(player,level){ - var easystar = new EasyStar.js(); - var playerX = Math.floor(player.x / 32); - var playerY = Math.floor(player.y / 32); - var thisX = Math.floor(this.x / 32); - var thisY = Math.floor(this.y / 32); +Enemy.prototype.easyStarMovement = function(player, level) { + var easystar = new EasyStar.js(), + playerX = Math.floor(player.x / 32), + playerY = Math.floor(player.y / 32), + thisX = Math.floor(this.x / 32), + thisY = Math.floor(this.y / 32); + easystar.setGrid(level.data); easystar.setAcceptableTiles([0]); - easystar.findPath(thisX , thisY, playerX, playerY, function(path){ - this.path = path; - var i = 0; - this.game.time.events.loop(Phaser.Timer.SECOND, function(){ - if(i < path.length){ - this.x = (path[i].x) * 32; - this.y = (path[i].y) * 32; - i++; + easystar.findPath(thisX, thisY, playerX, playerY, function(path) { + var i = 0; + + if (!path) { + return; + } + + if (this.path) { + this.stopEasystar(); + } + + this.path = path; + + this.timer = this.game.time.events.loop(1000, function() { + if (i < path.length) { + var newX = (path[i].x) * 32, + newY = (path[i].y) * 32; + + if (this.x < newX) { + this.animations.play('right'); + } + else if (this.x > newX) { + this.animations.play('left'); + } + + if (this.y < newY) { + this.animations.play('down'); } - },this); + else if (this.y > newY) { + this.animations.play('up'); + } + + this.game.add.tween(this).to({ + x: newX, + y: newY + }, 850, Phaser.Easing.Linear.None, true); + + // this.x = newX; + // this.y = newY; + + i++; + } + else { + this.animations.stop(); + } + }, this).timer; + + this.timer.start(0); }.bind(this)); + easystar.calculate(); }; +Enemy.prototype.stopEasystar = function() { + this.timer.stop(true); + this.animations.stop(); +}; + Enemy.prototype.canDropBombs = function(bombsPool) { return (bombsPool.total < this.maxBombs); -}; +}; \ No newline at end of file diff --git a/scripts/objects/player.js b/scripts/objects/player.js index 0ad525c..ecc7dc3 100755 --- a/scripts/objects/player.js +++ b/scripts/objects/player.js @@ -1,4 +1,5 @@ -var DEFAULT_PLAYER_SPEED = 160; +var DEFAULT_PLAYER_SPEED = 160, + TILE_SIZE = 32; function Player(game, x, y, key, frame) { Phaser.Sprite.call(this, game, x, y, key, frame); @@ -8,10 +9,10 @@ function Player(game, x, y, key, frame) { this.bombStrength = 1; this.score = 0; this.alive = true; - this.fila = y; - this.columna = x; - this.x = this.columna * 32; - this.y = this.fila * 32; + this.row = y; + this.column = x; + this.x = this.column * TILE_SIZE; + this.y = this.row * TILE_SIZE; this.speed = DEFAULT_PLAYER_SPEED; this.animations.add('up', [15, 12, 13, 14], 8, true); this.animations.add('left', [5, 6, 7, 4], 8, true); @@ -21,11 +22,14 @@ function Player(game, x, y, key, frame) { this.game.physics.enable(this); this.body.setSize(24, 24, 4, 24); + this.body.velocity.x = 0; + this.body.velocity.y = 0; this.anchor.setTo(0, 0); this.body.collideWorldBounds = true; - this.facing = "down"; + this.facing = 'down'; this.bombButtonJustPressed = false; + this.isMoving = false; this.game.add.existing(this); } @@ -33,61 +37,113 @@ function Player(game, x, y, key, frame) { Player.prototype = Object.create(Phaser.Sprite.prototype); Player.prototype.constructor = Player; -// Player.prototype.create = function() {}; -// Player.prototype.update = function() {}; Player.prototype.handleInput = function(rocks) { this.handleMotionInput(rocks); this.handleBombInput(); }; -Player.prototype.handleMotionInput = function(level) { - var moving = true; - var matriz = level.data; - if (this.game.input.keyboard.isDown(Phaser.Keyboard.UP)) { - console.log(this.fila); - console.log(matriz.length); - console.log(this.columna); - console.log(matriz[0].length); - console.log(matriz); - this.facing = "up"; - if( (this.fila - 1) >= 0){ - if(matriz[this.fila - 1][this.columna] == 0){ - this.y = (this.fila - 1) * 32; - this.fila -= 1; - } +Player.prototype.coordinateToGrid = function(coordinate) { + var minimumGridValue = Phaser.Math.snapToFloor(coordinate, TILE_SIZE) / TILE_SIZE, + maximumGridValue = Phaser.Math.snapToCeil(coordinate, TILE_SIZE) / TILE_SIZE; + + if (coordinate >= (minimumGridValue * TILE_SIZE) && coordinate <= (maximumGridValue * TILE_SIZE)) { + return minimumGridValue; + } + else { + return maximumGridValue; + } +}; + +Player.prototype.moveUp = function(levelGridData) { + this.facing = 'up'; + this.isMoving = true; + + if ((this.row - 1) >= 0) { + if (levelGridData[this.row - 1][this.column] === 0) { + this.y -= (TILE_SIZE - 8) * (this.game.time.elapsed / 350); + // this.row = Phaser.Math.snapToCeil(this.y, TILE_SIZE) / TILE_SIZE; + this.row = this.coordinateToGrid(this.y + 24); } - } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { - this.facing = "down"; - if( (this.fila + 1) <= (matriz.length - 1)){ - if(matriz[this.fila + 1][this.columna] == 0){ - this.y = (this.fila + 1) * 32; - this.fila += 1; - } + } + else { + if (this.y >= -8) { + this.y -= TILE_SIZE * (this.game.time.elapsed / 350); } + } +}; - } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { - this.facing = "left"; - if( (this.columna - 1) >= 0){ - if(matriz[this.fila][this.columna - 1] == 0){ - this.x = (this.columna - 1) * 32; - this.columna -= 1; - } +Player.prototype.moveDown = function(levelGridData) { + this.facing = 'down'; + this.isMoving = true; + + if ((this.row + 1) <= (levelGridData.length - 1)) { + if (levelGridData[this.row + 1][this.column] === 0) { + this.y += (TILE_SIZE - 8) * (this.game.time.elapsed / 350); + // this.row = Phaser.Math.snapToFloor(this.y, TILE_SIZE) / TILE_SIZE; + this.row = this.coordinateToGrid(this.y + 24); } - } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { - this.facing = "right"; + } + else { + if (this.y < (levelGridData.length - 1) * TILE_SIZE) { + this.y += TILE_SIZE * (this.game.time.elapsed / 350); + } + } +}; - if( (this.columna + 1) <= (matriz[0].length - 1)){ - if(matriz[this.fila][this.columna + 1] == 0){ - this.x = (this.columna + 1) * 32; - this.columna += 1; - } +Player.prototype.moveLeft = function(levelGridData) { + this.facing = 'left'; + this.isMoving = true; + + if ((this.column - 1) >= 0) { + if (levelGridData[this.row][this.column - 1] === 0) { + this.x -= TILE_SIZE * (this.game.time.elapsed / 350); + // this.column = Phaser.Math.snapToCeil(this.x, TILE_SIZE) / TILE_SIZE; + this.column = this.coordinateToGrid(this.x + 4); + } + } + else { + if (this.x >= 4) { + this.x -= TILE_SIZE * (this.game.time.elapsed / 350); } + } +}; + +Player.prototype.moveRight = function(levelGridData) { + this.facing = 'right'; + this.isMoving = true; + + if ((this.column + 1) <= (levelGridData[0].length - 1)) { + if (levelGridData[this.row][this.column + 1] === 0) { + this.x += TILE_SIZE * (this.game.time.elapsed / 350); + // this.column = Phaser.Math.snapToCeil(this.x, TILE_SIZE) / TILE_SIZE; + this.column = this.coordinateToGrid(this.x + 4); + } + } + else { + if (this.x < levelGridData[0].length * TILE_SIZE) { + this.x += TILE_SIZE * (this.game.time.elapsed / 350); + } + } +}; + +Player.prototype.handleMotionInput = function(level) { + var levelGridData = level.data; + + if (this.game.input.keyboard.isDown(Phaser.Keyboard.UP)) { + this.moveUp(levelGridData); + } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) { + this.moveDown(levelGridData); + } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) { + this.moveLeft(levelGridData); + } else if (this.game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) { + this.moveRight(levelGridData); } else { - moving = false; - this.freeze(); + this.stop(); } - if(moving) { + // console.log(this.x, this.y, this.column, this.row); + + if (this.isMoving) { this.animations.play(this.facing); } }; @@ -101,7 +157,8 @@ Player.prototype.handleBombInput = function() { } }; -Player.prototype.freeze = function() { +Player.prototype.stop = function() { + this.isMoving = false; this.body.velocity.x = 0; this.body.velocity.y = 0; this.animations.stop(); @@ -112,12 +169,12 @@ Player.prototype.canDropBombs = function(bombsPool) { }; Player.prototype.resetForNewRound = function(x, y, key, frame) { - this.x = this.x; - this.y = this.y; - this.facing = "down"; - this.alive = true; - this.maxBombs = 2; - this.bombStrength = 1; - this.score = 0; - this.speed = DEFAULT_PLAYER_SPEED; - }; + this.x = this.x; + this.y = this.y; + this.facing = 'down'; + this.alive = true; + this.maxBombs = 2; + this.bombStrength = 1; + this.score = 0; + this.speed = DEFAULT_PLAYER_SPEED; +}; diff --git a/scripts/states/game.js b/scripts/states/game.js index 6d4bfdd..90458ef 100755 --- a/scripts/states/game.js +++ b/scripts/states/game.js @@ -1,13 +1,13 @@ function Game() { - this.nextBomb = 0; - this.bombRate = 500; + this.nextBomb = 0; + this.bombRate = 500; } Game.prototype = { loadLevel: function(index) { var levels = this.game.cache.getJSON('levels'), - levelsIndex = index - 1, - level = levels[levelsIndex]; + levelsIndex = index - 1, + level = levels[levelsIndex]; this.map = this.add.tilemap('level_' + index); this.map.addTilesetImage(level.title, level.tileset); @@ -67,15 +67,15 @@ Game.prototype = { this.availableSpaces = availableSpaces; var font = { - font: '15px "Pokemon Regular"', - fill: '#ffffff', - stroke: '#000000', - strokeThickness: 4, - align: 'center', - }; + font: '15px "Pokemon Regular"', + fill: '#ffffff', + stroke: '#000000', + strokeThickness: 4, + align: 'center', + }; //Player - var pos=this.availableSpaces[this.availableSpaces.length - 1]; + var pos = this.availableSpaces[this.availableSpaces.length - 1]; this.player = new Player(this.game, 14, 0, 'red', 0); this.bombs = this.game.add.group(); @@ -91,7 +91,6 @@ Game.prototype = { }, update: function() { - // this.enemyPool.children[0].easyStarMovement(this.player,this.level); this.physics.arcade.collide(this.player, this.rocks); this.physics.arcade.collide(this.enemyPool, this.rocks); this.physics.arcade.collide(this.player, this.enemyPool); @@ -103,79 +102,69 @@ Game.prototype = { this.player.handleMotionInput(this.level); this.player.handleBombInput(); - if (this.player.bombButtonJustPressed && this.player.canDropBombs(this.bombsPool) && this.time.now > this.nextBomb) { this.createBomb(this.player.x + this.player.width / 2, this.player.y + this.player.height / 2, this.keyBomb, 0); } - if(!this.player.alive){ + if (!this.player.alive) { this.state.start('GameOver'); } - //this.enemyDropBomb(); + if (this.player.isMoving) { + this.enemyPool.callAll('easyStarMovement', null, this.player, this.level); + } + //this.enemyDropBomb(); }, - enemyDropBomb: function(enemy){ - //var enemyRandom = getRandomInt(0,this.enemyPool.children.length-1); - //if (this.enemyPool.children[enemyRandom].canDropBombs(this.bombsPool) - //&& this.time.now > this.nextBomb - //&& this.enemyPool.children[enemyRandom].alive) { - // this.createBomb(this.enemyPool.children[enemyRandom].x + this.enemyPool.children[enemyRandom].width / 2, this.enemyPool.children[enemyRandom].y + this.enemyPool.children[enemyRandom].height / 2, this.keyBomb, 0); - //} - var range = 64; - console.log("EnemigoX: " +enemy.x); - console.log("EnemigoY: " +enemy.y); - console.log("PlayerX: " +this.player.x); - console.log("PlayerY: " +this.player.y); - if(enemy.alive && enemy.canDropBombs(this.bombsPool) && this.time.now > this.nextBomb) - { - if((enemy.x<=this.player.x && enemy.x+range>=this.player.x )|| (enemy.x>=this.player.x && enemy.x-range<=this.player.x )) - if((enemy.y<=this.player.y && enemy.y+range>=this.player.y )|| (enemy.y>=this.player.y && enemy.y-range<=this.player.y )) - this.createBomb(enemy.x + enemy.width / 2, enemy.y + enemy.height / 2, this.keyBomb, 0); - } - }, - handleEnemyMovement: function(){ - for (var i = 0, len = this.enemyPool.children.length; i < len; i++) { - // var rocksColliding = this.getRocksColliding(this.enemyPool.children[i].x, this.enemyPool.children[i].y); - // var enemy = this.enemyPool.children[i]; - // this.enemyDropBomb(enemy); + enemyDropBomb: function(enemy) { + //var enemyRandom = getRandomInt(0,this.enemyPool.children.length-1); + //if (this.enemyPool.children[enemyRandom].canDropBombs(this.bombsPool) + //&& this.time.now > this.nextBomb + //&& this.enemyPool.children[enemyRandom].alive) { + // this.createBomb(this.enemyPool.children[enemyRandom].x + this.enemyPool.children[enemyRandom].width / 2, this.enemyPool.children[enemyRandom].y + this.enemyPool.children[enemyRandom].height / 2, this.keyBomb, 0); + //} + var range = 64; + // console.log("EnemigoX: " +enemy.x); + // console.log("EnemigoY: " +enemy.y); + // console.log("PlayerX: " +this.player.x); + // console.log("PlayerY: " +this.player.y); + if (enemy.alive && enemy.canDropBombs(this.bombsPool) && this.time.now > this.nextBomb) + { + if((enemy.x<=this.player.x && enemy.x+range>=this.player.x )|| (enemy.x>=this.player.x && enemy.x-range<=this.player.x )) + if((enemy.y<=this.player.y && enemy.y+range>=this.player.y )|| (enemy.y>=this.player.y && enemy.y-range<=this.player.y )) + this.createBomb(enemy.x + enemy.width / 2, enemy.y + enemy.height / 2, this.keyBomb, 0); } - }, addEnemy: function(enemyID) { - var currentEnemy = this.enemyPool.getFirstExists(false), positionIndex = this.game.rnd.between(0, this.availableSpaces.length - 1), - position = this.availableSpaces[positionIndex]; - var finalPos; - if(enemyID ==1) - { - finalPos = this.availableSpaces[this.availableSpaces.length - 1]; - } - else if(enemyID ==2) - { - finalPos = this.availableSpaces[this.availableSpaces.length - 1]; - finalPos.x=0; - } - else if(enemyID ==3) - { - finalPos = this.availableSpaces[this.availableSpaces.length - 1]; - finalPos.y=0; + position = this.availableSpaces[positionIndex], + finalPos; + + switch (enemyID) { + case 1: + finalPos = this.availableSpaces[this.availableSpaces.length - 1]; + break; + case 2: + finalPos = this.availableSpaces[this.availableSpaces.length - 1]; + finalPos.x = 0; + break; + case 3: + finalPos = this.availableSpaces[this.availableSpaces.length - 1]; + finalPos.y = 0; + break; } -//if (!currentEnemy) { - currentEnemy = new Enemy(this.game, finalPos.x, finalPos.y); + currentEnemy = new Enemy(this.game, finalPos.x, finalPos.y); - this.enemyPool.add(currentEnemy); - //} - // else { - // currentEnemy.reset(position.x * 32, position.y * 32 - 4); - // } + this.enemyPool.add(currentEnemy); + + currentEnemy.easyStarMovement(this.player, this.level); }, createBomb: function(x, y, key, frame) { - var rocksColliding = this.getRocksColliding(x, y); + var rocksColliding = this.getRocksColliding(x, y), + currentBomb = this.bombsPool.getFirstExists(false); - var currentBomb = this.bombsPool.getFirstExists(false); this.nextBomb = this.time.now + this.bombRate; if(!currentBomb) { @@ -202,27 +191,27 @@ Game.prototype = { }, getRocksColliding: function(x, y) { var column = Math.floor(x / 32), - row = Math.floor(y / 32), - rocksColliding = { - up: true, - down: true, - left: true, - right: true - }; + row = Math.floor(y / 32), + rocksColliding = { + up: true, + down: true, + left: true, + right: true + }; if(row - 1>=0 && column>=0){ if (this.rocks.layer.data[row - 1] !== undefined && this.rocks.layer.data[row - 1]) { - rocksColliding.up = (this.rocks.layer.data[row - 1][column].index === this.level.rockId); - } - } + rocksColliding.up = (this.rocks.layer.data[row - 1][column].index === this.level.rockId); + } + } else { rocksColliding.up = true; } - if(column>=0){ + if(column>=0){ if (this.rocks.layer.data[row + 1] !== undefined && this.rocks.layer.data[row + 1]) { - rocksColliding.down = (this.rocks.layer.data[row + 1][column].index === this.level.rockId); - } + rocksColliding.down = (this.rocks.layer.data[row + 1][column].index === this.level.rockId); + } } else { @@ -230,7 +219,7 @@ Game.prototype = { } if(column - 1>=0 && row>=0){ if (this.rocks.layer.data[row][column - 1] !== undefined && this.rocks.layer.data[row][column - 1]) { - rocksColliding.left = (this.rocks.layer.data[row][column - 1].index === this.level.rockId); + rocksColliding.left = (this.rocks.layer.data[row][column - 1].index === this.level.rockId); } } else @@ -250,11 +239,11 @@ Game.prototype = { return rocksColliding; }, resetPlayer: function() { - this.player.resetForNewRound(); + this.player.resetForNewRound(); }, clearBombs: function() { for(var bombId in this.bombsPool) {//TODO: add detonate timer ID - //clearTimeout(this.bombsPool[bombId].detonateTimerID); + //clearTimeout(this.bombsPool[bombId].detonateTimerID); } this.bombsPool = {}; }, @@ -265,8 +254,8 @@ Game.prototype = { calculateRoundWinner: function() { if(this.player.alive) { - if(this.enemyPool.count == 0) - this.showGameStatusAndReset(); + if(this.enemyPool.count == 0) + this.showGameStatusAndReset(); } }, showGameStatusAndReset: function() { @@ -274,5 +263,4 @@ Game.prototype = { getRandomInt:function(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } - -}; +}; \ No newline at end of file