NeoCade Devlog #5: bulding the pacman game

This session was about adding the third cgame to neocade. Originally i was going to add Asteroids but i changed my mind and added pacman instead. While building pacman, i initially just wanted to add an iframe to the original pacman game from somewhere but i hcanged my mind and wanted to build the entire thing myself. Here is what i buildt, how i build it, and the challenges i faced:

What i made:

As i just said i built a pacman game which includes:

• an array that renders as a map depending on the number (you’ll see what i mean)
• four ghosts that move around the map.
• scores, winning, and power pellet, normal pellets, and stuff like that
• different difficulties

How i made it:

The entire game runs on a grid. During building this, instead of placing walls and pellets manually one by one, i generated the map from a simple grid of numbers (the array i was talking about earlier) where 1 is a wall, 0 is a normal dot, 2 are ghosts, and 3 is a power pellet.

The game works in such a way that it whenever the pacman moves, the game clears the screen, redraws the map, calculates any collisions against walls or ghots using maths (pythagoras), and updates everyone’s positions. Also, to keep the code clean, the ghosts are grouped into a array, which makes everyhing so much easier because instead of me having to manually change something for each and every ghost, i can just use the js forEach() function to just apply the changes to all of them easily.

Challenges i faced:

Challnge 1:

I initially tried to control pac-man using normal movement where the pacman move pixel by pixel. BUt the problem was that when i pressed up to turn a corner, if pacman was even a bit off-center from the hallway, he would jump to the center of the hallway and then perfectly rotate and then continue moving. THis looked kinda annoying and badly made so i had to fix this.

To fix this, i built this function whic now calculates the exact center of the current grid square. And if i try to turn, the game checks if pacman is close enough it would allow the turn but if it isnt, the turn wouldnt register

Challenge 2:

When i first made the moving and turning parts, i made the game to remember my intended turn forever. Why? because when i played pacman to see what i owuld have to build, the pacman responded to my turn even though i was a bit behind the corner. SO i made it that if I pressed up halfway down a long corridor, the game would remember that input and forcefully turn pacman upwards the moment he reached the next intersection which was a bit later. But the thing was it felt like playing on autopilot and it felt weird.

So i gave the controls a this sort of buffer time where when a key is pressed (like up or down), it is only remembered for about a quarter of a second. If I press the key right before a turn where he isn’t aligned with the hallway yet, the pacman turns properly a quarter of a second later. If I press it too early, the command simply expires, and he continues driving straight.

Challenge 3

Another challenge that i faced was when i madae the power pellet aspect of the game. The problem was when a power pellet was eaten, I forced all ghosts to turn blue as long as the power pellet was active. But if pacman ate a ghost, it would respawn in the center box and immediately turn blue again because the timer was still running. It looked safe to eat cus it was blue, but when i tried eating it, i died.

To fix this, i added a variable called isVulnerable that every ghost has. Now, the game only paints a ghost blue if isVariable is true. The moment a ghost is eaten, it flips to false, and it spawns normally in its normal color.