Play
#AnimeClicker
#IncrementalGame
#AnimeMobile
#ClickerGame
#AnimeCharacters
Creation History
User prompt
make the character sprites look bigger ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Make the character sprite last a few seconds longer when touched ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Could you remove the eyes and mouths from the characters and just leave the sprites
User prompt
Okay. Now make the characters the player clicks on have two sprites. One that shows when not touched, and another that only shows when the character is touched. This applies to all characters the player clicks on. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Okay. Now when the player presses the "Warning" button, a window should appear with a message saying, "This game is in beta, so it may have bugs." ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
The reset button doesn't work. Pressing it would require a complete restart of the game. Relocking unlocked characters and resetting the score ↪💡 Consider importing and using the following plugins: @upit/storage.v1
User prompt
Now, add a main menu before starting the game. It should display the game title and three options: "Play," "Options," "Warning." In the "Options" section, add a red button that, when tapped, completely resets the game, erasing all saved data. ↪💡 Consider importing and using the following plugins: @upit/storage.v1, @upit/tween.v1
User prompt
Very good. Now the gameplay is more important. It adds animations every time a character is unlocked. And it adds many more characters to unlock. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
Code edit (1 edits merged)
Please save this source code
User prompt
Anime Clicker Paradise
Initial prompt
Make a clicker game with an anime theme. Each time you reach a certain number of clicks, unlock more characters to click on and earn more points faster.
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1");
/****
* Classes
****/
// 'menu', 'game', 'options'
var AnimeCharacter = Container.expand(function (characterId, pointValue) {
var self = Container.call(this);
self.characterId = characterId;
self.pointValue = pointValue;
self.isActive = false;
var characterGraphics = self.attachAsset('character' + characterId, {
anchorX: 0.5,
anchorY: 0.5
});
// Character face elements
var leftEye = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.2,
scaleY: 0.2
}));
leftEye.x = -40;
leftEye.y = -60;
var rightEye = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.2,
scaleY: 0.2
}));
rightEye.x = 40;
rightEye.y = -60;
var mouth = self.addChild(LK.getAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 0.3,
scaleY: 0.15
}));
mouth.x = 0;
mouth.y = 20;
self.playClickAnimation = function () {
// Main character bounce with higher intensity
tween(self, {
scaleX: 1.3,
scaleY: 1.3
}, {
duration: 80,
easing: tween.elasticOut
});
tween(self, {
scaleX: 1,
scaleY: 1
}, {
duration: 120,
easing: tween.bounceOut
});
// Character color flash based on point value
var flashColor = self.pointValue > 100 ? 0xFFD700 : self.pointValue > 50 ? 0xFF6347 : self.pointValue > 10 ? 0x32CD32 : 0xFFFFFF;
tween(characterGraphics, {
tint: flashColor
}, {
duration: 100,
easing: tween.linear
});
tween(characterGraphics, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
// Enhanced eye blink animation
tween(leftEye, {
scaleY: 0.05,
scaleX: 1.2
}, {
duration: 60
});
tween(leftEye, {
scaleY: 0.2,
scaleX: 0.2
}, {
duration: 80
});
tween(rightEye, {
scaleY: 0.05,
scaleX: 1.2
}, {
duration: 60
});
tween(rightEye, {
scaleY: 0.2,
scaleX: 0.2
}, {
duration: 80
});
// Mouth smile animation
tween(mouth, {
scaleX: 0.4,
scaleY: 0.25
}, {
duration: 150,
easing: tween.easeOut
});
tween(mouth, {
scaleX: 0.3,
scaleY: 0.15
}, {
duration: 150,
easing: tween.easeIn
});
};
self.setActive = function (active) {
self.isActive = active;
if (active) {
characterGraphics.alpha = 1.0;
} else {
characterGraphics.alpha = 0.7;
}
};
self.down = function (x, y, obj) {
if (self.isActive) {
totalClicks += self.pointValue;
LK.setScore(totalClicks);
scoreText.setText(totalClicks);
clickValueText.setText('+' + self.pointValue);
self.playClickAnimation();
LK.getSound('click').play();
checkUnlocks();
}
};
return self;
});
var CharacterSlot = Container.expand(function (characterId, unlockThreshold) {
var self = Container.call(this);
self.characterId = characterId;
self.unlockThreshold = unlockThreshold;
self.isUnlocked = false;
var slotBackground = self.attachAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5
});
var characterIcon = self.addChild(LK.getAsset('characterIcon' + characterId, {
anchorX: 0.5,
anchorY: 0.5
}));
characterIcon.alpha = 0.3;
var lockText = self.addChild(new Text2('?', {
size: 40,
fill: 0xFFFFFF
}));
lockText.anchor.set(0.5, 0.5);
lockText.y = 60;
self.unlock = function () {
if (!self.isUnlocked) {
self.isUnlocked = true;
characterIcon.alpha = 1.0;
lockText.setText('');
// Create spectacular unlock animation sequence
// First: Scale up dramatically
tween(self, {
scaleX: 2.0,
scaleY: 2.0
}, {
duration: 300,
easing: tween.elasticOut
});
// Second: Spin while scaling
tween(self, {
rotation: Math.PI * 2
}, {
duration: 500,
easing: tween.easeOut
});
// Third: Flash the icon color
tween(characterIcon, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
tween(characterIcon, {
tint: 0xFFFF00
}, {
duration: 150,
easing: tween.linear
});
tween(characterIcon, {
tint: 0xFFFFFF
}, {
duration: 100,
easing: tween.linear
});
// Fourth: Return to normal size with bounce
tween(self, {
scaleX: 1,
scaleY: 1,
rotation: 0
}, {
duration: 400,
easing: tween.bounceOut
});
// Flash screen effect
LK.effects.flashScreen(0xFFD700, 500);
LK.getSound('unlock').play();
}
};
self.updateLockText = function () {
if (!self.isUnlocked) {
var remaining = self.unlockThreshold - totalClicks;
if (remaining > 0) {
lockText.setText(remaining);
}
}
};
self.down = function (x, y, obj) {
if (self.isUnlocked) {
setActiveCharacter(self.characterId);
}
};
return self;
});
var MenuButton = Container.expand(function (text, color, action) {
var self = Container.call(this);
var buttonBackground = self.attachAsset('characterSlot', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 3,
scaleY: 1.5
});
buttonBackground.tint = color;
var buttonText = self.addChild(new Text2(text, {
size: 60,
fill: 0xFFFFFF
}));
buttonText.anchor.set(0.5, 0.5);
self.action = action;
self.down = function (x, y, obj) {
// Button press animation
tween(self, {
scaleX: 0.95,
scaleY: 0.95
}, {
duration: 100,
easing: tween.easeOut
});
tween(self, {
scaleX: 1,
scaleY: 1
}, {
duration: 100,
easing: tween.bounceOut
});
// Execute action after animation
LK.setTimeout(function () {
self.action();
}, 150);
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x2C3E50
});
/****
* Game Code
****/
// Game state management
// Menu elements
var gameState = 'menu';
var menuContainer = new Container();
var gameContainer = new Container();
var optionsContainer = new Container();
// Game variables
var totalClicks = storage.totalClicks || 0;
var currentCharacterId = storage.currentCharacterId || 1;
var characters = [];
var characterSlots = [];
var unlockedCharacters = storage.unlockedCharacters || [1];
// Create menu
function createMenu() {
var menuTitle = new Text2('Anime Clicker Paradise', {
size: 120,
fill: 0xE74C3C
});
menuTitle.anchor.set(0.5, 0.5);
menuTitle.x = 2048 / 2;
menuTitle.y = 800;
menuContainer.addChild(menuTitle);
var playButton = new MenuButton('Play', 0x27AE60, function () {
gameState = 'game';
showGame();
});
playButton.x = 2048 / 2;
playButton.y = 1200;
menuContainer.addChild(playButton);
var optionsButton = new MenuButton('Options', 0x3498DB, function () {
gameState = 'options';
showOptions();
});
optionsButton.x = 2048 / 2;
optionsButton.y = 1400;
menuContainer.addChild(optionsButton);
var warningButton = new MenuButton('Warning', 0xF39C12, function () {
// Show warning message
LK.effects.flashScreen(0xFF0000, 1000);
});
warningButton.x = 2048 / 2;
warningButton.y = 1600;
menuContainer.addChild(warningButton);
}
// Create options menu
function createOptions() {
var optionsTitle = new Text2('Options', {
size: 100,
fill: 0xFFFFFF
});
optionsTitle.anchor.set(0.5, 0.5);
optionsTitle.x = 2048 / 2;
optionsTitle.y = 600;
optionsContainer.addChild(optionsTitle);
var resetButton = new MenuButton('Reset Game', 0xE74C3C, function () {
// Clear all saved data
storage.totalClicks = 0;
storage.currentCharacterId = 1;
storage.unlockedCharacters = [1];
// Reset all game variables
totalClicks = 0;
currentCharacterId = 1;
unlockedCharacters = [1];
// Reset score display
LK.setScore(0);
scoreText.setText('0');
clickValueText.setText('+1');
// Reset all character slots to locked state
for (var i = 0; i < characterSlots.length; i++) {
characterSlots[i].isUnlocked = false;
characterSlots[i].children[1].alpha = 0.3; // characterIcon
characterSlots[i].children[2].setText('?'); // lockText
}
// Unlock only the first character
characterSlots[0].unlock();
// Reset active character to first one
setActiveCharacter(1);
// Update all lock texts
for (var i = 0; i < characterSlots.length; i++) {
characterSlots[i].updateLockText();
}
// Flash screen to show reset
LK.effects.flashScreen(0xFF0000, 1500);
// Return to menu after reset
LK.setTimeout(function () {
gameState = 'menu';
showMenu();
}, 1500);
});
resetButton.x = 2048 / 2;
resetButton.y = 1200;
optionsContainer.addChild(resetButton);
var backButton = new MenuButton('Back', 0x95A5A6, function () {
gameState = 'menu';
showMenu();
});
backButton.x = 2048 / 2;
backButton.y = 1600;
optionsContainer.addChild(backButton);
}
function showMenu() {
menuContainer.visible = true;
gameContainer.visible = false;
optionsContainer.visible = false;
}
function showGame() {
menuContainer.visible = false;
gameContainer.visible = true;
optionsContainer.visible = false;
}
function showOptions() {
menuContainer.visible = false;
gameContainer.visible = false;
optionsContainer.visible = true;
}
// Character data
var characterData = [{
id: 1,
points: 1,
unlockAt: 0
}, {
id: 2,
points: 2,
unlockAt: 50
}, {
id: 3,
points: 5,
unlockAt: 200
}, {
id: 4,
points: 10,
unlockAt: 500
}, {
id: 5,
points: 20,
unlockAt: 1000
}, {
id: 6,
points: 35,
unlockAt: 2000
}, {
id: 7,
points: 60,
unlockAt: 4000
}, {
id: 8,
points: 100,
unlockAt: 7500
}, {
id: 9,
points: 175,
unlockAt: 12000
}, {
id: 10,
points: 300,
unlockAt: 20000
}, {
id: 11,
points: 500,
unlockAt: 35000
}, {
id: 12,
points: 850,
unlockAt: 60000
}, {
id: 13,
points: 1400,
unlockAt: 100000
}, {
id: 14,
points: 2500,
unlockAt: 175000
}, {
id: 15,
points: 5000,
unlockAt: 300000
}];
// Initialize all containers
game.addChild(menuContainer);
game.addChild(gameContainer);
game.addChild(optionsContainer);
// Create menu and options
createMenu();
createOptions();
// UI Elements for game
var scoreText = new Text2(totalClicks.toString(), {
size: 80,
fill: 0xFFFFFF
});
scoreText.anchor.set(0.5, 0);
var clickValueText = new Text2('+1', {
size: 60,
fill: 0xF1C40F
});
clickValueText.anchor.set(0.5, 0.5);
clickValueText.x = 2048 / 2;
clickValueText.y = 800;
clickValueText.alpha = 0;
gameContainer.addChild(clickValueText);
var titleText = new Text2('Anime Clicker Paradise', {
size: 50,
fill: 0xE74C3C
});
titleText.anchor.set(0.5, 0);
titleText.y = 100;
// Create characters
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
var character = new AnimeCharacter(charData.id, charData.points);
character.x = 2048 / 2;
character.y = 1200;
character.visible = false;
characters.push(character);
gameContainer.addChild(character);
}
// Create character selection slots
var slotsPerRow = 5;
var slotSpacing = 140;
var rowSpacing = 150;
var startY = 2100;
var totalRows = Math.ceil(characterData.length / slotsPerRow);
var slotStartX = (2048 - slotsPerRow * slotSpacing) / 2 + 70;
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
var slot = new CharacterSlot(charData.id, charData.unlockAt);
var row = Math.floor(i / slotsPerRow);
var col = i % slotsPerRow;
var rowWidth = Math.min(characterData.length - row * slotsPerRow, slotsPerRow);
var rowStartX = (2048 - rowWidth * slotSpacing) / 2 + 70;
slot.x = rowStartX + col * slotSpacing;
slot.y = startY + row * rowSpacing;
characterSlots.push(slot);
gameContainer.addChild(slot);
}
// Add GUI elements only when in game state
function updateGUI() {
if (gameState === 'game') {
if (scoreText.parent !== LK.gui.top) {
LK.gui.top.addChild(scoreText);
}
if (titleText.parent !== LK.gui.top) {
LK.gui.top.addChild(titleText);
}
} else {
if (scoreText.parent) {
scoreText.parent.removeChild(scoreText);
}
if (titleText.parent) {
titleText.parent.removeChild(titleText);
}
}
}
function setActiveCharacter(characterId) {
// Hide all characters
for (var i = 0; i < characters.length; i++) {
characters[i].visible = false;
characters[i].setActive(false);
}
// Show and activate selected character
var character = characters[characterId - 1];
character.visible = true;
character.setActive(true);
currentCharacterId = characterId;
// Update click value display
clickValueText.setText('+' + character.pointValue);
// Save progress
storage.currentCharacterId = currentCharacterId;
}
function checkUnlocks() {
for (var i = 0; i < characterData.length; i++) {
var charData = characterData[i];
if (totalClicks >= charData.unlockAt && unlockedCharacters.indexOf(charData.id) === -1) {
unlockedCharacters.push(charData.id);
characterSlots[i].unlock();
}
}
// Update lock text on all slots
for (var i = 0; i < characterSlots.length; i++) {
characterSlots[i].updateLockText();
}
// Save progress
storage.totalClicks = totalClicks;
storage.unlockedCharacters = unlockedCharacters;
}
// Initialize unlocked characters
for (var i = 0; i < unlockedCharacters.length; i++) {
var charId = unlockedCharacters[i];
characterSlots[charId - 1].unlock();
}
// Set initial active character
setActiveCharacter(currentCharacterId);
// Initialize score
LK.setScore(totalClicks);
// Start with menu
showMenu();
// Click value text animation
var clickValueAlpha = 0;
var clickValueFadeTimer = 0;
game.update = function () {
// Update GUI based on state
updateGUI();
// Only run game logic when in game state
if (gameState === 'game') {
// Animate click value text
if (clickValueAlpha > 0) {
clickValueFadeTimer--;
if (clickValueFadeTimer <= 0) {
clickValueAlpha -= 0.02;
if (clickValueAlpha < 0) clickValueAlpha = 0;
clickValueText.alpha = clickValueAlpha;
}
}
// Check for new unlocks periodically
if (LK.ticks % 60 === 0) {
checkUnlocks();
}
}
};
// Show click value when character is clicked (only in game state)
var originalDown = game.down;
game.down = function (x, y, obj) {
if (gameState === 'game') {
clickValueAlpha = 1;
clickValueFadeTimer = 30;
clickValueText.alpha = clickValueAlpha;
}
if (originalDown) {
originalDown(x, y, obj);
}
}; ===================================================================
--- original.js
+++ change.js
@@ -330,8 +330,30 @@
// Clear all saved data
storage.totalClicks = 0;
storage.currentCharacterId = 1;
storage.unlockedCharacters = [1];
+ // Reset all game variables
+ totalClicks = 0;
+ currentCharacterId = 1;
+ unlockedCharacters = [1];
+ // Reset score display
+ LK.setScore(0);
+ scoreText.setText('0');
+ clickValueText.setText('+1');
+ // Reset all character slots to locked state
+ for (var i = 0; i < characterSlots.length; i++) {
+ characterSlots[i].isUnlocked = false;
+ characterSlots[i].children[1].alpha = 0.3; // characterIcon
+ characterSlots[i].children[2].setText('?'); // lockText
+ }
+ // Unlock only the first character
+ characterSlots[0].unlock();
+ // Reset active character to first one
+ setActiveCharacter(1);
+ // Update all lock texts
+ for (var i = 0; i < characterSlots.length; i++) {
+ characterSlots[i].updateLockText();
+ }
// Flash screen to show reset
LK.effects.flashScreen(0xFF0000, 1500);
// Return to menu after reset
LK.setTimeout(function () {
Showing 1 to 11 of 11
Images
:quality(85)/https://cdn.frvr.ai/6864a68ffc154f57a61d90c3.png%3F3)
Beautiful anime style girl, with white hair and gray eyes. In-Game asset. 2d. High contrast. No shadows. Pixel art
:quality(85)/https://cdn.frvr.ai/6864a6dffc154f57a61d90cd.png%3F3)
Make her blush and put on a shy expression
:quality(85)/https://cdn.frvr.ai/68654bc1682961abc48b10ff.png%3F3)
Beautiful anime-style girl with black hair and red eyes. Game image. 2D. High contrast. No shadows. Pixel art.. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68654bfe682961abc48b110a.png%3F3)
Make her blush and put on a shy expression
:quality(85)/https://cdn.frvr.ai/68654ef2682961abc48b1114.png%3F3)
Beautiful anime-style girl with gray hair and light blue eyes. Game image. 2D. High contrast. No shadows. Pixel art.. In-Game asset. 2d. High contrast. No shadows
:quality(85)/https://cdn.frvr.ai/68654fd1682961abc48b111d.png%3F3)
Make her blush and put on a shy expression
Sounds & Music
Used plugins
@upit/tween@upit/storage
