Play
:quality(85)/https:%2F%2Fcdn.frvr.ai/686461ecc7ed99a210e62ea9.png)
:quality(85)/https:%2F%2Fcdn.frvr.ai/68646174c7ed99a210e62ea4.png)
#ClickerGame
#BananaEvolution
#IdleGame
#TapToEarn
#UpgradeGame
Creation History
User prompt
Haz más grande a la banana, que se pueda ver bien! Y resaltala ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Añade un fondo qué pueda poner una imagen
User prompt
Add a nice animation when you click on the banana and you can buy different skins of the banana and make the interface next to the banana bigger. ↪💡 Consider importing and using the following plugins: @upit/tween.v1, @upit/storage.v1
Code edit (1 edits merged)
Please save this source code
User prompt
Banana Evolution Clicker
Initial prompt
Quiero hacer un juego clicker donde solo tengas qué clickear un platano y te dará dinero para que lo puedas ir evolucionando
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1");
/****
* Classes
****/
var Banana = Container.expand(function () {
var self = Container.call(this);
self.currentSkin = storage.currentBananaSkin || 'banana';
var bananaGraphics = self.attachAsset(self.currentSkin, {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 1.5,
scaleY: 1.5
});
self.evolutionStage = 0;
self.evolutionColors = [0xFFD700, 0xFF8C00, 0xFF4500, 0x8B4513, 0x800080, 0x00FFFF];
// Add pulsing highlight animation
self.addHighlightPulse = function () {
tween(bananaGraphics, {
scaleX: 1.6,
scaleY: 1.6
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(bananaGraphics, {
scaleX: 1.5,
scaleY: 1.5
}, {
duration: 1000,
easing: tween.easeInOut,
onFinish: function onFinish() {
self.addHighlightPulse();
}
});
}
});
};
// Start the pulsing animation
self.addHighlightPulse();
self.changeSkin = function (skinName) {
self.removeChild(bananaGraphics);
self.currentSkin = skinName;
bananaGraphics = self.attachAsset(skinName, {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 1.5,
scaleY: 1.5
});
storage.currentBananaSkin = skinName;
// Restart pulsing animation for new skin
self.addHighlightPulse();
};
self.evolve = function () {
if (self.evolutionStage < self.evolutionColors.length - 1) {
self.evolutionStage++;
bananaGraphics.tint = self.evolutionColors[self.evolutionStage];
// Scale animation for evolution
tween(bananaGraphics, {
scaleX: 1.8,
scaleY: 1.8
}, {
duration: 200,
onFinish: function onFinish() {
tween(bananaGraphics, {
scaleX: 1.5,
scaleY: 1.5
}, {
duration: 200
});
}
});
LK.getSound('evolution').play();
LK.effects.flashScreen(0xFFD700, 500);
}
};
self.down = function (x, y, obj) {
// Enhanced click animation with juice effects
tween(bananaGraphics, {
scaleX: 1.25,
scaleY: 1.25,
rotation: 0.2
}, {
duration: 80,
easing: tween.easeOut,
onFinish: function onFinish() {
tween(bananaGraphics, {
scaleX: 1.65,
scaleY: 1.65,
rotation: -0.1
}, {
duration: 120,
easing: tween.bounceOut,
onFinish: function onFinish() {
tween(bananaGraphics, {
scaleX: 1.5,
scaleY: 1.5,
rotation: 0
}, {
duration: 100,
easing: tween.easeOut
});
}
});
}
});
// Screen shake effect
tween(game, {
x: 5
}, {
duration: 50,
onFinish: function onFinish() {
tween(game, {
x: -5
}, {
duration: 50,
onFinish: function onFinish() {
tween(game, {
x: 0
}, {
duration: 50
});
}
});
}
});
// Particle-like effect with multiple floating coins
for (var p = 0; p < 3; p++) {
var coinEffect = game.addChild(LK.getAsset('coinIcon', {
anchorX: 0.5,
anchorY: 0.5
}));
coinEffect.x = self.x + (Math.random() - 0.5) * 100;
coinEffect.y = self.y + (Math.random() - 0.5) * 100;
coinEffect.scale.set(0.5);
tween(coinEffect, {
y: coinEffect.y - 150,
alpha: 0,
scaleX: 1.5,
scaleY: 1.5,
rotation: Math.random() * Math.PI * 2
}, {
duration: 800,
easing: tween.easeOut,
onFinish: function onFinish() {
coinEffect.destroy();
}
});
}
// Earn coins based on click value
coins += clickValue;
updateCoinDisplay();
// Visual feedback
createFloatingText('+' + clickValue, self.x, self.y - 150);
LK.getSound('click').play();
// Check for evolution milestones
if (totalClicks % 100 === 0) {
self.evolve();
}
totalClicks++;
};
return self;
});
var FloatingText = Container.expand(function (text, startX, startY) {
var self = Container.call(this);
var textDisplay = new Text2(text, {
size: 50,
fill: 0xFFD700
});
textDisplay.anchor.set(0.5, 0.5);
self.addChild(textDisplay);
self.x = startX;
self.y = startY;
// Animate floating text
tween(self, {
y: self.y - 100,
alpha: 0
}, {
duration: 1000,
easing: tween.easeOut,
onFinish: function onFinish() {
self.destroy();
}
});
return self;
});
var SkinShopButton = Container.expand(function (skinData) {
var self = Container.call(this);
self.skinData = skinData;
self.owned = storage.ownedSkins && storage.ownedSkins[skinData.id] || false;
var buttonBg = self.attachAsset('shopButton', {
anchorX: 0.5,
anchorY: 0.5
});
var titleText = new Text2(skinData.name, {
size: 35,
fill: 0xFFFFFF
});
titleText.anchor.set(0.5, 0.5);
titleText.y = -20;
self.addChild(titleText);
var statusText = new Text2('', {
size: 28,
fill: 0xFFFFFF
});
statusText.anchor.set(0.5, 0.5);
statusText.y = 20;
self.addChild(statusText);
self.updateDisplay = function () {
if (self.owned) {
if (banana.currentSkin === self.skinData.assetId) {
statusText.setText('EQUIPPED');
buttonBg.tint = 0x00ff00;
} else {
statusText.setText('OWNED - TAP TO EQUIP');
buttonBg.tint = 0x4169e1;
}
} else {
statusText.setText('Cost: ' + self.skinData.cost);
if (coins >= self.skinData.cost) {
buttonBg.tint = 0xff6b35;
} else {
buttonBg.tint = 0x808080;
}
}
};
self.down = function (x, y, obj) {
if (self.owned) {
// Equip skin
banana.changeSkin(self.skinData.assetId);
updateSkinShopDisplay();
LK.getSound('click').play();
} else if (coins >= self.skinData.cost) {
// Purchase skin
coins -= self.skinData.cost;
self.owned = true;
if (!storage.ownedSkins) storage.ownedSkins = {};
storage.ownedSkins[self.skinData.id] = true;
storage.coins = coins;
banana.changeSkin(self.skinData.assetId);
updateCoinDisplay();
updateSkinShopDisplay();
LK.getSound('purchase').play();
LK.effects.flashScreen(0xffd700, 300);
}
// Purchase animation
tween(buttonBg, {
scaleX: 1.1,
scaleY: 1.1
}, {
duration: 150,
onFinish: function onFinish() {
tween(buttonBg, {
scaleX: 1,
scaleY: 1
}, {
duration: 150
});
}
});
};
return self;
});
var UpgradeButton = Container.expand(function (upgradeData) {
var self = Container.call(this);
self.upgradeData = upgradeData;
var buttonBg = self.attachAsset('upgradeButton', {
anchorX: 0.5,
anchorY: 0.5
});
var titleText = new Text2(upgradeData.name, {
size: 40,
fill: 0xFFFFFF
});
titleText.anchor.set(0.5, 0.5);
titleText.y = -15;
self.addChild(titleText);
var costText = new Text2('Cost: ' + upgradeData.cost, {
size: 30,
fill: 0xFFFFFF
});
costText.anchor.set(0.5, 0.5);
costText.y = 15;
self.addChild(costText);
self.updateDisplay = function () {
costText.setText('Cost: ' + self.upgradeData.cost);
if (coins >= self.upgradeData.cost) {
buttonBg.tint = 0x4CAF50;
} else {
buttonBg.tint = 0x808080;
}
};
self.down = function (x, y, obj) {
if (coins >= self.upgradeData.cost) {
coins -= self.upgradeData.cost;
self.upgradeData.apply();
self.upgradeData.cost = Math.floor(self.upgradeData.cost * 1.5);
self.updateDisplay();
updateCoinDisplay();
LK.getSound('upgrade').play();
// Purchase animation
tween(buttonBg, {
scaleX: 1.1,
scaleY: 1.1
}, {
duration: 150,
onFinish: function onFinish() {
tween(buttonBg, {
scaleX: 1,
scaleY: 1
}, {
duration: 150
});
}
});
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x87CEEB
});
/****
* Game Code
****/
// Game variables
var coins = storage.coins || 0;
var clickValue = storage.clickValue || 1;
var autoClickerCount = storage.autoClickerCount || 0;
var autoClickerPower = storage.autoClickerPower || 1;
var totalClicks = storage.totalClicks || 0;
// UI elements
var coinDisplay;
var banana;
var upgradeButtons = [];
var skinShopButtons = [];
var floatingTexts = [];
// Initialize coin display
coinDisplay = new Text2('Coins: ' + coins, {
size: 80,
fill: 0xFFFFFF
});
coinDisplay.anchor.set(0.5, 0);
LK.gui.top.addChild(coinDisplay);
coinDisplay.y = 150;
// Add background image
var background = game.addChild(LK.getAsset('background', {
anchorX: 0,
anchorY: 0
}));
background.x = 0;
background.y = 0;
// Create banana
banana = game.addChild(new Banana());
banana.x = 2048 / 2;
banana.y = 2732 / 2 - 300;
// Upgrade definitions
var upgrades = [{
name: "Better Click",
cost: storage.betterClickCost || 10,
apply: function apply() {
clickValue += 1;
storage.clickValue = clickValue;
}
}, {
name: "Auto Clicker",
cost: storage.autoClickerCost || 50,
apply: function apply() {
autoClickerCount += 1;
storage.autoClickerCount = autoClickerCount;
}
}, {
name: "Click Multiplier",
cost: storage.multiplierCost || 200,
apply: function apply() {
clickValue *= 2;
storage.clickValue = clickValue;
}
}, {
name: "Auto Power Up",
cost: storage.autoPowerCost || 500,
apply: function apply() {
autoClickerPower += 2;
storage.autoClickerPower = autoClickerPower;
}
}];
// Skin shop definitions
var skins = [{
id: 'golden',
name: 'Golden Banana',
assetId: 'banana_golden',
cost: 100
}, {
id: 'rainbow',
name: 'Rainbow Banana',
assetId: 'banana_rainbow',
cost: 500
}, {
id: 'crystal',
name: 'Crystal Banana',
assetId: 'banana_crystal',
cost: 1000
}];
// Create skin shop title
var shopTitle = new Text2('BANANA SKINS', {
size: 60,
fill: 0xFFFFFF
});
shopTitle.anchor.set(0.5, 0.5);
shopTitle.x = 1500;
shopTitle.y = 300;
game.addChild(shopTitle);
// Create skin shop buttons
for (var i = 0; i < skins.length; i++) {
var skinButton = game.addChild(new SkinShopButton(skins[i]));
skinButton.x = 1500;
skinButton.y = 450 + i * 120;
skinShopButtons.push(skinButton);
}
// Create upgrade buttons
for (var i = 0; i < upgrades.length; i++) {
var button = game.addChild(new UpgradeButton(upgrades[i]));
button.x = 600;
button.y = 1400 + i * 150;
upgradeButtons.push(button);
}
// Helper functions
function updateCoinDisplay() {
coinDisplay.setText('Coins: ' + Math.floor(coins));
// Update upgrade button states
for (var i = 0; i < upgradeButtons.length; i++) {
upgradeButtons[i].updateDisplay();
}
// Update skin shop button states
updateSkinShopDisplay();
// Save progress
storage.coins = coins;
storage.totalClicks = totalClicks;
storage.betterClickCost = upgrades[0].cost;
storage.autoClickerCost = upgrades[1].cost;
storage.multiplierCost = upgrades[2].cost;
storage.autoPowerCost = upgrades[3].cost;
}
function updateSkinShopDisplay() {
for (var i = 0; i < skinShopButtons.length; i++) {
skinShopButtons[i].updateDisplay();
}
}
function createFloatingText(text, x, y) {
var floatingText = game.addChild(new FloatingText(text, x, y));
floatingTexts.push(floatingText);
}
// Auto clicker timer
var autoClickerTimer = 0;
// Initial display update
updateCoinDisplay();
for (var i = 0; i < upgradeButtons.length; i++) {
upgradeButtons[i].updateDisplay();
}
updateSkinShopDisplay();
game.update = function () {
// Auto clicker functionality
if (autoClickerCount > 0) {
autoClickerTimer++;
if (autoClickerTimer >= 60) {
// Auto click every second (60 ticks)
autoClickerTimer = 0;
var autoEarnings = autoClickerCount * autoClickerPower;
coins += autoEarnings;
updateCoinDisplay();
// Show auto earning feedback occasionally
if (LK.ticks % 180 === 0) {
// Every 3 seconds
createFloatingText('+' + autoEarnings + ' (auto)', banana.x + 150, banana.y);
}
}
}
// Clean up destroyed floating texts
for (var i = floatingTexts.length - 1; i >= 0; i--) {
if (!floatingTexts[i].parent) {
floatingTexts.splice(i, 1);
}
}
}; ===================================================================
--- original.js
+++ change.js
@@ -11,35 +11,65 @@
var self = Container.call(this);
self.currentSkin = storage.currentBananaSkin || 'banana';
var bananaGraphics = self.attachAsset(self.currentSkin, {
anchorX: 0.5,
- anchorY: 0.5
+ anchorY: 0.5,
+ scaleX: 1.5,
+ scaleY: 1.5
});
self.evolutionStage = 0;
self.evolutionColors = [0xFFD700, 0xFF8C00, 0xFF4500, 0x8B4513, 0x800080, 0x00FFFF];
+ // Add pulsing highlight animation
+ self.addHighlightPulse = function () {
+ tween(bananaGraphics, {
+ scaleX: 1.6,
+ scaleY: 1.6
+ }, {
+ duration: 1000,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ tween(bananaGraphics, {
+ scaleX: 1.5,
+ scaleY: 1.5
+ }, {
+ duration: 1000,
+ easing: tween.easeInOut,
+ onFinish: function onFinish() {
+ self.addHighlightPulse();
+ }
+ });
+ }
+ });
+ };
+ // Start the pulsing animation
+ self.addHighlightPulse();
self.changeSkin = function (skinName) {
self.removeChild(bananaGraphics);
self.currentSkin = skinName;
bananaGraphics = self.attachAsset(skinName, {
anchorX: 0.5,
- anchorY: 0.5
+ anchorY: 0.5,
+ scaleX: 1.5,
+ scaleY: 1.5
});
storage.currentBananaSkin = skinName;
+ // Restart pulsing animation for new skin
+ self.addHighlightPulse();
};
self.evolve = function () {
if (self.evolutionStage < self.evolutionColors.length - 1) {
self.evolutionStage++;
bananaGraphics.tint = self.evolutionColors[self.evolutionStage];
// Scale animation for evolution
tween(bananaGraphics, {
- scaleX: 1.3,
- scaleY: 1.3
+ scaleX: 1.8,
+ scaleY: 1.8
}, {
duration: 200,
onFinish: function onFinish() {
tween(bananaGraphics, {
- scaleX: 1,
- scaleY: 1
+ scaleX: 1.5,
+ scaleY: 1.5
}, {
duration: 200
});
}
@@ -50,26 +80,26 @@
};
self.down = function (x, y, obj) {
// Enhanced click animation with juice effects
tween(bananaGraphics, {
- scaleX: 0.85,
- scaleY: 0.85,
+ scaleX: 1.25,
+ scaleY: 1.25,
rotation: 0.2
}, {
duration: 80,
easing: tween.easeOut,
onFinish: function onFinish() {
tween(bananaGraphics, {
- scaleX: 1.1,
- scaleY: 1.1,
+ scaleX: 1.65,
+ scaleY: 1.65,
rotation: -0.1
}, {
duration: 120,
easing: tween.bounceOut,
onFinish: function onFinish() {
tween(bananaGraphics, {
- scaleX: 1,
- scaleY: 1,
+ scaleX: 1.5,
+ scaleY: 1.5,
rotation: 0
}, {
duration: 100,
easing: tween.easeOut
Showing 1 to 6 of 6
Images
:quality(85)/https:%2F%2Fcdn.frvr.ai/68645c1dc7ed99a210e62e57.png%3F3)
A yellow button. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
:quality(85)/https:%2F%2Fcdn.frvr.ai/68645d83c7ed99a210e62e61.png%3F3)
Banana crystal . No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
:quality(85)/https:%2F%2Fcdn.frvr.ai/68645db7c7ed99a210e62e66.png%3F3)
Banana rainbow . No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
:quality(85)/https:%2F%2Fcdn.frvr.ai/68645e5cc7ed99a210e62e72.png%3F3)
Mini banana. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https:%2F%2Fcdn.frvr.ai/68645ec6c7ed99a210e62e77.png%3F3)
Banana golden. No background. Transparent background. Blank background. No shadows. 2d. In-Game asset. flat
:quality(85)/https:%2F%2Fcdn.frvr.ai/6864607bc7ed99a210e62e9d.png%3F3)
relaxing banana tree landscape. In-Game asset. 2d. High contrast. No shadows
Used plugins
@upit/tween@upit/storage
