/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");

/**** 
* Classes
****/ 
// Beat Particle
var BeatParticle = Container.expand(function () {
	var self = Container.call(this);
	var p = self.attachAsset('beatParticle', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.vx = 0;
	self.vy = 0;
	self.alpha = 1;
	self.scale = 1;
	self.update = function () {
		self.x += self.vx;
		self.y += self.vy;
		self.scale += 0.02;
		self.alpha -= 0.018;
		p.scaleX = p.scaleY = self.scale;
		if (self.alpha <= 0) {
			self.destroyed = true;
		}
	};
	return self;
});
// Beatboxer Character
var Beatboxer = Container.expand(function () {
	var self = Container.call(this);
	// Body
	var body = self.attachAsset('beatboxerBody', {
		anchorX: 0.5,
		anchorY: 1
	});
	body.y = 0;
	// Head
	var head = self.attachAsset('beatboxerHead', {
		anchorX: 0.5,
		anchorY: 1
	});
	head.y = -340;
	// Headphones
	var headphones = self.attachAsset('headphones', {
		anchorX: 0.5,
		anchorY: 1
	});
	headphones.y = -370;
	// Hoodie
	var hoodie = self.attachAsset('hoodie', {
		anchorX: 0.5,
		anchorY: 1
	});
	hoodie.y = -260;
	// Sneakers
	var sneakerL = self.attachAsset('sneakerL', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	sneakerL.x = -70;
	sneakerL.y = 20;
	var sneakerR = self.attachAsset('sneakerR', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	sneakerR.x = 70;
	sneakerR.y = 20;
	// Mouth (for animation)
	var mouth = self.attachAsset('mouth', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	mouth.y = -270;
	self.mouth = mouth;
	// Animate mouth open/close
	self.beat = function () {
		// Animate mouth open
		tween(mouth, {
			height: 60
		}, {
			duration: 80,
			easing: tween.cubicOut,
			onFinish: function onFinish() {
				// Animate mouth close
				tween(mouth, {
					height: 30
				}, {
					duration: 120,
					easing: tween.cubicIn
				});
			}
		});
		// Animate head bob
		tween(head, {
			y: -350
		}, {
			duration: 60,
			easing: tween.cubicOut,
			onFinish: function onFinish() {
				tween(head, {
					y: -340
				}, {
					duration: 100,
					easing: tween.cubicIn
				});
			}
		});
		// Animate body bounce
		tween(body, {
			y: 10
		}, {
			duration: 60,
			easing: tween.cubicOut,
			onFinish: function onFinish() {
				tween(body, {
					y: 0
				}, {
					duration: 100,
					easing: tween.cubicIn
				});
			}
		});
	};
	return self;
});
// Music Note Particle
var MusicNote = Container.expand(function () {
	var self = Container.call(this);
	var note = self.attachAsset('musicNote', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var dot = self.attachAsset('noteDot', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	dot.x = 18;
	dot.y = 18;
	self.note = note;
	self.dot = dot;
	self.vx = 0;
	self.vy = 0;
	self.alpha = 1;
	self.update = function () {
		self.x += self.vx;
		self.y += self.vy;
		self.alpha -= 0.012;
		if (self.alpha <= 0) {
			self.destroyed = true;
		}
	};
	return self;
});
// Soundwave
var Soundwave = Container.expand(function () {
	var self = Container.call(this);
	var sw = self.attachAsset('soundwave', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.sw = sw;
	self.alpha = 1;
	self.scale = 1;
	self.update = function () {
		self.scale += 0.04;
		self.alpha -= 0.025;
		sw.scaleX = sw.scaleY = self.scale;
		if (self.alpha <= 0) {
			self.destroyed = true;
		}
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x0a0a1a
});

/**** 
* Game Code
****/ 
// Music
// Sound
// Soundwave
// Slogan Neon Bar
// Beat Particle
// Music Note
// Breath Meter
// Red Tap Button
// Character: Big, cartoon beatboxer with headphones, hoodie, sneakers
// --- Neon Slogan at Top ---
var sloganBar = LK.getAsset('neonBar', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 110
});
game.addChild(sloganBar);
var sloganText = new Text2('BEATBOX TAP STAR', {
	size: 90,
	fill: 0x00FFFF,
	font: "Impact, 'Arial Black', Tahoma"
});
sloganText.anchor.set(0.5, 0.5);
sloganText.x = 2048 / 2;
sloganText.y = 110;
game.addChild(sloganText);
// --- Score & Nickname Box (top right, not in top 100x100) ---
var scoreBox = new Container();
var scoreBg = LK.getAsset('breathBarBg', {
	width: 340,
	height: 120,
	color: 0x111133,
	anchorX: 1,
	anchorY: 0
});
scoreBox.addChild(scoreBg);
scoreBox.x = 2048 - 40;
scoreBox.y = 120;
var scoreText = new Text2('Score: 0', {
	size: 60,
	fill: "#fff"
});
scoreText.anchor.set(1, 0);
scoreText.x = 320;
scoreText.y = 18;
scoreBox.addChild(scoreText);
var nicknameText = new Text2('You', {
	size: 38,
	fill: 0x00FFFF
});
nicknameText.anchor.set(1, 0);
nicknameText.x = 320;
nicknameText.y = 70;
scoreBox.addChild(nicknameText);
game.addChild(scoreBox);
// --- Breath Meter (right side, vertical) ---
var breathBarBg = LK.getAsset('breathBarBg', {
	anchorX: 0.5,
	anchorY: 1,
	x: 1960,
	y: 1800
});
game.addChild(breathBarBg);
var breathBarFill = LK.getAsset('breathBarFill', {
	anchorX: 0.5,
	anchorY: 1,
	x: 1960,
	y: 1800
});
game.addChild(breathBarFill);
var breathBarDanger = LK.getAsset('breathBarDanger', {
	anchorX: 0.5,
	anchorY: 1,
	x: 1960,
	y: 1800
});
breathBarDanger.visible = false;
game.addChild(breathBarDanger);
// --- Beatboxer Character (center stage) ---
// Character switching logic
// Character style 0: Blue square placeholder
var characterPlaceholder0 = LK.getAsset('characterPlaceholder', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2350
});
// Character style 1: Pink ellipse placeholder
var characterPlaceholder1 = LK.getAsset('beatboxerHead', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2350,
	color: 0xff66cc
});
characterPlaceholder1.visible = false;
// Character style 2: Green box placeholder
var characterPlaceholder2 = LK.getAsset('beatParticle', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2350,
	color: 0x00ffcc
});
characterPlaceholder2.visible = false;
game.addChild(characterPlaceholder0);
game.addChild(characterPlaceholder1);
game.addChild(characterPlaceholder2);
// Track which character is currently shown (0, 1, 2)
var characterStyle = 0;
var characterList = [characterPlaceholder0, characterPlaceholder1, characterPlaceholder2];
// --- Beatboxer character instance (hidden by default, added to game and characterList) ---
var beatboxer = new Beatboxer();
beatboxer.x = 2048 / 2;
beatboxer.y = 2350;
beatboxer.visible = false;
game.addChild(beatboxer);
characterList.push(beatboxer);
// --- Tap Button (bottom center) ---
var tapButtonGlow = LK.getAsset('tapButtonGlow', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2500
});
tapButtonGlow.alpha = 0.3;
game.addChild(tapButtonGlow);
var tapButton = LK.getAsset('tapButton', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2500
});
game.addChild(tapButton);
var tapText = new Text2('TAP!', {
	size: 90,
	fill: "#fff"
});
tapText.anchor.set(0.5, 0.5);
tapText.x = 2048 / 2;
tapText.y = 2500;
game.addChild(tapText);
// --- Animated Background Particles ---
var musicNotes = [];
var beatParticles = [];
var soundwaves = [];
// --- Game State ---
var breath = 1; // 0-1
var breathDrainPerTick = 0.0022; // Drains in ~20s if not tapping
var breathGainPerTap = 0.13;
var breathDangerThreshold = 0.18;
var score = 0;
var isGameOver = false;
var canTap = true;
var lastTapTick = 0;
// --- Helper: Update Breath Meter Visuals ---
function updateBreathBar() {
	var maxHeight = 660;
	var fillHeight = Math.max(0, Math.min(1, breath)) * maxHeight;
	breathBarFill.height = fillHeight;
	breathBarFill.y = 1800;
	breathBarFill.x = 1960;
	breathBarFill.visible = breath > breathDangerThreshold;
	breathBarDanger.height = fillHeight;
	breathBarDanger.y = 1800;
	breathBarDanger.x = 1960;
	breathBarDanger.visible = breath <= breathDangerThreshold;
}
// --- Helper: Animate Tap Button Glow ---
function animateTapButtonGlow() {
	tapButtonGlow.alpha = 0.5;
	tween(tapButtonGlow, {
		alpha: 0.2
	}, {
		duration: 300,
		easing: tween.cubicOut
	});
	tween(tapButton, {
		scaleX: 1.12,
		scaleY: 1.12
	}, {
		duration: 80,
		easing: tween.cubicOut,
		onFinish: function onFinish() {
			tween(tapButton, {
				scaleX: 1,
				scaleY: 1
			}, {
				duration: 120,
				easing: tween.cubicIn
			});
		}
	});
}
// --- Helper: Add Music Note Particle ---
function spawnMusicNote() {
	var note = new MusicNote();
	note.x = 2048 / 2 + (Math.random() - 0.5) * 400;
	note.y = 1200 - 220 + (Math.random() - 0.5) * 80;
	note.vx = (Math.random() - 0.5) * 2.5;
	note.vy = -2.5 - Math.random() * 2.5;
	note.alpha = 0.9 + Math.random() * 0.1;
	musicNotes.push(note);
	game.addChild(note);
}
// --- Helper: Add Beat Particle ---
function spawnBeatParticle() {
	var p = new BeatParticle();
	p.x = 2048 / 2;
	p.y = 1200 - 220;
	p.vx = (Math.random() - 0.5) * 1.5;
	p.vy = -1.5 - Math.random() * 1.5;
	p.alpha = 0.8 + Math.random() * 0.2;
	beatParticles.push(p);
	game.addChild(p);
}
// --- Helper: Add Soundwave ---
function spawnSoundwave() {
	var sw = new Soundwave();
	sw.x = 2048 / 2;
	sw.y = 1200 - 220;
	sw.alpha = 0.5;
	soundwaves.push(sw);
	game.addChild(sw);
}
// --- Tap Button Handler ---
function handleTap(x, y, obj) {
	if (isGameOver || !canTap) return;
	// Only register tap if inside button
	var dx = x - tapButton.x;
	var dy = y - tapButton.y;
	var r = tapButton.width / 2;
	if (dx * dx + dy * dy > r * r) return;
	// Tap registered!
	canTap = false;
	lastTapTick = LK.ticks;
	// Animate
	animateTapButtonGlow();
	spawnMusicNote();
	spawnBeatParticle();
	spawnSoundwave();
	LK.getSound('beatbox').play();
	// Switch character: loop through 3 styles
	// Hide all, show next
	characterList[characterStyle].visible = false;
	characterStyle = (characterStyle + 1) % characterList.length;
	characterList[characterStyle].visible = true;
	// Animate if Beatboxer
	if (characterList[characterStyle] === beatboxer && typeof beatboxer.beat === "function") {
		beatboxer.beat();
	}
	// Score
	score += 1;
	scoreText.setText('Score: ' + score);
	// Breath
	breath = Math.min(1, breath + breathGainPerTap);
	updateBreathBar();
	// Win condition
	if (score >= 50) {
		isGameOver = true;
		LK.showYouWin();
	}
}
// --- Tap Button Down/Up/Move ---
game.down = function (x, y, obj) {
	handleTap(x, y, obj);
};
game.move = function (x, y, obj) {
	// No drag needed, but allow repeated tap
	if (!canTap && LK.ticks - lastTapTick > 7) {
		canTap = true;
	}
};
game.up = function (x, y, obj) {
	// Allow next tap
	canTap = true;
};
// --- Main Game Update ---
game.update = function () {
	if (isGameOver) return;
	// Drain breath
	breath -= breathDrainPerTick;
	if (breath < 0) breath = 0;
	updateBreathBar();
	// Lose if breath runs out
	if (breath <= 0 && !isGameOver) {
		isGameOver = true;
		LK.effects.flashScreen(0xff0000, 900);
		LK.showGameOver();
		return;
	}
	// Animate background: spawn music notes
	if (LK.ticks % 18 === 0) {
		spawnMusicNote();
	}
	// Animate background: spawn beat particles
	if (LK.ticks % 30 === 0) {
		spawnBeatParticle();
	}
	// Animate background: spawn soundwave
	if (LK.ticks % 60 === 0) {
		spawnSoundwave();
	}
	// Update and cleanup music notes
	for (var i = musicNotes.length - 1; i >= 0; i--) {
		var n = musicNotes[i];
		n.update();
		if (n.destroyed) {
			n.destroy();
			musicNotes.splice(i, 1);
		}
	}
	// Update and cleanup beat particles
	for (var i = beatParticles.length - 1; i >= 0; i--) {
		var p = beatParticles[i];
		p.update();
		if (p.destroyed) {
			p.destroy();
			beatParticles.splice(i, 1);
		}
	}
	// Update and cleanup soundwaves
	for (var i = soundwaves.length - 1; i >= 0; i--) {
		var sw = soundwaves[i];
		sw.update();
		if (sw.destroyed) {
			sw.destroy();
			soundwaves.splice(i, 1);
		}
	}
};
// --- Play Music ---
LK.playMusic('neonbeat', {
	fade: {
		start: 0,
		end: 1,
		duration: 1200
	}
});

===================================================================
--- original.js
+++ change.js
@@ -296,8 +296,15 @@
 game.addChild(characterPlaceholder2);
 // Track which character is currently shown (0, 1, 2)
 var characterStyle = 0;
 var characterList = [characterPlaceholder0, characterPlaceholder1, characterPlaceholder2];
+// --- Beatboxer character instance (hidden by default, added to game and characterList) ---
+var beatboxer = new Beatboxer();
+beatboxer.x = 2048 / 2;
+beatboxer.y = 2350;
+beatboxer.visible = false;
+game.addChild(beatboxer);
+characterList.push(beatboxer);
 // --- Tap Button (bottom center) ---
 var tapButtonGlow = LK.getAsset('tapButtonGlow', {
 	anchorX: 0.5,
 	anchorY: 0.5,