:quality(85)/https://cdn.frvr.ai/66316ddec5464eadd658b7e4.png)
:quality(85)/https://cdn.frvr.ai/655b288f597f3636fb3c35f2.jpg)
:quality(85)/https://cdn.frvr.ai/66316e49c5464eadd658b7f2.png)
#athletics
#endlessrunner
#racing
#arcade
Creation History
Code edit (1 edits merged)
Please save this source code
Code edit (1 edits merged)
Please save this source code
Code edit (21 edits merged)
Please save this source code
User prompt
before attaching the roadSegment asset to the RoadSegment class, attach an empty Container class
User prompt
rename the sign0 asset to tree0
Code edit (1 edits merged)
Please save this source code
Code edit (1 edits merged)
Please save this source code
Code edit (1 edits merged)
Please save this source code
Code edit (12 edits merged)
Please save this source code
User prompt
In the RoadSegment's transition function, use the stepChance var to determine stepUp and stepDown booleans calculated from the chance of stepChance succeeding
Code edit (1 edits merged)
Please save this source code
User prompt
Add a circle asset to the road class after the segment creation; with a width and height of 500, black tint, and anchor of 0.5,0.5
User prompt
Please fix the bug: 'TypeError: self is undefined' in or related to this line: 'var circle = self.attachAsset('circle', {' Line Number: 221
User prompt
Add a circle asset to the road class after the segments, with a width and height of 500, black tint, and anchor of 0.5,0.5
User prompt
remove the 2nd, duplication segment construction snippet
User prompt
Move the circle construction under the segment creation
User prompt
Add a circle asset to the road class with a width and height of 500, black tint, and anchor of 0.5,0.5
User prompt
change the background colour to sky blue
User prompt
segment.rotation should be in radians
User prompt
create two new classes: A RoadSegment class that contains the roadSegment asset (with anchor of 0,1), and a Road class containing 30 RoadSegments equally rotated around the origin. Then create and show a Road instance in the middle of the screen
Code edit (1 edits merged)
Please save this source code
Code edit (3 edits merged)
Please save this source code
User prompt
Please fix the bug: 'TypeError: alpha is undefined' in or related to this line: 'numberText.setText(alpha.toFixed(1));' Line Number: 67
Code edit (2 edits merged)
Please save this source code
User prompt
display a number text in the top center of the screen
/****
* Classes
****/
/**
* config {
* x : Number || 0,
* y : Number || 0,
* rotation : Number || 0,
* }
**/
var ConfigContainer = Container.expand(function (config) {
var self = Container.call(this);
config = config || {};
;
self.x = config.x || 0;
self.y = config.y || 0;
self.rotation = config.rotation || 0;
if (config.scale !== undefined || config.scaleX !== undefined || config.scaleY !== undefined) {
var scaleX = config.scaleX !== undefined ? config.scaleX : config.scale !== undefined ? config.scale : 1;
var scaleY = config.scaleY !== undefined ? config.scaleY : config.scale !== undefined ? config.scale : 1;
self.scale.set(scaleX, scaleY);
}
;
return self;
});
var RoadSegment = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
var backgroundContainer = self.addChild(new Container());
var backgroundOld = undefined;
var backgroundNew = backgroundContainer.addChild(new Container());
self.attachAsset('roadSegment', {
anchorX: 1,
anchorY: 1
});
self.attachAsset('roadSegment', {
anchorX: 1,
anchorY: 1,
scaleX: 0.95,
scaleY: 0.95,
tint: 0x555555
});
if (config.index % 3 === 0) {
attachAssetRadial(self, 'square', {
offset: 100,
width: 100,
height: 10,
anchorR: 0.5,
anchorX: 0.5,
anchorY: 0.5
});
}
;
self.update = update;
self.transition = transition;
self.scaling = config.scale;
self.stepHeight = config.scale * ROAD_SEGMENT_HEIGHT;
self.stepChance = config.stepChance;
self.previous = config.previous;
;
function attachAssetRadial(parent, asset, obj) {
var offsetTotal = ROAD_SEGMENT_HEIGHT - (obj.offset || 10);
var rotation = -(1 - obj.anchorR) * ROAD_SEGMENT_ANGLE;
parent.attachAsset(asset, {
x: Math.sin(rotation) * offsetTotal,
y: Math.cos(rotation) * -offsetTotal,
width: obj.width,
height: obj.height,
anchorX: obj.anchorX,
anchorY: obj.anchorY,
scaleX: obj.scaleX || 1,
scaleY: obj.scaleY || 1,
rotation: (obj.rotation || 0) + rotation
});
}
function generateBackground() {
var plantCount = Math.floor(Math.random() * (ROAD_GEN_PLANT_MAX + 1));
if (Math.random() < ROAD_GEN_TREE_CHANCE) {
var treeIndex = Math.floor(Math.random() * ROAD_GEN_TREE_ASSETS);
var scale = 0.9 + 0.2 * Math.random();
attachAssetRadial(backgroundNew, 'tree' + treeIndex, {
anchorR: 0.4 + 0.2 * Math.random(),
anchorX: 0.5,
anchorY: 1,
scaleX: scale,
scaleY: scale
});
}
for (var i = 0; i < plantCount; i++) {
var plantIndex = Math.floor(Math.random() * ROAD_GEN_PLANT_ASSETS);
var scale = 0.9 + 0.2 * Math.random();
attachAssetRadial(backgroundNew, 'plant' + plantIndex, {
anchorR: 0.1 + 0.8 * Math.random(),
anchorX: 0.5,
anchorY: 1,
scaleX: Math.random() < 0.5 ? -scale : scale,
scaleY: scale
});
}
}
function transition(instant) {
var stepChance = self.previous.stepChance;
var stepUp = self.previous.scaling < ROAD_SCALE_MAX ? Math.random() < self.stepChance : false;
var stepDown = self.previous.scaling > ROAD_SCALE_MIN ? Math.random() < self.stepChance : false;
if (stepUp || stepDown) {
if (stepUp && stepDown) {
if (Math.random() < 0.5) {
stepDown = false;
} else {
stepUp = false;
}
}
self.scaling = self.previous.scaling += ROAD_SCALE_STEP * (stepUp ? 1 : -1);
self.stepChance = ROAD_STEP_CHANCE_BASE;
} else {
self.scaling = self.previous.scaling;
self.stepChance = self.previous.stepChance + ROAD_STEP_CHANCE_INCREMENT;
}
generateBackground();
self.scale.set(self.scaling);
self.stepHeight = config.scale * ROAD_SEGMENT_HEIGHT;
}
function update() {}
});
var Road = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
var segments = [];
var segmentAngle = ROAD_SEGMENT_ANGLE;
for (var i = 0; i < ROAD_SEGMENT_COUNT; i++) {
var segment = segments[i] = self.addChild(new RoadSegment({
index: i,
previous: i > 0 ? segments[i - 1] : undefined,
rotation: i * segmentAngle,
stepChance: ROAD_STEP_CHANCE_BASE,
scale: ROAD_SCALE_BASE
}));
if (i === ROAD_SEGMENT_COUNT - 1) {
segments[0].previous = segment;
}
if (i >= ROAD_FREE_RUN_COUNT) {
segment.transition(true);
}
}
self.attachAsset('circle', {
width: 500,
height: 500,
tint: 0x222222,
anchorX: 0.5,
anchorY: 0.5
});
self.attachAsset('circle', {
width: 485,
height: 485,
tint: 0x87CEEB,
anchorX: 0.5,
anchorY: 0.5
});
;
self.update = update;
;
function update() {}
});
var CharacterLeg = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
// Leg settings
var upperBaseAngle = Math.PI * 3 / 8;
var lowerBaseOffset = 135;
var lowerHoldAngle = Math.PI / 8;
var footBaseOffset = 100;
// Create and attach leg parts
var upper = self.attachAsset('upperLeg', {
rotation: upperBaseAngle,
anchorY: 0.1,
tint: config.tint || 0xFFFFFF
});
var lower = self.addChild(new ConfigContainer({
y: lowerBaseOffset,
tint: config.tint || 0xFFFFFF
}));
lower.attachAsset('lowerLeg', {
anchorX: 0.65,
tint: config.tint || 0xFFFFFF
});
var foot = lower.attachAsset('foot', {
y: footBaseOffset,
anchorX: 0.2,
anchorY: 0.05,
tint: config.tint || 0xFFFFFF
});
self.update = function (alpha) {
var sinusoidal = Math.cos(alpha * Math.PI * 2);
var upperSwing = sinusoidal * Math.PI / 3;
self.rotation = upperSwing;
lower.rotation = lowerHoldAngle + (alpha <= 0.5 ? Math.PI / 3 + (1 - Math.abs(sinusoidal)) * Math.PI / 6 : Math.abs(-upperSwing));
foot.rotation = Math.max(0, upperSwing * 2 / 3) - lowerHoldAngle;
};
});
var CharacterBody = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
// Body settings
var baseY = config.y || 0;
var armOffsetX = 15;
var armOffsetY = 30;
var pelvisOffsetX = -15;
var legOffsetX = 5;
// Create and attach body parts
var armRight = self.addChild(new CharacterArm({
y: armOffsetY,
tint: 0x777777
}));
var legRight = self.addChild(new CharacterLeg({
x: pelvisOffsetX + legOffsetX,
tint: 0x777777
}));
var torso = self.attachAsset('torso', {
anchorX: 0.5
});
var head = self.attachAsset('head', {
anchorX: 0.15,
anchorY: 0.95
});
var pelvis = self.attachAsset('pelvis', {
x: pelvisOffsetX,
y: torso.height,
anchorX: 0.5,
anchorY: 0.2,
tint: 0xAAAAAA
});
var legLeft = self.addChild(new CharacterLeg({
x: pelvisOffsetX - legOffsetX
}));
var armLeft = self.addChild(new CharacterArm({
y: armOffsetY
}));
// Position body parts
armLeft.x = -torso.width / 2 + armOffsetX;
armRight.x = torso.width / 2 - armOffsetX;
legLeft.y = torso.height + pelvis.height / 3;
legRight.y = torso.height + pelvis.height / 3;
// Add an empty update function to the Character class
self.runAlpha = 0;
self.update = function () {
this.runAlpha += 0.0075;
var sinusoidal = Math.cos(this.runAlpha * Math.PI * 4);
armLeft.update(this.runAlpha % 1);
armRight.update((this.runAlpha - 0.5) % 1);
legLeft.update(this.runAlpha % 1);
legRight.update((this.runAlpha - 0.5) % 1);
self.y = baseY + sinusoidal * 10;
head.rotation = (1 + sinusoidal) * Math.PI / 32;
};
});
var CharacterArm = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
// Arm settings
var upperBaseAngle = -Math.PI * 3 / 8;
var upperOffsetAngle = Math.PI / 5;
var lowerBaseAngle = -Math.PI / 4;
var lowerHoldAngle = -Math.PI * 5 / 8;
var lowerBaseOffset = 90;
// Create and attach arm parts
var upper = self.attachAsset('upperArm', {
rotation: upperBaseAngle,
anchorX: 0.85,
anchorY: 0.25,
tint: config.tint || 0xFFFFFF
});
var lower = self.attachAsset('lowerArm', {
y: lowerBaseOffset,
rotation: lowerBaseAngle + lowerHoldAngle,
anchorX: 0.95,
anchorY: 0.05,
tint: config.tint || 0xFFFFFF
});
self.update = function (alpha) {
var upperSwing = Math.cos(alpha * Math.PI * 2) * Math.PI / 4; // Swing between -45 and 45 degrees
var lowerSwing = -upperSwing / 2;
self.rotation = -upperSwing + upperOffsetAngle;
lower.rotation = lowerBaseAngle + lowerHoldAngle + lowerSwing;
};
});
var Character = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
var body = self.addChild(new CharacterBody({
y: -400
}));
self.update = function () {
body.update();
};
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87CEEB // Sky blue color
});
/****
* Game Code
****/
// Global Constants & Settings
// Game Constants
var GAME_TICKS = 60;
var GAME_WIDTH = 2048;
var GAME_HEIGHT = 2732;
// Math Constants
var MATH_2_PI = Math.PI * 2;
// Road Constants
var ROAD_SEGMENT_COUNT = 30;
var ROAD_SEGMENT_ANGLE = 2 * Math.PI / ROAD_SEGMENT_COUNT;
var ROAD_SEGMENT_HEIGHT = 1000;
var ROAD_FREE_RUN_COUNT = 5;
var ROAD_SCALE_BASE = 0.7;
var ROAD_SCALE_STEP = 0.1;
var ROAD_SCALE_MAX = 1.0;
var ROAD_SCALE_MIN = 0.4;
var ROAD_STEP_CHANCE_BASE = 0.1;
var ROAD_STEP_CHANCE_INCREMENT = 0.5;
var ROAD_GEN_PLANT_ASSETS = 3;
var ROAD_GEN_PLANT_MAX = 3;
var ROAD_GEN_TREE_ASSETS = 3;
var ROAD_GEN_TREE_CHANCE = 0.1;
// Player Constants
var PLAYER_ROTATIONAL_SPEED = MATH_2_PI / (GAME_TICKS * 10); // 10s to complete a revolution
;
// Game Instances
var road = game.addChild(new Road({
x: GAME_WIDTH / 2,
y: GAME_HEIGHT - GAME_WIDTH / 2
}));
var character = game.addChild(new Character({
x: road.x,
y: road.y,
scale: 0.5
}));
;
// Events
LK.on('tick', function () {
//road.rotation -= PLAYER_ROTATIONAL_SPEED;
character.update();
});
;
// Animations
function animationRun(alpha) {
return {};
}
function animationJump(alpha) {
return {};
}
function animationStand(alpha) {
return {};
} ===================================================================
--- original.js
+++ change.js
@@ -31,53 +31,70 @@
self.attachAsset('roadSegment', {
anchorX: 1,
anchorY: 1
});
+ self.attachAsset('roadSegment', {
+ anchorX: 1,
+ anchorY: 1,
+ scaleX: 0.95,
+ scaleY: 0.95,
+ tint: 0x555555
+ });
if (config.index % 3 === 0) {
attachAssetRadial(self, 'square', {
- offset: 50,
+ offset: 100,
width: 100,
height: 10,
anchorR: 0.5,
anchorX: 0.5,
anchorY: 0.5
});
}
;
+ self.update = update;
+ self.transition = transition;
self.scaling = config.scale;
+ self.stepHeight = config.scale * ROAD_SEGMENT_HEIGHT;
self.stepChance = config.stepChance;
- self.transition = transition;
self.previous = config.previous;
;
function attachAssetRadial(parent, asset, obj) {
- var offsetTotal = ROAD_SEGMENT_HEIGHT - obj.offset;
+ var offsetTotal = ROAD_SEGMENT_HEIGHT - (obj.offset || 10);
var rotation = -(1 - obj.anchorR) * ROAD_SEGMENT_ANGLE;
parent.attachAsset(asset, {
x: Math.sin(rotation) * offsetTotal,
y: Math.cos(rotation) * -offsetTotal,
width: obj.width,
height: obj.height,
anchorX: obj.anchorX,
anchorY: obj.anchorY,
+ scaleX: obj.scaleX || 1,
+ scaleY: obj.scaleY || 1,
rotation: (obj.rotation || 0) + rotation
});
}
function generateBackground() {
var plantCount = Math.floor(Math.random() * (ROAD_GEN_PLANT_MAX + 1));
if (Math.random() < ROAD_GEN_TREE_CHANCE) {
- var treeIndex = Math.floor(Math.random() * (ROAD_GEN_TREE_ASSETS + 1));
+ var treeIndex = Math.floor(Math.random() * ROAD_GEN_TREE_ASSETS);
+ var scale = 0.9 + 0.2 * Math.random();
attachAssetRadial(backgroundNew, 'tree' + treeIndex, {
anchorR: 0.4 + 0.2 * Math.random(),
anchorX: 0.5,
- anchorY: 1
+ anchorY: 1,
+ scaleX: scale,
+ scaleY: scale
});
}
for (var i = 0; i < plantCount; i++) {
- var plantIndex = Math.floor(Math.random() * (ROAD_GEN_PLANT_ASSETS + 1));
+ var plantIndex = Math.floor(Math.random() * ROAD_GEN_PLANT_ASSETS);
+ var scale = 0.9 + 0.2 * Math.random();
attachAssetRadial(backgroundNew, 'plant' + plantIndex, {
anchorR: 0.1 + 0.8 * Math.random(),
anchorX: 0.5,
- anchorY: 1
+ anchorY: 1,
+ scaleX: Math.random() < 0.5 ? -scale : scale,
+ scaleY: scale
});
}
}
function transition(instant) {
@@ -99,9 +116,11 @@
self.stepChance = self.previous.stepChance + ROAD_STEP_CHANCE_INCREMENT;
}
generateBackground();
self.scale.set(self.scaling);
+ self.stepHeight = config.scale * ROAD_SEGMENT_HEIGHT;
}
+ function update() {}
});
var Road = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
var segments = [];
@@ -134,8 +153,12 @@
tint: 0x87CEEB,
anchorX: 0.5,
anchorY: 0.5
});
+ ;
+ self.update = update;
+ ;
+ function update() {}
});
var CharacterLeg = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
// Leg settings
@@ -173,8 +196,9 @@
});
var CharacterBody = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
// Body settings
+ var baseY = config.y || 0;
var armOffsetX = 15;
var armOffsetY = 30;
var pelvisOffsetX = -15;
var legOffsetX = 5;
@@ -220,9 +244,9 @@
armLeft.update(this.runAlpha % 1);
armRight.update((this.runAlpha - 0.5) % 1);
legLeft.update(this.runAlpha % 1);
legRight.update((this.runAlpha - 0.5) % 1);
- self.y = sinusoidal * 10;
+ self.y = baseY + sinusoidal * 10;
head.rotation = (1 + sinusoidal) * Math.PI / 32;
};
});
var CharacterArm = ConfigContainer.expand(function (config) {
@@ -255,9 +279,11 @@
};
});
var Character = ConfigContainer.expand(function (config) {
var self = ConfigContainer.call(this, config);
- var body = self.addChild(new CharacterBody());
+ var body = self.addChild(new CharacterBody({
+ y: -400
+ }));
self.update = function () {
body.update();
};
});
@@ -289,11 +315,11 @@
var ROAD_SCALE_MAX = 1.0;
var ROAD_SCALE_MIN = 0.4;
var ROAD_STEP_CHANCE_BASE = 0.1;
var ROAD_STEP_CHANCE_INCREMENT = 0.5;
-var ROAD_GEN_PLANT_ASSETS = 2;
+var ROAD_GEN_PLANT_ASSETS = 3;
var ROAD_GEN_PLANT_MAX = 3;
-var ROAD_GEN_TREE_ASSETS = 2;
+var ROAD_GEN_TREE_ASSETS = 3;
var ROAD_GEN_TREE_CHANCE = 0.1;
// Player Constants
var PLAYER_ROTATIONAL_SPEED = MATH_2_PI / (GAME_TICKS * 10); // 10s to complete a revolution
;
@@ -303,9 +329,10 @@
y: GAME_HEIGHT - GAME_WIDTH / 2
}));
var character = game.addChild(new Character({
x: road.x,
- y: road.y
+ y: road.y,
+ scale: 0.5
}));
;
// Events
LK.on('tick', function () {
Images
:quality(85)/https://cdn.frvr.ai/66204785fd822d47c3d9c321.png%3F3)
:quality(85)/https://cdn.frvr.ai/66204801fd822d47c3d9c324.png%3F3)
:quality(85)/https://cdn.frvr.ai/66204855fd822d47c3d9c330.png%3F3)
white
:quality(85)/https://cdn.frvr.ai/66204988fd822d47c3d9c337.png%3F3)
:quality(85)/https://cdn.frvr.ai/6620f5c2fd822d47c3d9c469.png%3F3)
:quality(85)/https://cdn.frvr.ai/66210760fd822d47c3d9c511.png%3F3)
:quality(85)/https://cdn.frvr.ai/66210874fd822d47c3d9c519.png%3F3)
:quality(85)/https://cdn.frvr.ai/662f796cfb7ae1a09789360d.png%3F3)
white
:quality(85)/https://cdn.frvr.ai/662f928dfb7ae1a09789364b.png%3F3)
circle sliced into many pieces, flat image. 2d, white background, shadowless.
:quality(85)/https://cdn.frvr.ai/662fafe1fb7ae1a0978936c0.png%3F3)
:quality(85)/https://cdn.frvr.ai/662fb030fb7ae1a0978936c4.png%3F3)
:quality(85)/https://cdn.frvr.ai/662fb16cfb7ae1a0978936ed.png%3F3)
:quality(85)/https://cdn.frvr.ai/662fb742fb7ae1a097893701.png%3F3)
pixel art of a tall, tree. game asset, 2d, white background, shadowless.
:quality(85)/https://cdn.frvr.ai/662fb7f9fb7ae1a09789371a.png%3F3)
:quality(85)/https://cdn.frvr.ai/662fdb80fb7ae1a09789378d.png%3F3)
Pixel art street lamp. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
:quality(85)/https://cdn.frvr.ai/662fdd00fb7ae1a0978937a3.png%3F3)
:quality(85)/https://cdn.frvr.ai/662fdd3cfb7ae1a0978937af.png%3F3)
pixel art cloud. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
:quality(85)/https://cdn.frvr.ai/663024354b4b64dc0512b979.png%3F3)
pixel art sun. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
:quality(85)/https://cdn.frvr.ai/66315baac5464eadd658b7b3.png%3F3)
Most played remixes
:quality(85)/https://cdn.frvr.ai/66f9e13be2841a795e9a4323.png)
