Play
:quality(85)/https://cdn.frvr.ai/682db0eede9672718bac1b1b.png)
:quality(85)/https://cdn.upit.com/yht4iyir9dat64hr0lwu8q8o.jpeg)
:quality(85)/https://cdn.frvr.ai/682db0e7de9672718bac1b14.png)
#FootballGame
#ArcadeSports
#JoystickControl
#MobileGaming
#Soccer
Creation History
User prompt
Make a scoreboard for the goal count
User prompt
Add 2 mutual soccer goal
Code edit (1 edits merged)
Please save this source code
User prompt
Do it same game again
User prompt
Football Flick: Pass & Shoot
User prompt
Make a football game with shot and pass buttons and add a joystick
Initial prompt
Make a football game
/****
* Classes
****/
// Ball class
var Ball = Container.expand(function () {
var self = Container.call(this);
var gfx = self.attachAsset('ball', {
anchorX: 0.5,
anchorY: 0.5
});
self.radius = gfx.width * 0.5;
self.vx = 0;
self.vy = 0;
self.update = function () {
self.x += self.vx;
self.y += self.vy;
// Friction
self.vx *= 0.96;
self.vy *= 0.96;
// Clamp to field
if (self.x < 100 + self.radius) {
self.x = 100 + self.radius;
}
if (self.x > 2048 - 100 - self.radius) {
self.x = 2048 - 100 - self.radius;
}
if (self.y < 200 + self.radius) {
self.y = 200 + self.radius;
}
if (self.y > 2732 - 200 - self.radius) {
self.y = 2732 - 200 - self.radius;
}
};
return self;
});
// --- UI: Joystick and Buttons ---
// Joystick
// --- FOOTBALL GAME MAIN OBJECTS ---
// Footballer class
var Footballer = Container.expand(function () {
var self = Container.call(this);
var gfx = self.attachAsset('footballer', {
anchorX: 0.5,
anchorY: 0.5
});
self.radius = gfx.width * 0.5;
self.hasBall = true;
self.update = function () {};
return self;
});
// Soccer Goal class
var SoccerGoal = Container.expand(function () {
var self = Container.call(this);
// width: 400px, height: 40px, color: white, box
var gfx = self.attachAsset('centerCircle', {
width: 400,
height: 40,
color: 0xffffff,
anchorX: 0.5,
anchorY: 0.5
});
self.width = 400;
self.height = 40;
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x000000
});
/****
* Game Code
****/
// Joystick
// --- UI: Joystick and Buttons ---
var joystick = LK.gui.bottomLeft.addChild(LK.getAsset('joystick_base', {
anchorX: 0.5,
anchorY: 0.5,
x: 220,
y: -220,
scaleX: 2,
scaleY: 2
}));
var joystickKnob = LK.gui.bottomLeft.addChild(LK.getAsset('joystick_knob', {
anchorX: 0.5,
anchorY: 0.5,
x: 220,
y: -220,
scaleX: 1.2,
scaleY: 1.2
}));
var joystickActive = false;
var joystickStart = {
x: 0,
y: 0
};
var joystickDir = {
x: 0,
y: 0
};
// Pass Button
var passBtn = LK.gui.bottomRight.addChild(LK.getAsset('pass_btn', {
anchorX: 0.5,
anchorY: 0.5,
x: -220,
y: -320,
scaleX: 2,
scaleY: 2
}));
// Shoot Button
var shootBtn = LK.gui.bottomRight.addChild(LK.getAsset('shoot_btn', {
anchorX: 0.5,
anchorY: 0.5,
x: -220,
y: -120,
scaleX: 2,
scaleY: 2
}));
// --- GAME OBJECTS ---
// Left Goal (bottom)
var leftGoal = new SoccerGoal();
leftGoal.x = 2048 / 2;
leftGoal.y = 2732 - 120;
game.addChild(leftGoal);
// Right Goal (top)
var rightGoal = new SoccerGoal();
rightGoal.x = 2048 / 2;
rightGoal.y = 120;
game.addChild(rightGoal);
var footballer = new Footballer();
footballer.x = 2048 / 2;
footballer.y = 2732 - 500;
game.addChild(footballer);
var ball = new Ball();
ball.x = footballer.x;
ball.y = footballer.y - footballer.radius - 40;
game.addChild(ball);
// --- GAME STATE ---
var canShoot = true;
var canPass = true;
// --- SCOREBOARD ---
var leftScore = 0;
var rightScore = 0;
var scoreTxt = new Text2('0 : 0', {
size: 120,
fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
function updateScoreboard() {
scoreTxt.setText(leftScore + " : " + rightScore);
}
updateScoreboard();
// --- JOYSTICK EVENTS ---
joystickKnob.down = function (x, y, obj) {
joystickActive = true;
joystickStart.x = x;
joystickStart.y = y;
};
joystickKnob.up = function (x, y, obj) {
joystickActive = false;
joystickKnob.x = joystick.x;
joystickKnob.y = joystick.y;
joystickDir.x = 0;
joystickDir.y = 0;
};
joystickKnob.move = function (x, y, obj) {
if (!joystickActive) {
return;
}
var dx = x - joystick.x;
var dy = y - joystick.y;
var dist = Math.sqrt(dx * dx + dy * dy);
var maxDist = 120;
if (dist > maxDist) {
dx = dx * maxDist / dist;
dy = dy * maxDist / dist;
}
joystickKnob.x = joystick.x + dx;
joystickKnob.y = joystick.y + dy;
joystickDir.x = dx / maxDist;
joystickDir.y = dy / maxDist;
};
// --- BUTTON EVENTS ---
passBtn.down = function (x, y, obj) {
if (footballer.hasBall && canPass) {
// Pass: simple forward pass
ball.vx = 0;
ball.vy = -40;
footballer.hasBall = false;
canPass = false;
LK.setTimeout(function () {
canPass = true;
}, 400);
}
};
shootBtn.down = function (x, y, obj) {
if (footballer.hasBall && canShoot) {
// Shoot: strong forward shot
ball.vx = 0;
ball.vy = -80;
footballer.hasBall = false;
canShoot = false;
LK.setTimeout(function () {
canShoot = true;
}, 800);
}
};
// --- GAME MOVE HANDLER ---
game.move = function (x, y, obj) {
// Forward joystick events
if (joystickActive) {
joystickKnob.move(x, y, obj);
}
};
// --- GAME UPDATE ---
game.update = function () {
// Move footballer with joystick
if (joystickDir.x !== 0 || joystickDir.y !== 0) {
var speed = 18;
footballer.x += joystickDir.x * speed;
footballer.y += joystickDir.y * speed;
// Clamp to field
if (footballer.x < 100 + footballer.radius) {
footballer.x = 100 + footballer.radius;
}
if (footballer.x > 2048 - 100 - footballer.radius) {
footballer.x = 2048 - 100 - footballer.radius;
}
if (footballer.y < 200 + footballer.radius) {
footballer.y = 200 + footballer.radius;
}
if (footballer.y > 2732 - 200 - footballer.radius) {
footballer.y = 2732 - 200 - footballer.radius;
}
}
// Ball follows footballer if in possession
if (footballer.hasBall) {
ball.x = footballer.x;
ball.y = footballer.y - footballer.radius - ball.radius - 10;
ball.vx = 0;
ball.vy = 0;
} else {
ball.update();
// Regain possession if close
var dx = footballer.x - ball.x;
var dy = footballer.y - ball.y;
var dist = Math.sqrt(dx * dx + dy * dy);
if (dist < footballer.radius + ball.radius + 20 && !footballer.hasBall) {
footballer.hasBall = true;
}
// --- GOAL DETECTION ---
// Ball enters rightGoal (top)
if (ball.lastY !== undefined && ball.lastY > rightGoal.y && ball.y <= rightGoal.y && Math.abs(ball.x - rightGoal.x) < rightGoal.width * 0.5) {
leftScore += 1;
updateScoreboard();
// Reset ball and footballer
footballer.x = 2048 / 2;
footballer.y = 2732 - 500;
ball.x = footballer.x;
ball.y = footballer.y - footballer.radius - 40;
footballer.hasBall = true;
ball.vx = 0;
ball.vy = 0;
}
// Ball enters leftGoal (bottom)
if (ball.lastY !== undefined && ball.lastY < leftGoal.y && ball.y >= leftGoal.y && Math.abs(ball.x - leftGoal.x) < leftGoal.width * 0.5) {
rightScore += 1;
updateScoreboard();
// Reset ball and footballer
footballer.x = 2048 / 2;
footballer.y = 2732 - 500;
ball.x = footballer.x;
ball.y = footballer.y - footballer.radius - 40;
footballer.hasBall = true;
ball.vx = 0;
ball.vy = 0;
}
ball.lastY = ball.y;
}
}; ===================================================================
--- original.js
+++ change.js
@@ -73,10 +73,10 @@
/****
* Game Code
****/
-// --- UI: Joystick and Buttons ---
// Joystick
+// --- UI: Joystick and Buttons ---
var joystick = LK.gui.bottomLeft.addChild(LK.getAsset('joystick_base', {
anchorX: 0.5,
anchorY: 0.5,
x: 220,
@@ -137,11 +137,24 @@
var ball = new Ball();
ball.x = footballer.x;
ball.y = footballer.y - footballer.radius - 40;
game.addChild(ball);
-// --- GAME STATE ---
+// --- GAME STATE ---
var canShoot = true;
var canPass = true;
+// --- SCOREBOARD ---
+var leftScore = 0;
+var rightScore = 0;
+var scoreTxt = new Text2('0 : 0', {
+ size: 120,
+ fill: 0xFFFFFF
+});
+scoreTxt.anchor.set(0.5, 0);
+LK.gui.top.addChild(scoreTxt);
+function updateScoreboard() {
+ scoreTxt.setText(leftScore + " : " + rightScore);
+}
+updateScoreboard();
// --- JOYSTICK EVENTS ---
joystickKnob.down = function (x, y, obj) {
joystickActive = true;
joystickStart.x = x;
@@ -238,6 +251,34 @@
var dist = Math.sqrt(dx * dx + dy * dy);
if (dist < footballer.radius + ball.radius + 20 && !footballer.hasBall) {
footballer.hasBall = true;
}
+ // --- GOAL DETECTION ---
+ // Ball enters rightGoal (top)
+ if (ball.lastY !== undefined && ball.lastY > rightGoal.y && ball.y <= rightGoal.y && Math.abs(ball.x - rightGoal.x) < rightGoal.width * 0.5) {
+ leftScore += 1;
+ updateScoreboard();
+ // Reset ball and footballer
+ footballer.x = 2048 / 2;
+ footballer.y = 2732 - 500;
+ ball.x = footballer.x;
+ ball.y = footballer.y - footballer.radius - 40;
+ footballer.hasBall = true;
+ ball.vx = 0;
+ ball.vy = 0;
+ }
+ // Ball enters leftGoal (bottom)
+ if (ball.lastY !== undefined && ball.lastY < leftGoal.y && ball.y >= leftGoal.y && Math.abs(ball.x - leftGoal.x) < leftGoal.width * 0.5) {
+ rightScore += 1;
+ updateScoreboard();
+ // Reset ball and footballer
+ footballer.x = 2048 / 2;
+ footballer.y = 2732 - 500;
+ ball.x = footballer.x;
+ ball.y = footballer.y - footballer.radius - 40;
+ footballer.hasBall = true;
+ ball.vx = 0;
+ ball.vy = 0;
+ }
+ ball.lastY = ball.y;
}
};
\ No newline at end of file
Images
:quality(85)/https://cdn.frvr.ai/682db2875627cd4934f3635d.png%3F3)
Football ball. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/682db2d25627cd4934f36390.png%3F3)
Cristiano ronaldo. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/682dbc49c0a485ebd0251bb5.png%3F3)
Button with says shoot. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/682dbc8fc0a485ebd0251bca.png%3F3)
A button that says pass. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/682dbcd8c0a485ebd0251bd3.png%3F3)
Circle. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/682dbd30c0a485ebd0251be5.png%3F3)
Little circle. In-Game asset. 2d. High contrast. No shadows
