Intro
The game has finally gotten to a place where it can be played in a basic version on the desktop. Now that is considered done for the time being. There will be a lot more added throughout the time that I program but for now, I would like to move on to something else. This could be data visualization, PHP forms, or even javascript cookies. At this time though let's talk about the final additions I have made to the magic attack this time.
Setting up the game loop
With my game one thing I haad to do was set up turn for the player and the monster to do this. I set up a game status variable that would switch the game back and forth between the player and the monsters. Turning over the game after moves and attack from the player. I made sure that everything would be run through an update function that would happen everytime the game had to update.
Update game
function updateGame(){
clearCanvas()
drawboard()
player.draw(ctx)
drawMonsters(monArr)
if (monArr.length == 0) {
createNewMonsters(3,3)
}
if (gameStatus == 0) {
monstersTurn(monArr)
upKeep()
player.pullCard();
player.moves = player.speed;
gameStatus = 1;
}
}
This code would execute a few things when run. First off it would clear the canas and draw the board everytime the game updates. Next would be the players draw function. With this in mind the monster in the monster array would all be drawn to the game too. Also this function looks at the board and if there are no monsters it adds three more. Now after this is were the game turns comes into player with the monsters turn function and the up keep function.
Monsters Turn and find player function
function monstersTurn(arr){
for (var i = 0; i < arr.length; i++) {
arr[i].findPlayer(player)
}
findPlayer(target){
let monsterX = cordToNum(this.x);
let monsterY = cordToNum(this.y);
let playerX = cordToNum(target.x);
let playerY = cordToNum(target.y);
let xAway = monsterX - playerX;
let yAway = monsterY - playerY;
if (xAway + yAway == 1 || xAway + yAway == -1) {
this.attackPlayer(xAway,yAway)
}else{
this.move(xAway,yAway)
}
}
}
This code would execute a few things when run. First off it would clear the canas and draw the board everytime the game updates. Next would be the players draw function. With this in mind the monster in the monster array would all be drawn to the game too. Also this function looks at the board and if there are no monsters it adds three more. Now after this is were the game turns comes into player with the monsters turn function and the up keep function.
Monsters Turn and find player function
function monstersTurn(arr){
for (var i = 0; i < arr.length; i++) {
arr[i].findPlayer(player)
}
findPlayer(target){
let monsterX = cordToNum(this.x);
let monsterY = cordToNum(this.y);
let playerX = cordToNum(target.x);
let playerY = cordToNum(target.y);
let xAway = monsterX - playerX;
let yAway = monsterY - playerY;
if (xAway + yAway == 1 || xAway + yAway == -1) {
this.attackPlayer(xAway,yAway)
}else{
this.move(xAway,yAway)
}
}
}
The monsters turn function would use the monster's find player function to tell the monsters what to do. First the find player function breaks down where the player is and where the monster is. If the player is within one space away from the monster it would attack the player. If the monster was farther it would move to the player.
The monsters turn function would use the monster's find player function to tell the monsters what to do. First the find player function breaks down where the player is and where the monster is. If the player is within one space away from the monster it would attack the player. If the monster was farther it would move to the player.
