Upit | Learn about creating the game Hit the slopes with gen AI

Play

Hit the slopes

octo

Hittheslopes684

46K

10mo

Playit

Aim, strike, score! Use limited hits for the ultimate slope-striking fun.

#puzzlegame

#arcade

#bubblepop

#casualgaming

#christmas2023

#skillbased

#hypercasual

Creation History

User prompt

add a small red circle in the center of the screen. this shouldn't be too small or too large, maybe make it 300 pixels wide

User prompt

add a circle in the center of the screen

User prompt

instead of removing a live from the UI, make it all black

User prompt

all lives in the UI update correctly except the last one

User prompt

all lives in the UI update correctly except the last one

User prompt

all lives in the UI update correctly except the last one

User prompt

Ensure Proper Indexing: Check that the indexing of self.bubbles aligns correctly with the lives count. Remember that array indexing is zero-based, so the last life corresponds to the index lives - 1.

User prompt

Verify Bubble Visibility Handling: In the updateBubbles method, the condition i < lives is used to set the visibility of each bubble. Confirm that this logic correctly handles the case when lives is 0 (i.e., all bubbles should be invisible).

User prompt

Review Life Update Call: After decrementing a life, ensure that bubbleUI.updateBubbles(self.lives); is called to update the UI. This call should happen immediately after the self.lives--; statement.

User prompt

Check Lives Decrement Logic: In the Game class, make sure the lives variable is decremented correctly every time a bubble is shot. This logic seems to be in place, but verify that it's decrementing properly.

User prompt

Inspect the updateBubbles Method: The updateBubbles method in the BubbleUI class is responsible for updating the UI to reflect the current number of lives. Ensure this method correctly updates the visibility of each bubble based on the lives parameter.

User prompt

can you fix the issue by updated your fix for that last live not updating correctly?

User prompt

the last live in the UI doesn't update. it never gets removed. all other lives in the UI disappear immediately after a bubble is shot, except the last one

User prompt

double the rotation speed of the cannon

User prompt

the game stopped advancing to the next level after your last change

User prompt

wait until the current shot bubble has hit the edge of the screen before advancing to the next level

User prompt

double the rotation speed of the cannon

User prompt

✅ Deduct a life from the UI immediately when a bubble is shot

User prompt

the lives system updates perfectly, up until the last live, which is never deducted from the UI. make sure the UI updates as soon as a bubble has been shot

User prompt

the lives system updates perfectly, up until the last live, which is never deducted from the UI. make sure the UI updates as soon as a bubble has been shot

User prompt

increase the size of the lives by 50%

User prompt

Fix Bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'width')' in this line: 'var totalWidth = 5 * (bubble.width + 10) - 10;' Line Number: 5

User prompt

great, now let's arrange this lives UI to look more nicely. make sure it is aligned to the middle of the screen

User prompt

now let's create an UI at the bottom of the screen, where we display all 5 available bubbles per level. after a bubble is short, remove one of the bubbles from the ui. remove them from left to right

User prompt

now let's add a lives system to the game. players only have 5 lives per level. when a bubble is shot, one live is deducted. thus players have 5 shots per level to clear the entire level of all the skaters. if they manage to destroy all the skaters using the 5 bubbles or less, they advance to the next level. upon advancement to the next level, all the lives are reset back to 5. so if the player had any remaining lives remaining, those are removed and 5 new ones are refilled. the game checks for the state of the game when the bubble's hit the edge of the screen. if the last 5th bubble has hit the edge of the screen and theres' still skaters present, end the game

===================================================================
--- original.js
+++ change.js
@@ -74,9 +74,9 @@
 	var cannonSize = Math.min(shooterGraphics.width, shooterGraphics.height) * 0.75;
 	shooterGraphics.width = cannonSize;
 	shooterGraphics.height = cannonSize;
 	self.rotate = function () {
-		self.rotationAngle += 0.02;
+		self.rotationAngle += 0.04;
 		if (self.rotationAngle >= 2 * Math.PI) {
 			self.rotationAngle = 0;
 		}
 		self.rotation = self.rotationAngle;