2/6/25

I started creating a new level for the game. I renamed the original GameLevelDesert to GameLevelMap and made another file for a desert level. I also added in the background image for that level.

Image

2/7/25

I added in a function and made a flip property for npcs to flip the robot sprite for GameLevelDesert to face the other direction so that it would be facing towards the player.

This is the code of the function in Character.js Image

Here is the flip property in the sprite data for the robot in GameLevelDesert Image

Then I made a mountain level.

2/7 - 2/10

After making the mountain level I made the ice level. Then for each level besides the map level I changed the starting location of the player to line up with the ground.

Then I added this conditional into the handleKeyDown function in Player.js to restrict the movement of the player so they can only move side to side in all the other levels except GameLevelMap. Image This was so the player can only walk on the ground and not into the sky.

2/10 - 2/12

I changed the locations of the npcs on the map to be in different areas that correspond to the level they’re in.

Before Image

After Image

Additionally I ended up creating a BackgroundObject class for the ice under the Tux npc. Image Image

2/12 - 2/20

Over the next few days I worked on making it so when the player gets close to the npc on the map, they will get transported to the corresponding level for the area.

I had to create an empty transitionNPCS property in GameControl, and also ended up having to change the way I had the npcs defined in GameLevelMap.

Image

Then I had to add the targetLevel property to the sprite data for GameLevelMap, and edit Npc.js so that all Npcs have the targetLevel property. This has the level that the sprite’s dimensions/hitbox should trigger the transition to. For this I also had to add a name property to each of the game levels.

The rest of the changes were in GameControl, where transitionNPCS and targetLevel would now be used/referenced.

These are the new functions I added, handleNPCTransition for the actual level transitions and checkTransitions to see if the player is in the transition areas and then run handleNPCTransition. Image Image

I also had to edit loadLevel and loadLevelObjects to have transitionNPCS and to load the targetLevel. Image Image

I also had to add checkTransitions to be used in the gameLoop. I had to do a lot of troubleshooting trying and testing different things before I got it to work.

While troubleshooting I had to add to/edit Npc.js in order to resolve the sprites being made twice and to fix the collisions between the player and the npc transition areas which wasn’t working before. Image Here the npcs now get assigned a new unique id each time they’re made, as part of the issue seemed to be because of duplicate ids/objects. As well as the additional hitbox calculations and collision dimensions since the hitbox values had been coming back as 0 before.

I also had to do the something similar in Player.js Image

2/20 - 2/24

After finishing the transitions from the map/npcs into their corresponding levels, then I worked on being able to go back after completing the quiz from the npc. Originally I was going to do more with the quiz but I ended up opting for something simpler due to time as well as it also seeming more complicated.

First I worked on making a function that checked for quiz completion. Before I could do that I had to find a way to track quiz completion. So I created GameState.js

Image

quizCompleted is what is being used to track if the quiz was submitted or not. So I then added it to Prompt.js in the handleSubmit() with GameState.quizCompleted being set to true. Image

Then I could make the checkquizCompletion function in GameControl, which ends the level if the quiz has been submitted. Image

Then I made the routeToMapLevel function to load GameLevelMap after quiz completion. Image

This function just loaded the map level and destroyed the objects from the previous level. In order to have it run after quiz completion I ended up editing the gameLoop. Image

The very last thing I finished changing was simply just adding another browser text prompt at the start of the map level with a bit of guidance/directions on what the player is supposed to do. Image

These were all the main changes I managed to complete with the time we had.