Upit | Learn about creating the game The Road Runner with gen AI

Play

The Road Runner

h3katonkheir

TheRoadRunner

621

Playit

Ready, set, go! Navigate uneven terrain and fight against fatigue in this grand race to the finish line.

#athletics

#endlessrunner

#racing

#arcade

Creation History

Code edit (1 edits merged)

Please save this source code

User prompt

Please fix the bug: 'ReferenceError: body is not defined' in or related to this line: 'armLeft.x = -body.width / 2 + armOffsetX;' Line Number: 120

User prompt

rename the "body" asset to "torso" and rename any usages

Code edit (3 edits merged)

Please save this source code

User prompt

after creating the body asset in the character class, add a head asset with an anchor of 0.35, 0.95

Code edit (2 edits merged)

Please save this source code

User prompt

Please fix the bug: 'TypeError: self.getAsset is not a function' in or related to this line: 'var body = self.getAsset('body', {});' Line Number: 99

Code edit (10 edits merged)

Please save this source code

User prompt

Please fix the bug: 'TypeError: cyclic object value' in or related to this line: 'self.attachAsset(body, {});' Line Number: 106

Code edit (1 edits merged)

Please save this source code

Code edit (1 edits merged)

Please save this source code

User prompt

in the character update method, call the update method of the right and left arms, using the runAlpha as the alpha value

User prompt

Add a runAlpha variable to the Character class and increase its value by 0.02 in the update method, additionally, reduce the value by 1 if the value is >= 1

User prompt

Add a runAlpha variable to the Character class and increase its value in the update method

User prompt

Add an alpha = 0 variable to the character and increase its value by 0.02 in the update method reducing the value by 1 if it's value >= 1

User prompt

add an arm swinging animation to the CharacterArm's update function, these should be constructed from sinusoidal equations based on the alpha

User prompt

The CharacterArm and CharacterLeg classes should have empty update methods that takes in an alpha value

User prompt

Create an CharacterArm class and a CharacterLeg class, these should contain the respective upper and lower component images instead of the Character class

User prompt

add a basic running animation to the character in the update method

User prompt

the character should have 2 legs and 2 arms

User prompt

add an ontick even to the game which should call the created character's update method

User prompt

add an empty update function to the character class

User prompt

display a character in the middle of the screen

User prompt

Create a Character class that's a side-view of a person. It should be composed of different individual body parts: upper and lower arms, upper and lower legs, and the body (which will include the head).

User prompt

Remove all the code in the game

/**** 
* Classes
****/ 
var Character = Container.expand(function () {
	var self = Container.call(this);
	// Create and attach body parts
	var body = self.attachAsset('body', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var armLeft = self.addChild(new CharacterArm());
	var armRight = self.addChild(new CharacterArm());
	var legLeft = self.addChild(new CharacterLeg());
	var legRight = self.addChild(new CharacterLeg());
	// Position body parts
	body.x = 0;
	body.y = 0;
	armLeft.x = -body.width / 2;
	armLeft.y = -body.height / 2;
	armRight.x = body.width / 2;
	armRight.y = -body.height / 2;
	legLeft.x = -body.width / 4;
	legLeft.y = body.height / 2;
	legRight.x = body.width / 4;
	legRight.y = body.height / 2;
	// Add an empty update function to the Character class
	self.update = function () {};
});
var CharacterArm = Container.expand(function () {
	var self = Container.call(this);
	// Create and attach arm parts
	var upperArm = self.attachAsset('upperArm', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var lowerArm = self.attachAsset('lowerArm', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	// Position arm parts
	upperArm.x = 0;
	upperArm.y = 0;
	lowerArm.x = upperArm.x;
	lowerArm.y = upperArm.y - upperArm.height;
	// Add an empty update function to the CharacterArm class that takes in an alpha value
	self.update = function (alpha) {};
});
var CharacterLeg = Container.expand(function () {
	var self = Container.call(this);
	// Create and attach leg parts
	var upperLeg = self.attachAsset('upperLeg', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var lowerLeg = self.attachAsset('lowerLeg', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	// Position leg parts
	upperLeg.x = 0;
	upperLeg.y = 0;
	lowerLeg.x = upperLeg.x;
	lowerLeg.y = upperLeg.y + upperLeg.height;
	// Add an empty update function to the CharacterLeg class that takes in an alpha value
	self.update = function (alpha) {};
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x000000
});

/**** 
* Game Code
****/ 
var character = game.addChild(new Character());
// Position character at the center of the screen
character.x = 2048 / 2;
character.y = 2732 / 2;
// Add an ontick event to the game which calls the character's update method
LK.on('tick', function () {
	character.update();
});

===================================================================
--- original.js
+++ change.js
@@ -41,8 +41,10 @@
 	upperArm.x = 0;
 	upperArm.y = 0;
 	lowerArm.x = upperArm.x;
 	lowerArm.y = upperArm.y - upperArm.height;
+	// Add an empty update function to the CharacterArm class that takes in an alpha value
+	self.update = function (alpha) {};
 });
 var CharacterLeg = Container.expand(function () {
 	var self = Container.call(this);
 	// Create and attach leg parts
@@ -58,8 +60,10 @@
 	upperLeg.x = 0;
 	upperLeg.y = 0;
 	lowerLeg.x = upperLeg.x;
 	lowerLeg.y = upperLeg.y + upperLeg.height;
+	// Add an empty update function to the CharacterLeg class that takes in an alpha value
+	self.update = function (alpha) {};
 });
 
 /**** 
 * Initialize Game

Showing 551 to 575 of 576

1 ...18 19 20 21 22 23 24

Images

circle sliced into many pieces, flat image.
2d, white background, shadowless.

pixel art of a tall, tree.
game asset, 2d, white background, shadowless.

Pixel art street lamp.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.

pixel art cloud.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.

pixel art sun.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.

Most played remixes

Main