/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); /**** * Classes ****/ var Character = Container.expand(function (characterType) { var self = Container.call(this); self.characterType = characterType; self.soundId = ''; self.isOnStage = false; self.originalX = 0; self.originalY = 0; self.beatTimer = 0; self.isBeating = false; // Set character properties based on type switch (characterType) { case 'kirby': self.soundId = 'bass1'; self.graphics = self.attachAsset('kirby', { anchorX: 0.5, anchorY: 0.5 }); break; case 'dedede': self.soundId = 'percussion1'; self.graphics = self.attachAsset('dedede', { anchorX: 0.5, anchorY: 0.5 }); break; case 'metaknight': self.soundId = 'melody1'; self.graphics = self.attachAsset('metaknight', { anchorX: 0.5, anchorY: 0.5 }); break; case 'waddledee': self.soundId = 'vocal1'; self.graphics = self.attachAsset('waddledee', { anchorX: 0.5, anchorY: 0.5 }); break; case 'cookkirby': self.soundId = 'bass2'; self.graphics = self.attachAsset('cookkirby', { anchorX: 0.5, anchorY: 0.5 }); break; case 'icekirby': self.soundId = 'percussion2'; self.graphics = self.attachAsset('icekirby', { anchorX: 0.5, anchorY: 0.5 }); break; case 'firekirby': self.soundId = 'melody2'; self.graphics = self.attachAsset('firekirby', { anchorX: 0.5, anchorY: 0.5 }); break; case 'sparkkirby': self.soundId = 'vocal2'; self.graphics = self.attachAsset('sparkkirby', { anchorX: 0.5, anchorY: 0.5 }); break; case 'bandanawaddledee': self.soundId = 'harmony1'; self.graphics = self.attachAsset('bandanawaddledee', { anchorX: 0.5, anchorY: 0.5 }); break; case 'forgodedede': self.soundId = 'deep_bass'; self.graphics = self.attachAsset('forgodedede', { anchorX: 0.5, anchorY: 0.5 }); break; case 'galactaknight': self.soundId = 'harmony2'; self.graphics = self.attachAsset('galactaknight', { anchorX: 0.5, anchorY: 0.5 }); break; case 'sky': self.soundId = 'jingle1'; self.graphics = self.attachAsset('sky', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Raddy': self.soundId = 'jingle2'; self.graphics = self.attachAsset('Raddy', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Oren': self.soundId = 'Saw1'; self.graphics = self.attachAsset('Oren', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Eviloren': self.soundId = 'Saw2'; self.graphics = self.attachAsset('Eviloren', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Sudz': self.soundId = 'Soap'; self.graphics = self.attachAsset('Sudz', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Black': self.soundId = 'Black'; self.graphics = self.attachAsset('Black', { anchorX: 0.5, anchorY: 0.5 }); break; case 'EvilBlack': self.soundId = 'EvilBlack'; self.graphics = self.attachAsset('EvilBlack', { anchorX: 0.5, anchorY: 0.5 }); break; case 'brud': self.soundId = 'Brud'; self.graphics = self.attachAsset('brud', { anchorX: 0.5, anchorY: 0.5 }); break; case 'Vineria': self.soundId = 'Vineria'; self.graphics = self.attachAsset('Vineria', { anchorX: 0.5, anchorY: 0.5 }); break; case 'White': self.soundId = 'White'; self.graphics = self.attachAsset('White', { anchorX: 0.5, anchorY: 0.5 }); break; case 'wenda': self.soundId = 'Wrnda'; self.graphics = self.attachAsset('wenda', { anchorX: 0.5, anchorY: 0.5 }); break; } self.startBeat = function () { if (!self.isOnStage) return; self.isBeating = true; self.beatTimer = 0; tween(self.graphics, { scaleX: 1.2, scaleY: 1.2 }, { duration: 200, easing: tween.easeOut, onFinish: function onFinish() { tween(self.graphics, { scaleX: 1.0, scaleY: 1.0 }, { duration: 200, easing: tween.easeIn }); } }); }; self.update = function () { if (self.isOnStage) { self.beatTimer++; if (self.beatTimer >= 120) { // Beat every 2 seconds at 60fps self.startBeat(); LK.getSound(self.soundId).play(); self.beatTimer = 0; } } }; return self; }); var StageSlot = Container.expand(function (slotIndex) { var self = Container.call(this); self.slotIndex = slotIndex; self.occupiedCharacter = null; self.graphics = self.attachAsset('stageSlot', { anchorX: 0.5, anchorY: 0.5 }); self.isOccupied = function () { return self.occupiedCharacter !== null; }; self.addCharacter = function (character) { if (self.occupiedCharacter) { self.removeCharacter(); } self.occupiedCharacter = character; character.isOnStage = true; character.x = self.x; character.y = self.y; }; self.removeCharacter = function () { if (self.occupiedCharacter) { self.occupiedCharacter.isOnStage = false; self.occupiedCharacter.x = self.occupiedCharacter.originalX; self.occupiedCharacter.y = self.occupiedCharacter.originalY; self.occupiedCharacter = null; } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x1a1a2e }); /**** * Game Code ****/ // Game variables // Sound assets for musical elements - protected initialization var stageSlots = []; var draggedCharacter = null; var characterPanel; // Create character panel background characterPanel = game.addChild(LK.getAsset('characterPanel', { anchorX: 0.5, anchorY: 1.0, x: 1024, y: 2732 })); // Create stage slots in two rows var slotPositions = [{ x: 412, y: 800 }, { x: 724, y: 800 }, { x: 1036, y: 800 }, { x: 1348, y: 800 }, { x: 412, y: 1100 }, { x: 724, y: 1100 }, { x: 1036, y: 1100 }, { x: 1348, y: 1100 }]; for (var i = 0; i < 8; i++) { var slot = new StageSlot(i); slot.x = slotPositions[i].x; slot.y = slotPositions[i].y; stageSlots.push(slot); game.addChild(slot); } // Character categories var characterCategories = { kirby: ['kirby', 'cookkirby', 'icekirby', 'firekirby', 'sparkkirby', 'dedede', 'metaknight', 'waddledee', 'bandanawaddledee', 'forgodedede', 'galactaknight'], sprunki: ['sky', 'Raddy', 'Oren', 'Eviloren', 'Sudz', 'Black', 'EvilBlack', 'brud', 'Vineria', 'White', 'wenda'], mix: ['kirby', 'cookkirby', 'icekirby', 'firekirby', 'sparkkirby', 'dedede', 'metaknight', 'waddledee', 'bandanawaddledee', 'forgodedede', 'galactaknight', 'sky', 'Raddy', 'Oren', 'Eviloren', 'Sudz', 'Black', 'EvilBlack', 'brud', 'Vineria', 'White', 'wenda'] }; // Current category and displayed characters var currentCategory = 'kirby'; var displayedCharacters = []; var scrollOffset = 0; var maxScrollOffset = 0; var isScrolling = false; var lastScrollX = 0; // Create dropdown button var dropdownButton = game.addChild(LK.getAsset('characterPanel', { anchorX: 0.5, anchorY: 0.5, x: 1024, y: 2400, scaleX: 0.3, scaleY: 0.3 })); var dropdownText = new Text2(currentCategory.toUpperCase(), { size: 80, fill: 0xFFFFFF }); dropdownText.anchor.set(0.5, 0.5); dropdownText.x = 1024; dropdownText.y = 2400; game.addChild(dropdownText); // Function to update title and instruction text based on category function updateTitleText() { if (currentCategory === 'sprunki') { titleText.setText('Sprunki Beat Box'); instructionText.setText('Drag Sprunki characters to stage positions to create music!'); } else if (currentCategory === 'mix') { titleText.setText('Mixed Beat Box'); instructionText.setText('Drag characters to stage positions to create music!'); } else { titleText.setText('Kirby Beat Box'); instructionText.setText('Drag Kirby characters to stage positions to create music!'); } } // Function to update displayed characters function updateDisplayedCharacters() { // Remove existing displayed characters for (var i = 0; i < displayedCharacters.length; i++) { displayedCharacters[i].destroy(); } displayedCharacters = []; // Reset scroll scrollOffset = 0; // Get characters for current category var categoryCharacters = characterCategories[currentCategory]; // Calculate max scroll offset for mix category if (currentCategory === 'mix') { var totalWidth = categoryCharacters.length * 158; var panelWidth = 2048; maxScrollOffset = Math.max(0, totalWidth - panelWidth + 156); } else { maxScrollOffset = 0; } // Create new characters for display for (var i = 0; i < categoryCharacters.length; i++) { var character = new Character(categoryCharacters[i]); var startX = 156 + i * 158 - scrollOffset; var startY = 2582; character.x = startX; character.y = startY; character.originalX = startX; character.originalY = startY; displayedCharacters.push(character); game.addChild(character); } } // Function to update character positions based on scroll function updateCharacterPositions() { for (var i = 0; i < displayedCharacters.length; i++) { var character = displayedCharacters[i]; var newX = 156 + i * 158 - scrollOffset; // Only update position if character is not on stage if (!character.isOnStage) { character.x = newX; } character.originalX = newX; } } // Initialize with Kirby characters updateDisplayedCharacters(); // Add title text var titleText = new Text2('Kirby Beat Box', { size: 120, fill: 0xFFFFFF }); titleText.anchor.set(0.5, 0.5); titleText.x = 1024; titleText.y = 400; game.addChild(titleText); // Add instruction text var instructionText = new Text2('Drag Kirby characters to stage positions to create music!', { size: 60, fill: 0xCCCCCC }); instructionText.anchor.set(0.5, 0.5); instructionText.x = 1024; instructionText.y = 500; game.addChild(instructionText); // Function to find closest stage slot function findClosestStageSlot(x, y) { var closestSlot = null; var closestDistance = Infinity; for (var i = 0; i < stageSlots.length; i++) { var slot = stageSlots[i]; var distance = Math.sqrt(Math.pow(slot.x - x, 2) + Math.pow(slot.y - y, 2)); if (distance < 150 && distance < closestDistance) { closestDistance = distance; closestSlot = slot; } } return closestSlot; } // Function to find character at position function findCharacterAtPosition(x, y) { for (var i = 0; i < displayedCharacters.length; i++) { var character = displayedCharacters[i]; var distance = Math.sqrt(Math.pow(character.x - x, 2) + Math.pow(character.y - y, 2)); if (distance < 75) { return character; } } return null; } // Event handlers game.down = function (x, y, obj) { // Check if dropdown button was clicked var dropdownDistance = Math.sqrt(Math.pow(dropdownButton.x - x, 2) + Math.pow(dropdownButton.y - y, 2)); if (dropdownDistance < 150) { // Switch category if (currentCategory === 'kirby') { currentCategory = 'sprunki'; } else if (currentCategory === 'sprunki') { currentCategory = 'mix'; } else { currentCategory = 'kirby'; } dropdownText.setText(currentCategory.toUpperCase()); updateTitleText(); updateDisplayedCharacters(); return; } // First check if touching a character (prioritize character dragging) var character = findCharacterAtPosition(x, y); if (character) { draggedCharacter = character; // Remove from stage slot if currently on stage for (var i = 0; i < stageSlots.length; i++) { if (stageSlots[i].occupiedCharacter === character) { stageSlots[i].removeCharacter(); break; } } return; } // If no character touched, check if touch is in character panel area for scrolling if (y > 2400 && currentCategory === 'mix' && maxScrollOffset > 0) { isScrolling = true; lastScrollX = x; } }; game.move = function (x, y, obj) { if (draggedCharacter) { draggedCharacter.x = x; draggedCharacter.y = y; } else if (isScrolling && currentCategory === 'mix' && maxScrollOffset > 0) { var deltaX = lastScrollX - x; scrollOffset += deltaX; scrollOffset = Math.max(0, Math.min(scrollOffset, maxScrollOffset)); updateCharacterPositions(); lastScrollX = x; } }; game.up = function (x, y, obj) { if (isScrolling) { isScrolling = false; return; } if (draggedCharacter) { var closestSlot = findClosestStageSlot(x, y); if (closestSlot) { // Place character on stage closestSlot.addCharacter(draggedCharacter); } else { // Return to original position draggedCharacter.isOnStage = false; tween(draggedCharacter, { x: draggedCharacter.originalX, y: draggedCharacter.originalY }, { duration: 300, easing: tween.easeOut }); } draggedCharacter = null; } }; game.update = function () { // Characters update themselves through their own update methods };