/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ var Basketball = Container.expand(function () { var self = Container.call(this); var ballGraphics = self.attachAsset('basketball', { anchorX: 0.5, anchorY: 0.5 }); self.speedY = 0; self.gravity = 0.5; self.bounce = -10; self.changeSkin = function (skinId) { self.removeChild(ballGraphics); ballGraphics = self.attachAsset(skinId, { anchorX: 0.5, anchorY: 0.5 }); }; self.update = function () { self.speedY += self.gravity; self.y += self.speedY; if (self.y > 2732 - ballGraphics.height / 2) { self.y = 2732 - ballGraphics.height / 2; self.speedY = self.bounce; } }; self.tap = function () { self.speedY = self.bounce; }; return self; }); var Hoop = Container.expand(function () { var self = Container.call(this); var hoopGraphics = self.attachAsset('hoop', { anchorX: 0.5, anchorY: 0.5 }); self.speedX = -5; self.update = function () { self.x += self.speedX; if (self.x < -hoopGraphics.width / 2) { self.x = 2048 + hoopGraphics.width / 2; self.y = Math.random() * (2732 - 400) + 200; self.scored = false; } }; return self; }); var MainMenu = Container.expand(function () { var self = Container.call(this); // Create background elements var balls = []; var createDecorationBall = function createDecorationBall(skin, x, y, size, speedX, speedY) { var ball = self.attachAsset(skin, { anchorX: 0.5, anchorY: 0.5, scale: size, x: x, y: y, alpha: 0.7 }); ball.speedX = speedX; ball.speedY = speedY; ball.gravity = 0.2; ball.bounce = -8; ball.rotation = Math.random() * Math.PI * 2; // Random initial rotation ball.radius = ball.width / 2 * size; // Store effective radius for boundary checking balls.push(ball); return ball; }; // Create many decorative basketballs createDecorationBall('basketball', 400, 500, 0.8, 2, 1); createDecorationBall('basketball_blue', 1500, 800, 0.7, -1.5, 3); createDecorationBall('basketball_pink', 700, 1200, 0.9, 2.5, -2); createDecorationBall('basketball', 1800, 1600, 0.6, -2, 2); createDecorationBall('basketball_blue', 300, 2000, 0.8, 1.8, -1); // Add more basketballs createDecorationBall('basketball_pink', 900, 300, 0.65, -1.2, 2); createDecorationBall('basketball', 1200, 1800, 0.7, 1.7, -2.5); createDecorationBall('basketball_blue', 500, 1500, 0.75, 2.2, 1.8); createDecorationBall('basketball_pink', 1600, 1000, 0.85, -2.4, -1.5); createDecorationBall('basketball', 250, 800, 0.55, 1.5, 2.2); // Add even more basketballs createDecorationBall('basketball', 800, 2200, 0.9, -1.8, -2.2); createDecorationBall('basketball_blue', 1100, 400, 0.65, 2.3, 1.2); createDecorationBall('basketball_pink', 1900, 1400, 0.7, -1.9, -1.8); createDecorationBall('basketball', 350, 1100, 0.8, 1.4, 2.5); createDecorationBall('basketball_blue', 1300, 1600, 0.75, -2.1, -1.3); // Create title text var titleText = new Text2('FLAPPY DUNK', { size: 150, fill: 0xFFFFFF }); titleText.anchor.set(0.5, 0.5); titleText.x = 2048 / 2; titleText.y = 2732 / 3; self.addChild(titleText); // Add title shadow for better visibility var titleShadow = new Text2('FLAPPY DUNK', { size: 150, fill: 0x4488FF }); titleShadow.anchor.set(0.5, 0.5); titleShadow.x = 2048 / 2 + 8; titleShadow.y = 2732 / 3 + 8; self.addChild(titleShadow); self.addChild(titleText); // Re-add to put on top of shadow // Create play button var playButton = self.attachAsset('playButton', { anchorX: 0.5, anchorY: 0.5, scaleX: 2.5, scaleY: 1.5, x: 2048 / 2, y: 2732 / 2 }); // No play text needed // Animate play button tween(playButton, { scaleX: 2.7, scaleY: 1.7 }, { duration: 800, easing: tween.easeInOut, onFinish: function onFinish() { // Animation will repeat automatically with tweening back and forth tween(playButton, { scaleX: 2.5, scaleY: 1.5 }, { duration: 800, easing: tween.easeInOut, onFinish: function onFinish() { // Create infinite animation loop self.update = function () { // Update decorative basketballs for (var i = 0; i < balls.length; i++) { var ball = balls[i]; // Apply physics ball.speedY += ball.gravity; ball.x += ball.speedX; ball.y += ball.speedY; // Bounce off walls if (ball.x < ball.radius || ball.x > 2048 - ball.radius) { ball.speedX *= -0.9; if (ball.x < ball.radius) ball.x = ball.radius; if (ball.x > 2048 - ball.radius) ball.x = 2048 - ball.radius; } // Bounce off floor if (ball.y > 2732 - ball.radius) { ball.y = 2732 - ball.radius; ball.speedY = ball.bounce * 0.8; ball.rotation += (Math.random() - 0.5) * 0.3; // More rotation on bounce } // Bounce off ceiling if (ball.y < ball.radius) { ball.y = ball.radius; ball.speedY *= -0.8; } // More dynamic rotation based on speed ball.rotation += ball.speedX * 0.02; } // Animate play button if (!playButton.isTweening) { tween(playButton, { scaleX: playButton.scaleX === 2.5 ? 2.7 : 2.5, scaleY: playButton.scaleY === 1.5 ? 1.7 : 1.5 }, { duration: 800, easing: tween.easeInOut }); } }; } }); } }); // Add subtitle var subtitleText = new Text2('Tap to play!', { size: 80, fill: 0xFFFFFF }); subtitleText.anchor.set(0.5, 0.5); subtitleText.x = 2048 / 2; subtitleText.y = 2732 / 2 + 200; self.addChild(subtitleText); // Make subtitle pulse tween(subtitleText, { alpha: 0.5 }, { duration: 1000, easing: tween.easeInOut, onFinish: function onFinish() { tween(subtitleText, { alpha: 1 }, { duration: 1000, easing: tween.easeInOut, onFinish: function onFinish() { // Create pulse loop for subtitle LK.setInterval(function () { if (!subtitleText.isTweening) { tween(subtitleText, { alpha: subtitleText.alpha === 1 ? 0.5 : 1 }, { duration: 1000, easing: tween.easeInOut }); } }, 50); } }); } }); // Add decorative hoops in background var decorativeHoop1 = self.attachAsset('hoop', { anchorX: 0.5, anchorY: 0.5, scaleX: 2, scaleY: 2, x: 400, y: 700, rotation: Math.PI * 0.05 }); var decorativeHoop2 = self.attachAsset('hoop', { anchorX: 0.5, anchorY: 0.5, scaleX: 1.5, scaleY: 1.5, x: 1700, y: 1200, rotation: -Math.PI * 0.05 }); // Event handlers self.down = function () { LK.getSound('click').play(); if (typeof self.onPlay === 'function') { self.onPlay(); } }; return self; }); var SkinButton = Container.expand(function () { var self = Container.call(this); var buttonGraphics = self.attachAsset('skinButton', { anchorX: 0.5, anchorY: 0.5 }); self.down = function () { LK.getSound('click').play(); self.scale.set(0.9, 0.9); }; self.up = function () { self.scale.set(1, 1); if (typeof self.onTap === 'function') { self.onTap(); } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x000000 }); /**** * Game Code ****/ // Initialize assets used in this game. Scale them according to what is needed for the game. game.setBackgroundColor(0x000000); // Define available basketball skins var basketballSkins = [{ id: '680131741362ae11fa646c61', name: 'Classic' }, { id: '6801e9f12f9255a02dd2ec1c', name: 'Blue' }, { id: '6801e9fb1362ae11fa647bb1', name: 'Pink' }]; // Initialize with default skin var currentSkinIndex = 0; // Game state management var GAME_STATE = { MENU: 0, PLAYING: 1 }; var currentState = GAME_STATE.MENU; // Main menu elements var mainMenu = new MainMenu(); game.addChild(mainMenu); // Game elements (initialized but not added to stage yet) var basketball; var hoops = []; var hoop; var scoreTxt; var score = 0; var skinButton; var skinNameTxt; // Initialize main menu mainMenu.onPlay = function () { // Hide menu mainMenu.visible = false; // Start game startGame(); }; // Function to initialize and start the game function startGame() { currentState = GAME_STATE.PLAYING; // Create basketball with initial skin basketball = game.addChild(new Basketball()); basketball.x = 2048 / 4; basketball.y = 2732 / 2; basketball.scaleX = 1.5; basketball.scaleY = 1.5; // Create hoop hoop = game.addChild(new Hoop()); hoop.x = 2048; hoop.y = Math.random() * (2732 - 800) + 400; hoop.scaleX = 3; hoop.scaleY = 3; hoop.scored = false; hoops.push(hoop); // Create score text scoreTxt = new Text2('0', { size: 150, fill: 0xFFFFFF }); scoreTxt.anchor.set(0.5, 0); LK.gui.top.addChild(scoreTxt); // Create skin selection button skinButton = new SkinButton(); skinButton.x = 150; skinButton.y = 150; skinButton.onTap = function () { // Cycle through skins currentSkinIndex = (currentSkinIndex + 1) % basketballSkins.length; var newSkin = basketballSkins[currentSkinIndex]; // Update basketball skin if (currentSkinIndex === 0) { basketball.changeSkin('basketball'); } else if (currentSkinIndex === 1) { basketball.changeSkin('basketball_blue'); } else if (currentSkinIndex === 2) { basketball.changeSkin('basketball_pink'); } // Update skin name text skinNameTxt.setText(basketballSkins[currentSkinIndex].name); }; LK.gui.topLeft.addChild(skinButton); // Create skin name text skinNameTxt = new Text2(basketballSkins[currentSkinIndex].name, { size: 50, fill: 0xFFFFFF }); skinNameTxt.anchor.set(0.5, 0); skinNameTxt.x = skinButton.x; skinNameTxt.y = skinButton.y + 70; LK.gui.topLeft.addChild(skinNameTxt); } game.down = function (x, y, obj) { if (currentState === GAME_STATE.PLAYING) { basketball.tap(); } }; game.update = function () { if (currentState === GAME_STATE.PLAYING) { basketball.update(); for (var i = 0; i < hoops.length; i++) { hoops[i].update(); if (!hoops[i].scored && basketball.intersects(hoops[i])) { score += 10; scoreTxt.setText(score); LK.getSound('swish').play(); hoops[i].scored = true; } } if (basketball.y > 2732 - basketball.height / 2 || basketball.y < basketball.height / 2 || basketball.x < basketball.width / 2 || basketball.x > 2048 - basketball.width / 2) { LK.showGameOver(); } } }; LK.playMusic('bgmusic'); ;
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var Basketball = Container.expand(function () {
var self = Container.call(this);
var ballGraphics = self.attachAsset('basketball', {
anchorX: 0.5,
anchorY: 0.5
});
self.speedY = 0;
self.gravity = 0.5;
self.bounce = -10;
self.changeSkin = function (skinId) {
self.removeChild(ballGraphics);
ballGraphics = self.attachAsset(skinId, {
anchorX: 0.5,
anchorY: 0.5
});
};
self.update = function () {
self.speedY += self.gravity;
self.y += self.speedY;
if (self.y > 2732 - ballGraphics.height / 2) {
self.y = 2732 - ballGraphics.height / 2;
self.speedY = self.bounce;
}
};
self.tap = function () {
self.speedY = self.bounce;
};
return self;
});
var Hoop = Container.expand(function () {
var self = Container.call(this);
var hoopGraphics = self.attachAsset('hoop', {
anchorX: 0.5,
anchorY: 0.5
});
self.speedX = -5;
self.update = function () {
self.x += self.speedX;
if (self.x < -hoopGraphics.width / 2) {
self.x = 2048 + hoopGraphics.width / 2;
self.y = Math.random() * (2732 - 400) + 200;
self.scored = false;
}
};
return self;
});
var MainMenu = Container.expand(function () {
var self = Container.call(this);
// Create background elements
var balls = [];
var createDecorationBall = function createDecorationBall(skin, x, y, size, speedX, speedY) {
var ball = self.attachAsset(skin, {
anchorX: 0.5,
anchorY: 0.5,
scale: size,
x: x,
y: y,
alpha: 0.7
});
ball.speedX = speedX;
ball.speedY = speedY;
ball.gravity = 0.2;
ball.bounce = -8;
ball.rotation = Math.random() * Math.PI * 2; // Random initial rotation
ball.radius = ball.width / 2 * size; // Store effective radius for boundary checking
balls.push(ball);
return ball;
};
// Create many decorative basketballs
createDecorationBall('basketball', 400, 500, 0.8, 2, 1);
createDecorationBall('basketball_blue', 1500, 800, 0.7, -1.5, 3);
createDecorationBall('basketball_pink', 700, 1200, 0.9, 2.5, -2);
createDecorationBall('basketball', 1800, 1600, 0.6, -2, 2);
createDecorationBall('basketball_blue', 300, 2000, 0.8, 1.8, -1);
// Add more basketballs
createDecorationBall('basketball_pink', 900, 300, 0.65, -1.2, 2);
createDecorationBall('basketball', 1200, 1800, 0.7, 1.7, -2.5);
createDecorationBall('basketball_blue', 500, 1500, 0.75, 2.2, 1.8);
createDecorationBall('basketball_pink', 1600, 1000, 0.85, -2.4, -1.5);
createDecorationBall('basketball', 250, 800, 0.55, 1.5, 2.2);
// Add even more basketballs
createDecorationBall('basketball', 800, 2200, 0.9, -1.8, -2.2);
createDecorationBall('basketball_blue', 1100, 400, 0.65, 2.3, 1.2);
createDecorationBall('basketball_pink', 1900, 1400, 0.7, -1.9, -1.8);
createDecorationBall('basketball', 350, 1100, 0.8, 1.4, 2.5);
createDecorationBall('basketball_blue', 1300, 1600, 0.75, -2.1, -1.3);
// Create title text
var titleText = new Text2('FLAPPY DUNK', {
size: 150,
fill: 0xFFFFFF
});
titleText.anchor.set(0.5, 0.5);
titleText.x = 2048 / 2;
titleText.y = 2732 / 3;
self.addChild(titleText);
// Add title shadow for better visibility
var titleShadow = new Text2('FLAPPY DUNK', {
size: 150,
fill: 0x4488FF
});
titleShadow.anchor.set(0.5, 0.5);
titleShadow.x = 2048 / 2 + 8;
titleShadow.y = 2732 / 3 + 8;
self.addChild(titleShadow);
self.addChild(titleText); // Re-add to put on top of shadow
// Create play button
var playButton = self.attachAsset('playButton', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 2.5,
scaleY: 1.5,
x: 2048 / 2,
y: 2732 / 2
});
// No play text needed
// Animate play button
tween(playButton, {
scaleX: 2.7,
scaleY: 1.7
}, {
duration: 800,
easing: tween.easeInOut,
onFinish: function onFinish() {
// Animation will repeat automatically with tweening back and forth
tween(playButton, {
scaleX: 2.5,
scaleY: 1.5
}, {
duration: 800,
easing: tween.easeInOut,
onFinish: function onFinish() {
// Create infinite animation loop
self.update = function () {
// Update decorative basketballs
for (var i = 0; i < balls.length; i++) {
var ball = balls[i];
// Apply physics
ball.speedY += ball.gravity;
ball.x += ball.speedX;
ball.y += ball.speedY;
// Bounce off walls
if (ball.x < ball.radius || ball.x > 2048 - ball.radius) {
ball.speedX *= -0.9;
if (ball.x < ball.radius) ball.x = ball.radius;
if (ball.x > 2048 - ball.radius) ball.x = 2048 - ball.radius;
}
// Bounce off floor
if (ball.y > 2732 - ball.radius) {
ball.y = 2732 - ball.radius;
ball.speedY = ball.bounce * 0.8;
ball.rotation += (Math.random() - 0.5) * 0.3; // More rotation on bounce
}
// Bounce off ceiling
if (ball.y < ball.radius) {
ball.y = ball.radius;
ball.speedY *= -0.8;
}
// More dynamic rotation based on speed
ball.rotation += ball.speedX * 0.02;
}
// Animate play button
if (!playButton.isTweening) {
tween(playButton, {
scaleX: playButton.scaleX === 2.5 ? 2.7 : 2.5,
scaleY: playButton.scaleY === 1.5 ? 1.7 : 1.5
}, {
duration: 800,
easing: tween.easeInOut
});
}
};
}
});
}
});
// Add subtitle
var subtitleText = new Text2('Tap to play!', {
size: 80,
fill: 0xFFFFFF
});
subtitleText.anchor.set(0.5, 0.5);
subtitleText.x = 2048 / 2;
subtitleText.y = 2732 / 2 + 200;
self.addChild(subtitleText);
// Make subtitle pulse
tween(subtitleText, {
alpha: 0.5
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(subtitleText, {
alpha: 1
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
// Create pulse loop for subtitle
LK.setInterval(function () {
if (!subtitleText.isTweening) {
tween(subtitleText, {
alpha: subtitleText.alpha === 1 ? 0.5 : 1
}, {
duration: 1000,
easing: tween.easeInOut
});
}
}, 50);
}
});
}
});
// Add decorative hoops in background
var decorativeHoop1 = self.attachAsset('hoop', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 2,
scaleY: 2,
x: 400,
y: 700,
rotation: Math.PI * 0.05
});
var decorativeHoop2 = self.attachAsset('hoop', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 1.5,
scaleY: 1.5,
x: 1700,
y: 1200,
rotation: -Math.PI * 0.05
});
// Event handlers
self.down = function () {
LK.getSound('click').play();
if (typeof self.onPlay === 'function') {
self.onPlay();
}
};
return self;
});
var SkinButton = Container.expand(function () {
var self = Container.call(this);
var buttonGraphics = self.attachAsset('skinButton', {
anchorX: 0.5,
anchorY: 0.5
});
self.down = function () {
LK.getSound('click').play();
self.scale.set(0.9, 0.9);
};
self.up = function () {
self.scale.set(1, 1);
if (typeof self.onTap === 'function') {
self.onTap();
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x000000
});
/****
* Game Code
****/
// Initialize assets used in this game. Scale them according to what is needed for the game.
game.setBackgroundColor(0x000000);
// Define available basketball skins
var basketballSkins = [{
id: '680131741362ae11fa646c61',
name: 'Classic'
}, {
id: '6801e9f12f9255a02dd2ec1c',
name: 'Blue'
}, {
id: '6801e9fb1362ae11fa647bb1',
name: 'Pink'
}];
// Initialize with default skin
var currentSkinIndex = 0;
// Game state management
var GAME_STATE = {
MENU: 0,
PLAYING: 1
};
var currentState = GAME_STATE.MENU;
// Main menu elements
var mainMenu = new MainMenu();
game.addChild(mainMenu);
// Game elements (initialized but not added to stage yet)
var basketball;
var hoops = [];
var hoop;
var scoreTxt;
var score = 0;
var skinButton;
var skinNameTxt;
// Initialize main menu
mainMenu.onPlay = function () {
// Hide menu
mainMenu.visible = false;
// Start game
startGame();
};
// Function to initialize and start the game
function startGame() {
currentState = GAME_STATE.PLAYING;
// Create basketball with initial skin
basketball = game.addChild(new Basketball());
basketball.x = 2048 / 4;
basketball.y = 2732 / 2;
basketball.scaleX = 1.5;
basketball.scaleY = 1.5;
// Create hoop
hoop = game.addChild(new Hoop());
hoop.x = 2048;
hoop.y = Math.random() * (2732 - 800) + 400;
hoop.scaleX = 3;
hoop.scaleY = 3;
hoop.scored = false;
hoops.push(hoop);
// Create score text
scoreTxt = new Text2('0', {
size: 150,
fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
// Create skin selection button
skinButton = new SkinButton();
skinButton.x = 150;
skinButton.y = 150;
skinButton.onTap = function () {
// Cycle through skins
currentSkinIndex = (currentSkinIndex + 1) % basketballSkins.length;
var newSkin = basketballSkins[currentSkinIndex];
// Update basketball skin
if (currentSkinIndex === 0) {
basketball.changeSkin('basketball');
} else if (currentSkinIndex === 1) {
basketball.changeSkin('basketball_blue');
} else if (currentSkinIndex === 2) {
basketball.changeSkin('basketball_pink');
}
// Update skin name text
skinNameTxt.setText(basketballSkins[currentSkinIndex].name);
};
LK.gui.topLeft.addChild(skinButton);
// Create skin name text
skinNameTxt = new Text2(basketballSkins[currentSkinIndex].name, {
size: 50,
fill: 0xFFFFFF
});
skinNameTxt.anchor.set(0.5, 0);
skinNameTxt.x = skinButton.x;
skinNameTxt.y = skinButton.y + 70;
LK.gui.topLeft.addChild(skinNameTxt);
}
game.down = function (x, y, obj) {
if (currentState === GAME_STATE.PLAYING) {
basketball.tap();
}
};
game.update = function () {
if (currentState === GAME_STATE.PLAYING) {
basketball.update();
for (var i = 0; i < hoops.length; i++) {
hoops[i].update();
if (!hoops[i].scored && basketball.intersects(hoops[i])) {
score += 10;
scoreTxt.setText(score);
LK.getSound('swish').play();
hoops[i].scored = true;
}
}
if (basketball.y > 2732 - basketball.height / 2 || basketball.y < basketball.height / 2 || basketball.x < basketball.width / 2 || basketball.x > 2048 - basketball.width / 2) {
LK.showGameOver();
}
}
};
LK.playMusic('bgmusic');
;
A Basketball. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows
A blue Basketball. In-Game asset. 2d. High contrast. No shadows
A pink Basketball. In-Game asset. 2d. High contrast. No shadows
A half blue and half pink Basketball. In-Game asset. 2d. High contrast. No shadows
A Play button. In-Game asset. 2d. High contrast. No shadows