Upit | Learn about creating the game Music Drop Collector with gen AI
Play
game-community-background
game-pic

42

1

6mo

Playit
Collect the notes with the microphone,and don't forget the Bombs and the Energy!!!!!!
#rhythm
#music
#arcade
#collector
#survival
##UpitMusicContest
/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");
var facekit = LK.import("@upit/facekit.v1");

/**** 
* Classes
****/ 
var Bomb = Container.expand(function () {
	var self = Container.call(this);
	var bombGraphics = self.attachAsset('bomb', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.speed = 8;
	self.lane = 0;
	self.update = function () {
		self.y += self.speed;
	};
	return self;
});
var Microphone = Container.expand(function () {
	var self = Container.call(this);
	var micGraphics = self.attachAsset('microphone', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.collectRadius = 80;
	self.power = 1;
	return self;
});
var Note = Container.expand(function (assetId) {
	var self = Container.call(this);
	var selectedAsset = assetId || 'note';
	var noteGraphics = self.attachAsset(selectedAsset, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.speed = 8;
	self.lane = 0;
	self.update = function () {
		self.y += self.speed;
	};
	return self;
});

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

/**** 
* Game Code
****/ 
// Game dimensions and lane setup
var LANE_COUNT = 7;
var LANE_WIDTH = 2048 / LANE_COUNT;
var lanes = [];
var lanePositions = [];
// Initialize lane positions
for (var i = 0; i < LANE_COUNT; i++) {
	lanePositions.push((i + 0.5) * LANE_WIDTH);
}
// Draw lane dividers
for (var i = 1; i < LANE_COUNT; i++) {
	var laneDiv = game.addChild(LK.getAsset('lane', {
		anchorX: 0.5,
		anchorY: 0
	}));
	laneDiv.x = i * LANE_WIDTH;
	laneDiv.y = 0;
}
// Create speaker at top left corner
var speaker = game.addChild(LK.getAsset('speaker', {
	anchorX: 0,
	anchorY: 0,
	width: 300,
	height: 400
}));
speaker.x = 50;
speaker.y = 20;
// Create microphone
var microphone = game.addChild(new Microphone());
microphone.x = 2048 / 2;
microphone.y = 2600;
// Game state variables
var notes = [];
var bombs = [];
var energy = 100;
var maxEnergy = 100;
var energyDecayRate = 0.15;
var noteSpawnRate = 20;
var bombSpawnRate = 180;
var lastPowerUp = 0;
// Score display
var scoreTxt = new Text2('0', {
	size: 80,
	fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
scoreTxt.y = 50;
// Energy display
var energyTxt = new Text2('Energy: 100%', {
	size: 60,
	fill: 0x2ECC71
});
energyTxt.anchor.set(0, 0);
LK.gui.top.addChild(energyTxt);
energyTxt.x = scoreTxt.x + 200;
energyTxt.y = 50;
// Energy bar fill
var energyBarFill = LK.gui.top.addChild(LK.getAsset('energyBarFill', {
	anchorX: 0,
	anchorY: 0.5
}));
energyBarFill.x = energyTxt.x;
energyBarFill.y = energyTxt.y + 80;
// Power level display
var powerTxt = new Text2('Microphone Power Level: 1', {
	size: 50,
	fill: 0xF39C12
});
powerTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(powerTxt);
powerTxt.y = 230;
// Touch controls
var dragNode = null;
game.down = function (x, y, obj) {
	dragNode = microphone;
	microphone.x = Math.max(75, Math.min(2048 - 75, x));
};
game.move = function (x, y, obj) {
	if (dragNode) {
		microphone.x = Math.max(75, Math.min(2048 - 75, x));
	}
};
game.up = function (x, y, obj) {
	dragNode = null;
};
// Helper functions
function spawnNote() {
	var noteAssets = ['note', 'note_red', 'note_green', 'note_yellow', 'note_purple', 'note_orange', 'note_pink'];
	var randomAsset = noteAssets[Math.floor(Math.random() * noteAssets.length)];
	var note = new Note(randomAsset);
	var laneIndex = Math.floor(Math.random() * LANE_COUNT);
	note.lane = laneIndex;
	note.x = lanePositions[laneIndex];
	note.y = -30;
	notes.push(note);
	game.addChild(note);
}
function spawnBomb() {
	var bomb = new Bomb();
	var laneIndex = Math.floor(Math.random() * LANE_COUNT);
	bomb.lane = laneIndex;
	bomb.x = lanePositions[laneIndex];
	bomb.y = -30;
	bombs.push(bomb);
	game.addChild(bomb);
}
function collectNote(note) {
	// Calculate energy gain based on microphone volume level
	var micLevel = 1; // Default level
	if (facekit.volume > 0) {
		if (facekit.volume <= 0.16) micLevel = 1; // 10% energy
		else if (facekit.volume <= 0.33) micLevel = 2; // 20% energy  
		else if (facekit.volume <= 0.5) micLevel = 3; // 30% energy
		else if (facekit.volume <= 0.67) micLevel = 4; // 40% energy
		else if (facekit.volume <= 0.83) micLevel = 5; // 40% energy
		else micLevel = 6; // 50% energy
	}
	var energyGain = micLevel * 10; // 10%, 20%, 30%, 40%, 40%, 50%
	energy = Math.min(maxEnergy, energy + energyGain);
	// Calculate score based on microphone power level
	var scoreToAdd = microphone.power * 100;
	// Increase score
	LK.setScore(LK.getScore() + scoreToAdd);
	// Play sound
	LK.getSound('collectNote').play();
	// Visual effect
	LK.effects.flashObject(speaker, 0x2ecc71, 200);
	// Remove note
	note.destroy();
	var noteIndex = notes.indexOf(note);
	if (noteIndex > -1) {
		notes.splice(noteIndex, 1);
	}
}
function hitBomb() {
	// Play sound
	LK.getSound('bombHit').play();
	// Flash screen red
	LK.effects.flashScreen(0xe74c3c, 1000);
	// Game over
	LK.showGameOver();
}
function updateEnergyBar() {
	var energyPercent = energy / maxEnergy;
	// Update energy text
	energyTxt.setText('Energy: ' + Math.floor(energyPercent * 100) + '%');
	// Update energy bar fill scale
	energyBarFill.scaleX = energyPercent;
	// Change color based on energy level
	if (energyPercent > 0.6) {
		energyTxt.fill = "#2ecc71";
		energyBarFill.tint = 0x2ECC71;
	} else if (energyPercent > 0.3) {
		energyTxt.fill = "#f39c12";
		energyBarFill.tint = 0xF39C12;
	} else {
		energyTxt.fill = "#e74c3c";
		energyBarFill.tint = 0xE74C3C;
	}
}
function checkPowerUp() {
	var currentScore = LK.getScore();
	var powerLevel = Math.floor(currentScore / 10000) + 1;
	if (powerLevel > microphone.power) {
		microphone.power = powerLevel;
		powerTxt.setText('Microphone Power Level: ' + microphone.power);
		// Visual effect for power up
		LK.effects.flashObject(microphone, 0xf39c12, 1000);
		// Increase microphone size slightly
		tween(microphone, {
			scaleX: 1.2,
			scaleY: 1.2
		}, {
			duration: 300
		});
		tween(microphone, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 300
		});
	}
}
function updateDifficulty() {
	var currentScore = LK.getScore();
	// Increase bomb spawn rate with score
	var difficultyMultiplier = 1 + currentScore / 50000;
	var adjustedBombSpawnRate = Math.max(60, bombSpawnRate / difficultyMultiplier);
	return adjustedBombSpawnRate;
}
// Start background music
LK.playMusic('bgMusic');
// Main game loop
game.update = function () {
	// Decay energy over time
	energy = Math.max(0, energy - energyDecayRate);
	// Check for game over condition
	if (energy <= 0) {
		LK.showGameOver();
		return;
	}
	// Update energy bar
	updateEnergyBar();
	// Update score display
	scoreTxt.setText(LK.getScore().toString());
	// Check for power ups
	checkPowerUp();
	// Spawn notes
	if (LK.ticks % noteSpawnRate === 0) {
		spawnNote();
	}
	// Spawn bombs with increasing difficulty
	var currentBombSpawnRate = updateDifficulty();
	if (LK.ticks % Math.floor(currentBombSpawnRate) === 0) {
		spawnBomb();
	}
	// Update and check notes
	for (var i = notes.length - 1; i >= 0; i--) {
		var note = notes[i];
		// Initialize tracking variables
		if (note.lastY === undefined) note.lastY = note.y;
		if (note.lastCollected === undefined) note.lastCollected = false;
		// Check if note went off screen
		if (note.lastY <= 2732 && note.y > 2732) {
			note.destroy();
			notes.splice(i, 1);
			continue;
		}
		// Check collision with microphone
		var distance = Math.sqrt(Math.pow(note.x - microphone.x, 2) + Math.pow(note.y - microphone.y, 2));
		var currentCollected = distance < microphone.collectRadius;
		if (!note.lastCollected && currentCollected) {
			collectNote(note);
			continue;
		}
		// Update tracking variables
		note.lastY = note.y;
		note.lastCollected = currentCollected;
	}
	// Update and check bombs
	for (var j = bombs.length - 1; j >= 0; j--) {
		var bomb = bombs[j];
		// Initialize tracking variables
		if (bomb.lastY === undefined) bomb.lastY = bomb.y;
		if (bomb.lastHit === undefined) bomb.lastHit = false;
		// Check if bomb went off screen
		if (bomb.lastY <= 2732 && bomb.y > 2732) {
			bomb.destroy();
			bombs.splice(j, 1);
			continue;
		}
		// Check collision with microphone
		var bombDistance = Math.sqrt(Math.pow(bomb.x - microphone.x, 2) + Math.pow(bomb.y - microphone.y, 2));
		var currentHit = bombDistance < microphone.collectRadius;
		if (!bomb.lastHit && currentHit) {
			hitBomb();
			return;
		}
		// Update tracking variables
		bomb.lastY = bomb.y;
		bomb.lastHit = currentHit;
	}
};
Showing 51 to 29 of 29
12

Images

2D golgesiz bir bomba. In-Game asset. 2d. High contrast. No shadows 2D do notasini mavi renkte golgesiz hazirla. In-Game asset. 2d. High contrast. No shadows 2D yesil renkte golgesiz re notasini yap. In-Game asset. 2d. High contrast. No shadows turuncu renkte 2d mi notasini yarat. In-Game asset. 2d. High contrast. no shadows 2d golgesiz pembe bir do notasi olustur/. In-Game asset. 2d. High contrast. No shadows 2d purple golgesiz bir nota olustur. In-Game asset. 2d. High contrast. No shadows 2d kirmiz renkte golgesiz bir nota olustur. In-Game asset. 2d. High contrast. No shadows 2d yellow renkte golgesiz bir nota olustur. In-Game asset. 2d. High contrast. No shadows kenarlara sahip parlak kirmizi renke sahip yatay bir bar olustur. In-Game asset. 2d. High contrast. No shadows 2d one bakan duz aciya sahip golgesiz bir speaker yap. In-Game asset. 2d. High contrast. No shadows

Sounds & Music

🎵

collectNote

Sound effect

🎵

bombHit

Sound effect

🎶

bgMusic

Music

Used plugins

@upit/tween@upit/facekit
Home
Discover
Play
Profile