Day 25: Coding a Game Part 4 Monsters

Dan Esmail - 1/25/2023

Intro

As I get closer to having something functional I need to start taling about how I'm going to be summoning monsters to the board. Right now this looks like a green square but down the road it might be something more complex. There are a lot of things to think about with this. Like how many can fit on board, if there is an open space, and more.

First lets talk about finding an open space for a monster to be drawn to the board. This is one of the reason I made the game board array. This helps me tell the system what is open and what is occupied. That's where I will bring up the first function find random open space.


JS
Find Random Open Space Function

                
                    
      
  function findRandomOpenSpace(arr){
  let row = random(0,3);
  let column = random(0,3);
  let spot = []
  if (arr[row][column] == 'open') {
    spot.push(row);
    spot.push(column);
    return spot;
  }else{
    return 'fail';
  }

}

            
      
                
            

This function takes in an array. This array will be the game board that has already been updated by the game board update function. If you remember that function goes through the game board array and writes closed for any tile that is occupied by the player or a monster. Now after that the function will take a random number from zero to three. This will be for both rows and columns. Then it will look at the array and if it's close it will return a fail. This is important because if nothing is open I don't want to draw more monsters.


JS
Draw Monster Function

                
                    
      
function drawMonsters(arr){
  if (arr.length == 0) {
  }else{
    for (var i = 0; i < arr.length; i++) {
      arr[i].draw(ctx)
    }
  }
}

            
      
                
            

This function takes in an array. This array will be the game board that has already been updated by the game board update function. If you remember that function goes through the game board array and writes closed for any tile that is occupied by the player or a monster. Now after that the function will take a random number from zero to three. This will be for both rows and columns. Then it will look at the array and if it's close it will return a fail. This is important because if nothing is open I don't want to draw more monsters.


JS
Draw Monster Function

                
                    
      
function drawMonsters(arr){
  if (arr.length == 0) {
  }else{
    for (var i = 0; i < arr.length; i++) {
      arr[i].draw(ctx)
    }
  }
}

            
      
                
            

Talking about creating the monster we need a function that will create all the new monster. This is going to be done with the create monster function. This function will take in the arguments that are needed for the monster class constructor, and the monster array. This will take the length of the monster array and give it to the new monster for it's ID. then it will create a new monster giving it the ID and drawing it's card to the monster column in HTML. Now we can put all of those function together and make a final function for creating monster!

Talking about creating the monster we need a function that will create all the new monster. This is going to be done with the create monster function. This function will take in the arguments that are needed for the monster class constructor, and the monster array. This will take the length of the monster array and give it to the new monster for it's ID. then it will create a new monster giving it the ID and drawing it's card to the monster column in HTML. Now we can put all of those function together and make a final function for creating monster!


Day 1

Day 1