User prompt
Not working the heart scaling ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Sincronize the heart sticker scaling up and down to the slider moving
User prompt
Fix it
User prompt
Please fix the bug: 'Uncaught TypeError: Cannot set properties of undefined (setting 'tint')' in or related to this line: 'sizeSlider.track.tint = 0xFF0000;' Line Number: 666
User prompt
add slider if the heart button selected but color it red
User prompt
Color heart slider to red
User prompt
Now add similar slider if the heart button selected
User prompt
Swap the left sided green color and white color place
User prompt
Recolor the sticker size text to black
User prompt
Scale up the 'sticker size' text to 5x
User prompt
Scale up sticker size text to 5x
User prompt
Scale up the sticker size to 5x ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Decrease the size slider length by 15 units
User prompt
Decrease the size slider length by 20 units
User prompt
Decrease the size slider length by 25 units
User prompt
Decrease the slider lenght by 20 units
User prompt
Move the slider left by 200 units
User prompt
Make the slider as long as the colopanel windt
User prompt
Move the center of the slider left by 500 units
User prompt
Move the center of the slider left by 200 units
User prompt
Move the center of the slider to the center of the map
User prompt
Make the slider 5x longer ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Move the 256 palette and his background down by 50 units
User prompt
Move the slider down by 300 units
User prompt
Mive the slider down by 500 units
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); var storage = LK.import("@upit/storage.v1", { savedEggs: [] }); /**** * Classes ****/ var BrushStroke = Container.expand(function (color, size) { var self = Container.call(this); var stroke = self.attachAsset('brushStroke', { anchorX: 0.5, anchorY: 0.5, scaleX: size / 30, scaleY: size / 30 }); stroke.tint = color; return self; }); var Button = Container.expand(function (label, color) { var self = Container.call(this); var background = self.attachAsset('buttonBg', { anchorX: 0.5, anchorY: 0.5 }); var text = new Text2(label, { size: 30, fill: 0xFFFFFF }); text.anchor.set(0.5, 0.5); self.addChild(text); if (color !== undefined) { background.tint = color; } self.down = function () { tween(background, { scaleX: 0.9, scaleY: 0.9 }, { duration: 100 }); }; self.up = function () { tween(background, { scaleX: 1, scaleY: 1 }, { duration: 100 }); }; return self; }); var ColorButton = Container.expand(function (color) { var self = Container.call(this); var button = self.attachAsset('colorButton', { anchorX: 0.5, anchorY: 0.5 }); button.tint = color; self.color = color; self.down = function () { tween(button, { scaleX: 0.9, scaleY: 0.9 }, { duration: 100 }); }; self.up = function () { tween(button, { scaleX: 1, scaleY: 1 }, { duration: 100 }); }; return self; }); var ColorPalette = Container.expand(function () { var self = Container.call(this); var background = LK.getAsset('colorPanel', { anchorX: 0.5, anchorY: 0.5, scaleX: 1881 / 1880, // Set to exact size 1881 scaleY: 1899 / 277 // Set to exact size 1899 }); self.addChild(background); var colorButtons = []; // Generate 256 color gradient palette var paletteColors = []; var buttonSize = 90; // Increased from 30 to 90 (3x larger) var spacing = 12; // Increased from 4 to 12 (3x larger) var columns = 16; var rows = 16; // Generate rainbow gradient colors for the full 256 color palette for (var i = 0; i < 256; i++) { var hue = i / 256; var r, g, b; // Convert HSV to RGB (simplified rainbow gradient) if (hue < 1 / 6) { r = 1; g = hue * 6; b = 0; } else if (hue < 2 / 6) { r = (2 / 6 - hue) * 6; g = 1; b = 0; } else if (hue < 3 / 6) { r = 0; g = 1; b = (hue - 2 / 6) * 6; } else if (hue < 4 / 6) { r = 0; g = (4 / 6 - hue) * 6; b = 1; } else if (hue < 5 / 6) { r = (hue - 4 / 6) * 6; b = 1; g = 0; } else { r = 1; g = 0; b = (1 - hue) * 6; } // Convert to 0-255 range var red = Math.floor(r * 255); var green = Math.floor(g * 255); var blue = Math.floor(b * 255); var color = red << 16 | green << 8 | blue; paletteColors.push(color); } for (var i = 0; i < paletteColors.length; i++) { var row = Math.floor(i / columns); var col = i % columns; var colorBtn = new ColorButton(paletteColors[i]); colorBtn.x = col * (buttonSize + spacing) - (columns - 1) * (buttonSize + spacing) / 2; colorBtn.y = row * (buttonSize + spacing) - (rows - 1) * (buttonSize + spacing) / 2; colorBtn.scaleX = 4.5; // Increased from 1.5 to 4.5 (3x larger) colorBtn.scaleY = 4.5; // Increased from 1.5 to 4.5 (3x larger) self.addChild(colorBtn); // Create a closure to capture the current color (function (color, btn) { btn.down = function () { currentColor = color; self.visible = false; // Notify the game that a color was selected if (self.onColorSelected) { self.onColorSelected(color); } }; })(paletteColors[i], colorBtn); colorButtons.push(colorBtn); } // Add selector ring var selector = LK.getAsset('brushStroke', { anchorX: 0.5, anchorY: 0.5, scaleX: 7.5, // Increased from 2.5 to 7.5 (3x larger) scaleY: 7.5 // Increased from 2.5 to 7.5 (3x larger) }); selector.tint = 0xFFFFFF; selector.alpha = 0.7; self.addChild(selector); // Set selector initial position selector.x = colorButtons[0].x; selector.y = colorButtons[0].y; // Hide palette initially self.visible = false; // Method to update selector position self.updateSelector = function (color) { for (var i = 0; i < paletteColors.length; i++) { if (paletteColors[i] === color) { selector.x = colorButtons[i].x; selector.y = colorButtons[i].y; break; } } }; return self; }); var CompletedEgg = Container.expand(function (baseColor) { var self = Container.call(this); var eggGraphic = self.attachAsset('completedEgg', { anchorX: 0.5, anchorY: 0.5 }); eggGraphic.tint = baseColor || 0xFFFFFF; // Add some random decoration to make each egg look unique for (var i = 0; i < 5; i++) { var glitter = self.attachAsset('glitter', { anchorX: 0.5, anchorY: 0.5, x: (Math.random() - 0.5) * 80, y: (Math.random() - 0.5) * 120 }); glitter.tint = 0xFFD700 + Math.floor(Math.random() * 0x555555); } return self; }); var EasterEgg = Container.expand(function () { var self = Container.call(this); var eggBase = self.attachAsset('eggBase', { anchorX: 0.5, anchorY: 0.5 }); var designContainer = new Container(); self.designContainer = designContainer; // Make accessible outside self.addChild(designContainer); self.addDesign = function (x, y, designElement) { var localPosition = designContainer.toLocal({ x: x, y: y }, game); // Check if the point is within the bounds of the eggBase // Convert to egg's local coordinates for hit testing var eggLocalPosition = self.toLocal({ x: x, y: y }, game); // Calculate distance from center of egg var dx = eggLocalPosition.x; var dy = eggLocalPosition.y; var distance = Math.sqrt(dx * dx + dy * dy); // Check if point is inside the egg (ellipse) // Using the egg's dimensions to determine the ellipse bounds var eggWidth = eggBase.width / 2; var eggHeight = eggBase.height / 2; // Formula for point in ellipse: (x/a)² + (y/b)² <= 1 // where a is half-width and b is half-height var isInEgg = dx * dx / (eggWidth * eggWidth) + dy * dy / (eggHeight * eggHeight) <= 1; // Only add design if point is inside the egg if (isInEgg) { designElement.x = localPosition.x; designElement.y = localPosition.y; designContainer.addChild(designElement); } }; self.clearDesigns = function () { while (designContainer.children.length > 0) { designContainer.removeChild(designContainer.children[0]); } }; self.rotate = function (angle) { eggBase.rotation += angle; designContainer.rotation += angle; }; self.captureDesign = function () { // In a real implementation, this would create a snapshot of the egg // For this simplified version, we just create a new completed egg with the same tint var completedEgg = new CompletedEgg(eggBase.tint); return completedEgg; }; return self; }); var Slider = Container.expand(function (minVal, maxVal, defaultVal, width, color) { var self = Container.call(this); // Track properties self.minValue = minVal || 0; self.maxValue = maxVal || 100; self.value = defaultVal || 50; self.trackWidth = width || 300; self.trackColor = color || 0xCCCCCC; // Method definitions - MOVED TO TOP // Convert value to x position self.getXForValue = function (val) { return (val - self.minValue) / (self.maxValue - self.minValue) * self.trackWidth; }; // Convert x position to value self.getValueForX = function (x) { return self.minValue + x / self.trackWidth * (self.maxValue - self.minValue); }; // Update handle position self.updateHandlePosition = function () { handle.x = self.getXForValue(self.value); valueLabel.x = handle.x; valueLabel.setText(Math.round(self.value).toString()); }; // Set value self.setValue = function (val) { self.value = Math.max(self.minValue, Math.min(self.maxValue, val)); self.updateHandlePosition(); if (self.onValueChanged) { self.onValueChanged(self.value); } }; // Handle drag self.down = function (x, y) { self.isDragging = true; self.setValue(self.getValueForX(x)); }; self.move = function (x, y) { if (self.isDragging) { self.setValue(self.getValueForX(Math.max(0, Math.min(self.trackWidth, x)))); } }; self.up = function () { self.isDragging = false; }; // Create track var track = LK.getAsset('buttonBg', { anchorX: 0, anchorY: 0.5, scaleX: self.trackWidth / 120, scaleY: 0.3 }); track.tint = self.trackColor; self.addChild(track); // Create handle var handle = LK.getAsset('colorButton', { anchorX: 0.5, anchorY: 0.5, scaleX: 1.5, scaleY: 1.5 }); handle.tint = 0xFFFFFF; handle.x = self.getXForValue(self.value); self.addChild(handle); self.handle = handle; // Create value label var valueLabel = new Text2(Math.round(self.value).toString(), { size: 30, fill: 0xFFFFFF }); valueLabel.anchor.set(0.5, 0.5); valueLabel.y = -40; valueLabel.x = handle.x; self.addChild(valueLabel); self.valueLabel = valueLabel; return self; }); var Sticker = Container.expand(function (type, scale) { var self = Container.call(this); var stickerAsset; if (type === 'star') { stickerAsset = self.attachAsset('stickerStar', { anchorX: 0.5, anchorY: 0.5, scaleX: scale, scaleY: scale }); } else if (type === 'heart') { stickerAsset = self.attachAsset('stickerHeart', { anchorX: 0.5, anchorY: 0.5, scaleX: scale, scaleY: scale }); } self.down = function () { tween(stickerAsset, { scaleX: scale * 0.9, scaleY: scale * 0.9 }, { duration: 100 }); }; self.up = function () { tween(stickerAsset, { scaleX: scale, scaleY: scale }, { duration: 100 }); }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0xAFEEEE // Light turquoise background color }); /**** * Game Code ****/ // Define color palette - arranged in rainbow gradient var colors = [ // Black (left) 0x000000, // Violet group 0x9400D3, // Violet 0x4B0082, // Indigo 0x8A2BE2, // Blue Violet // Blue group 0x0000FF, // Blue 0x000080, // Navy Blue 0x00FFFF, // Cyan 0x008080, // Teal // Green group 0x00FF00, // Green 0x32CD32, // Lime Green 0x808000, // Olive // Red group 0x800000, // Maroon 0xA52A2A, // Brown 0xFF0000, // Red 0xFF7F00, // Orange // Yellow group 0xFFD700, // Gold 0xFFFF00, // Yellow // Pink group 0xFF69B4, // Hot Pink // Gray 0x808080, // White (right) 0xFFFFFF]; // Define brush sizes var brushSizes = [10, 20, 30]; // Initialize game variables var currentColor = colors[0]; var currentBrushSize = brushSizes[1]; var currentEraserSize = 50; var currentStickerSize = 1.2; var currentTool = 'brush'; var isPainting = false; var lastX, lastY; var selectedColorButton = null; // Ensure savedEggs is properly initialized in storage var savedEggs = []; if (storage.savedEggs && Array.isArray(storage.savedEggs)) { savedEggs = storage.savedEggs; } else { storage.savedEggs = []; } // Basket already created earlier // Create main egg var easterEgg = new EasterEgg(); easterEgg.x = 2048 / 2; easterEgg.y = 2732 / 2 - 200; game.addChild(easterEgg); // Create UI components // Tool panel var toolPanel = LK.getAsset('toolPanel', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2 - 5, y: 2732 - 100 // Moved up by 20 units }); game.addChild(toolPanel); // Color panel var colorPanel = LK.getAsset('colorPanel', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 2732 - 345 // Moved down by 5 units }); game.addChild(colorPanel); // Add color buttons var colorButtons = []; for (var i = 0; i < colors.length; i++) { var colorButton = new ColorButton(colors[i]); // Position in two rows (10 in first row, 10 in second row) if (i < 10) { // First row colorButton.x = i * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units colorButton.y = 2732 - 410; // First row - moved up by 10 units } else { // Second row colorButton.x = (i - 10) * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units colorButton.y = 2732 - 280; // Second row } game.addChild(colorButton); colorButtons.push(colorButton); // Scale up by 2x tween(colorButton, { scaleX: 2, scaleY: 2 }, { duration: 300 }); // Add click handler (function (color, button) { colorButton.down = function () { tween(colorButton, { scaleX: 1.8, scaleY: 1.8 }, { duration: 100 }); currentColor = color; }; colorButton.up = function () { tween(colorButton, { scaleX: 2, scaleY: 2 }, { duration: 100 }); // Stop any animations on previously selected button if (selectedColorButton) { tween.stop(selectedColorButton); tween(selectedColorButton, { scaleX: 2, scaleY: 2 }, { duration: 100 }); } // Set new selected button selectedColorButton = button; // Start pulsing animation function pulseButton() { tween(selectedColorButton, { scaleX: 2.2, scaleY: 2.2 }, { duration: 500, easing: tween.easeInOut, onFinish: function onFinish() { tween(selectedColorButton, { scaleX: 1.8, scaleY: 1.8 }, { duration: 500, easing: tween.easeInOut, onFinish: pulseButton }); } }); } // Start the pulsing animation pulseButton(); }; })(colors[i], colorButton); } // Create tool buttons // Calculate button width including scale factor var buttonWidth = 120 * 2; // 120px width * 2 scale var buttonSpacing = 25; // 25 units apart var startX = 300; // Starting X position // Create tool buttons var brushButton = new Button("Brush", 0x6495ED); brushButton.x = startX - 75; // Moved left by 25 more units brushButton.y = 2732 - 100; // Moved up by 20 units game.addChild(brushButton); tween(brushButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); brushButton.down = function () { tween(brushButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; brushButton.up = function () { tween(brushButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); currentTool = 'brush'; }; var stickerStarButton = new Button("Star", 0xFFD700); stickerStarButton.x = startX + (buttonWidth + buttonSpacing) * 1 - 75; // Moved left by 25 more units stickerStarButton.y = 2732 - 100; // Moved up by 20 units game.addChild(stickerStarButton); // Set background to gold color stickerStarButton.children[0].tint = 0xFFD700; // Gold color tween(stickerStarButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); stickerStarButton.down = function () { tween(stickerStarButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; stickerStarButton.up = function () { tween(stickerStarButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); currentTool = 'star'; // Toggle size slider visibility sizeSlider.visible = !sizeSlider.visible; }; var stickerHeartButton = new Button("Heart", 0xFF0000); stickerHeartButton.x = startX + (buttonWidth + buttonSpacing) * 2 - 75; // Moved left by 25 more units stickerHeartButton.y = 2732 - 100; // Moved up by 20 units game.addChild(stickerHeartButton); tween(stickerHeartButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); stickerHeartButton.down = function () { tween(stickerHeartButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; stickerHeartButton.up = function () { tween(stickerHeartButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); currentTool = 'heart'; }; var rotateLeftButton = new Button("< Rotate", 0x9370DB); rotateLeftButton.x = startX + (buttonWidth + buttonSpacing) * 3 - 75; // Moved left by 25 more units rotateLeftButton.y = 2732 - 100; // Moved up by 20 units game.addChild(rotateLeftButton); tween(rotateLeftButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); rotateLeftButton.down = function () { tween(rotateLeftButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; rotateLeftButton.up = function () { tween(rotateLeftButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); easterEgg.rotate(-Math.PI / 8); }; // Add a thin grey vertical divider between rotate buttons var divider = LK.getAsset('buttonBg', { anchorX: 0.5, anchorY: 0.5, x: startX + (buttonWidth + buttonSpacing) * 3.5 - 75, // Position between the two rotate buttons y: 2732 - 100, // Same Y as buttons scaleX: 0.05, // Make it thin scaleY: 2 // Same height as buttons }); divider.tint = 0xe6e6fa; // Light lavender color game.addChild(divider); var rotateRightButton = new Button("Rotate >", 0x9370DB); rotateRightButton.x = startX + (buttonWidth + buttonSpacing) * 4 - 75; // Moved left by 25 more units rotateRightButton.y = 2732 - 100; // Moved up by 20 units game.addChild(rotateRightButton); tween(rotateRightButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); rotateRightButton.down = function () { tween(rotateRightButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; rotateRightButton.up = function () { tween(rotateRightButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); easterEgg.rotate(Math.PI / 8); }; var saveButton = new Button("Save", 0x32CD32); saveButton.x = startX + (buttonWidth + buttonSpacing) * 5 - 75; // Moved left by 25 more units saveButton.y = 2732 - 100; // Moved up by 20 units game.addChild(saveButton); tween(saveButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); saveButton.down = function () { tween(saveButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; saveButton.up = function () { tween(saveButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); // Save the current egg design var completedEgg = easterEgg.captureDesign(); // Add to saved eggs var newEggData = { x: 150 + savedEggs.length % 4 * 180, y: 2732 - 600 - Math.floor(savedEggs.length / 4) * 220, color: currentColor }; // Ensure savedEggs is properly initialized as an array if (!Array.isArray(savedEggs)) { savedEggs = []; } // Add the new egg data to our array savedEggs.push(newEggData); // Update storage with a copy of the array storage.savedEggs = savedEggs.slice(); // Play save sound LK.getSound('saveSound').play(); // Add the egg to the basket display displaySavedEggs(); // Increment score LK.setScore(LK.getScore() + 1); // Clear the current egg for a new design easterEgg.clearDesigns(); }; var eraserButton = new Button("Eraser", 0x808080); eraserButton.x = colorPanel.x + colorPanel.width / 2 - 145; // Moved right by 100 units eraserButton.y = colorPanel.y - colorPanel.height / 2 + 139; // Moved down to match all colors button game.addChild(eraserButton); tween(eraserButton, { scaleX: 2.2, scaleY: 3.1 }, { duration: 300 }); eraserButton.down = function () { tween(eraserButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; eraserButton.up = function () { tween(eraserButton, { scaleX: 2.2, scaleY: 3.1 }, { duration: 100 }); currentTool = 'eraser'; }; // Add color palette button var allColorButton = new Button("All Colors", 0x9370DB); allColorButton.x = colorPanel.x + colorPanel.width / 2 - 415; // Position it - moved left by 100 units (from -315 to -415) allColorButton.y = colorPanel.y - colorPanel.height / 2 + 139; // Moved down by 4 units (from 135 to 139) game.addChild(allColorButton); tween(allColorButton, { scaleX: 2.2, scaleY: 3.1 }, { duration: 300 }); // Apply rainbow gradient to all colors button var btnBackground = allColorButton.children[0]; var rainbowColors = [0xFF0000, 0xFF7F00, 0xFFFF00, 0x00FF00, 0x0000FF, 0x4B0082, 0x9400D3]; var colorIndex = 0; var duration = 3000; // 3 seconds for full rainbow cycle // Function to cycle through rainbow colors function cycleRainbowColors() { tween(btnBackground, { tint: rainbowColors[colorIndex] }, { duration: duration / rainbowColors.length, onFinish: function onFinish() { colorIndex = (colorIndex + 1) % rainbowColors.length; cycleRainbowColors(); } }); } // Start the rainbow cycle cycleRainbowColors(); allColorButton.down = function () { tween(allColorButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; allColorButton.up = function () { // Reset to normal size first tween(allColorButton, { scaleX: 2.2, scaleY: 3.1 }, { duration: 100 }); // Toggle the full color palette colorPalette.visible = !colorPalette.visible; // Update selector position to match current selected color if (colorPalette.visible) { colorPalette.updateSelector(currentColor); } }; var clearButton = new Button("Clear", 0xFF6347); clearButton.x = startX + (buttonWidth + buttonSpacing) * 6 - 75; // Moved next to save button clearButton.y = 2732 - 100; // Moved up by 20 units game.addChild(clearButton); tween(clearButton, { scaleX: 2.2, scaleY: 2 }, { duration: 300 }); clearButton.down = function () { tween(clearButton, { scaleX: 1.98, scaleY: 1.8 }, { duration: 100 }); }; clearButton.up = function () { tween(clearButton, { scaleX: 2.2, scaleY: 2 }, { duration: 100 }); easterEgg.clearDesigns(); LK.getSound('clearSound').play(); }; // Function to toggle eraser tool function toggleEraserThicknessSlider(visible) { // Set eraser as current tool when enabled if (visible) { currentTool = 'eraser'; } } // Create basket display var basket = LK.getAsset('basket', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 2732 - 800 // Moved up by 60 units to make room for two rows of color buttons }); game.addChildAt(basket, 0); // Add at index 0 to ensure it's behind the egg // Bring the easterEgg to the front to ensure proper display order game.removeChild(easterEgg); game.addChild(easterEgg); // Title text var titleText = new Text2("Easter Egg Artist", { size: 100, fill: 0x8B4513 // Dark brown }); titleText.anchor.set(0.5, 0); titleText.x = 2048 / 2; titleText.y = 50; game.addChild(titleText); // Score display - hidden but kept in code for reference var scoreText = new Text2("Eggs: 0", { size: 60, fill: 0x4B0082 // Indigo }); scoreText.anchor.set(0, 0); scoreText.x = 120; scoreText.y = 120; scoreText.visible = false; // Hide the score text // Function to display saved eggs function displaySavedEggs() { // Remove any existing displayed eggs for (var i = game.children.length - 1; i >= 0; i--) { if (game.children[i].isCompletedEgg) { game.removeChild(game.children[i]); } } // Display saved eggs for (var i = 0; i < savedEggs.length; i++) { var eggData = savedEggs[i]; var displayedEgg = new CompletedEgg(eggData.color); displayedEgg.x = eggData.x; displayedEgg.y = eggData.y; displayedEgg.isCompletedEgg = true; game.addChild(displayedEgg); } } // Display any saved eggs displaySavedEggs(); // Game event handlers game.down = function (x, y) { if (y < 2732 - 350) { isPainting = true; lastX = x; lastY = y; if (currentTool === 'brush') { var brushStroke = new BrushStroke(currentColor, currentBrushSize); easterEgg.addDesign(x, y, brushStroke); LK.getSound('brushSound').play(); } else if (currentTool === 'star' || currentTool === 'heart') { var size = currentTool === 'star' ? currentStickerSize : 1.2; var sticker = new Sticker(currentTool, size); easterEgg.addDesign(x, y, sticker); LK.getSound('stickerSound').play(); } else if (currentTool === 'eraser') { // Remove the last design element if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) { easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]); LK.getSound('brushSound').play(); // Play sound for eraser too } } } }; game.move = function (x, y) { if (isPainting && (currentTool === 'brush' || currentTool === 'eraser')) { // Calculate distance between last point and current point var dx = x - lastX; var dy = y - lastY; var distance = Math.sqrt(dx * dx + dy * dy); // Get current size based on tool var currentSize = currentTool === 'brush' ? currentBrushSize : currentEraserSize; // Get current color based on tool var strokeColor = currentTool === 'brush' ? currentColor : 0xFFFFFF; // Get alpha based on tool (0 for eraser to make it invisible) var strokeAlpha = currentTool === 'brush' ? 1 : 0; // Play brush sound occasionally while using eraser if (currentTool === 'eraser' && Math.random() < 0.05) { LK.getSound('brushSound').play(); } // If distance is greater than half the size, add intermediate points if (distance > currentSize / 2) { var steps = Math.ceil(distance / (currentSize / 2)); for (var i = 1; i <= steps; i++) { var pointX = lastX + dx * i / steps; var pointY = lastY + dy * i / steps; if (currentTool === 'eraser') { // For eraser, remove the last design element if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) { easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]); } } else { var stroke = new BrushStroke(strokeColor, currentSize); stroke.alpha = strokeAlpha; easterEgg.addDesign(pointX, pointY, stroke); } } } else { if (currentTool === 'eraser') { // For eraser, remove the last design element if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) { easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]); } } else { var stroke = new BrushStroke(strokeColor, currentSize); stroke.alpha = strokeAlpha; easterEgg.addDesign(x, y, stroke); } } lastX = x; lastY = y; } }; game.up = function () { isPainting = false; }; // Update function game.update = function () { // Update score display scoreText.setText("Eggs: " + LK.getScore()); }; // Create and add the full color palette var colorPalette = new ColorPalette(); colorPalette.x = 2048 / 2; colorPalette.y = 2732 / 2 - 200; // Position at center, aligned with the egg game.addChild(colorPalette); // Set up color selection callback colorPalette.onColorSelected = function (color) { currentColor = color; // Stop any animations on previously selected button if (selectedColorButton) { tween.stop(selectedColorButton); tween(selectedColorButton, { scaleX: 2, scaleY: 2 }, { duration: 100 }); } // Find button with matching color and set as selected var _loop = function _loop() { if (colorButtons[i].color === color) { var _pulseSelectedButton2 = function pulseSelectedButton() { tween(selectedColorButton, { scaleX: 2.2, scaleY: 2.2 }, { duration: 500, easing: tween.easeInOut, onFinish: function onFinish() { tween(selectedColorButton, { scaleX: 1.8, scaleY: 1.8 }, { duration: 500, easing: tween.easeInOut, onFinish: _pulseSelectedButton2 }); } }); }; // Start the pulsing animation selectedColorButton = colorButtons[i]; // Start pulsing animation _pulseSelectedButton2(); return 1; // break } }; for (var i = 0; i < colorButtons.length; i++) { if (_loop()) { break; } } }; // Create size slider for star stickers var sizeSlider = new Slider(0.5, 3, 1.2, 300, 0xFFD700); // Gold color sizeSlider.x = 2048 / 2; // Position at center of map sizeSlider.y = 2732 / 2 + 500; // Moved down by 500 units sizeSlider.visible = false; // Hidden by default game.addChild(sizeSlider); // Add label above slider var sizeLabel = new Text2("Sticker Size", { size: 40, fill: 0xFFD700 // Gold color }); sizeLabel.anchor.set(0.5, 0.5); sizeLabel.x = sizeSlider.x + 150; sizeLabel.y = sizeSlider.y - 70; sizeLabel.visible = false; game.addChild(sizeLabel); // Update sticker size when slider value changes sizeSlider.onValueChanged = function (value) { // Update sticker size for next sticker if (currentTool === 'star') { currentStickerSize = value; } }; // Make label visible when slider is visible game.update = function () { // Update score display scoreText.setText("Eggs: " + LK.getScore()); // Update size label visibility to match slider sizeLabel.visible = sizeSlider.visible; }; // Start background music LK.playMusic('easterMusic', { fade: { start: 0, end: 0.2, duration: 1000 } }); // Initialize first color button as selected with animation if (colorButtons.length > 0) { var _pulseSelectedButton = function pulseSelectedButton() { tween(selectedColorButton, { scaleX: 2.2, scaleY: 2.2 }, { duration: 500, easing: tween.easeInOut, onFinish: function onFinish() { tween(selectedColorButton, { scaleX: 1.8, scaleY: 1.8 }, { duration: 500, easing: tween.easeInOut, onFinish: _pulseSelectedButton }); } }); }; // Start the initial pulsing animation selectedColorButton = colorButtons[0]; // Start pulsing animation for first color button _pulseSelectedButton(); }
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1", {
savedEggs: []
});
/****
* Classes
****/
var BrushStroke = Container.expand(function (color, size) {
var self = Container.call(this);
var stroke = self.attachAsset('brushStroke', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: size / 30,
scaleY: size / 30
});
stroke.tint = color;
return self;
});
var Button = Container.expand(function (label, color) {
var self = Container.call(this);
var background = self.attachAsset('buttonBg', {
anchorX: 0.5,
anchorY: 0.5
});
var text = new Text2(label, {
size: 30,
fill: 0xFFFFFF
});
text.anchor.set(0.5, 0.5);
self.addChild(text);
if (color !== undefined) {
background.tint = color;
}
self.down = function () {
tween(background, {
scaleX: 0.9,
scaleY: 0.9
}, {
duration: 100
});
};
self.up = function () {
tween(background, {
scaleX: 1,
scaleY: 1
}, {
duration: 100
});
};
return self;
});
var ColorButton = Container.expand(function (color) {
var self = Container.call(this);
var button = self.attachAsset('colorButton', {
anchorX: 0.5,
anchorY: 0.5
});
button.tint = color;
self.color = color;
self.down = function () {
tween(button, {
scaleX: 0.9,
scaleY: 0.9
}, {
duration: 100
});
};
self.up = function () {
tween(button, {
scaleX: 1,
scaleY: 1
}, {
duration: 100
});
};
return self;
});
var ColorPalette = Container.expand(function () {
var self = Container.call(this);
var background = LK.getAsset('colorPanel', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 1881 / 1880,
// Set to exact size 1881
scaleY: 1899 / 277 // Set to exact size 1899
});
self.addChild(background);
var colorButtons = [];
// Generate 256 color gradient palette
var paletteColors = [];
var buttonSize = 90; // Increased from 30 to 90 (3x larger)
var spacing = 12; // Increased from 4 to 12 (3x larger)
var columns = 16;
var rows = 16;
// Generate rainbow gradient colors for the full 256 color palette
for (var i = 0; i < 256; i++) {
var hue = i / 256;
var r, g, b;
// Convert HSV to RGB (simplified rainbow gradient)
if (hue < 1 / 6) {
r = 1;
g = hue * 6;
b = 0;
} else if (hue < 2 / 6) {
r = (2 / 6 - hue) * 6;
g = 1;
b = 0;
} else if (hue < 3 / 6) {
r = 0;
g = 1;
b = (hue - 2 / 6) * 6;
} else if (hue < 4 / 6) {
r = 0;
g = (4 / 6 - hue) * 6;
b = 1;
} else if (hue < 5 / 6) {
r = (hue - 4 / 6) * 6;
b = 1;
g = 0;
} else {
r = 1;
g = 0;
b = (1 - hue) * 6;
}
// Convert to 0-255 range
var red = Math.floor(r * 255);
var green = Math.floor(g * 255);
var blue = Math.floor(b * 255);
var color = red << 16 | green << 8 | blue;
paletteColors.push(color);
}
for (var i = 0; i < paletteColors.length; i++) {
var row = Math.floor(i / columns);
var col = i % columns;
var colorBtn = new ColorButton(paletteColors[i]);
colorBtn.x = col * (buttonSize + spacing) - (columns - 1) * (buttonSize + spacing) / 2;
colorBtn.y = row * (buttonSize + spacing) - (rows - 1) * (buttonSize + spacing) / 2;
colorBtn.scaleX = 4.5; // Increased from 1.5 to 4.5 (3x larger)
colorBtn.scaleY = 4.5; // Increased from 1.5 to 4.5 (3x larger)
self.addChild(colorBtn);
// Create a closure to capture the current color
(function (color, btn) {
btn.down = function () {
currentColor = color;
self.visible = false;
// Notify the game that a color was selected
if (self.onColorSelected) {
self.onColorSelected(color);
}
};
})(paletteColors[i], colorBtn);
colorButtons.push(colorBtn);
}
// Add selector ring
var selector = LK.getAsset('brushStroke', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 7.5,
// Increased from 2.5 to 7.5 (3x larger)
scaleY: 7.5 // Increased from 2.5 to 7.5 (3x larger)
});
selector.tint = 0xFFFFFF;
selector.alpha = 0.7;
self.addChild(selector);
// Set selector initial position
selector.x = colorButtons[0].x;
selector.y = colorButtons[0].y;
// Hide palette initially
self.visible = false;
// Method to update selector position
self.updateSelector = function (color) {
for (var i = 0; i < paletteColors.length; i++) {
if (paletteColors[i] === color) {
selector.x = colorButtons[i].x;
selector.y = colorButtons[i].y;
break;
}
}
};
return self;
});
var CompletedEgg = Container.expand(function (baseColor) {
var self = Container.call(this);
var eggGraphic = self.attachAsset('completedEgg', {
anchorX: 0.5,
anchorY: 0.5
});
eggGraphic.tint = baseColor || 0xFFFFFF;
// Add some random decoration to make each egg look unique
for (var i = 0; i < 5; i++) {
var glitter = self.attachAsset('glitter', {
anchorX: 0.5,
anchorY: 0.5,
x: (Math.random() - 0.5) * 80,
y: (Math.random() - 0.5) * 120
});
glitter.tint = 0xFFD700 + Math.floor(Math.random() * 0x555555);
}
return self;
});
var EasterEgg = Container.expand(function () {
var self = Container.call(this);
var eggBase = self.attachAsset('eggBase', {
anchorX: 0.5,
anchorY: 0.5
});
var designContainer = new Container();
self.designContainer = designContainer; // Make accessible outside
self.addChild(designContainer);
self.addDesign = function (x, y, designElement) {
var localPosition = designContainer.toLocal({
x: x,
y: y
}, game);
// Check if the point is within the bounds of the eggBase
// Convert to egg's local coordinates for hit testing
var eggLocalPosition = self.toLocal({
x: x,
y: y
}, game);
// Calculate distance from center of egg
var dx = eggLocalPosition.x;
var dy = eggLocalPosition.y;
var distance = Math.sqrt(dx * dx + dy * dy);
// Check if point is inside the egg (ellipse)
// Using the egg's dimensions to determine the ellipse bounds
var eggWidth = eggBase.width / 2;
var eggHeight = eggBase.height / 2;
// Formula for point in ellipse: (x/a)² + (y/b)² <= 1
// where a is half-width and b is half-height
var isInEgg = dx * dx / (eggWidth * eggWidth) + dy * dy / (eggHeight * eggHeight) <= 1;
// Only add design if point is inside the egg
if (isInEgg) {
designElement.x = localPosition.x;
designElement.y = localPosition.y;
designContainer.addChild(designElement);
}
};
self.clearDesigns = function () {
while (designContainer.children.length > 0) {
designContainer.removeChild(designContainer.children[0]);
}
};
self.rotate = function (angle) {
eggBase.rotation += angle;
designContainer.rotation += angle;
};
self.captureDesign = function () {
// In a real implementation, this would create a snapshot of the egg
// For this simplified version, we just create a new completed egg with the same tint
var completedEgg = new CompletedEgg(eggBase.tint);
return completedEgg;
};
return self;
});
var Slider = Container.expand(function (minVal, maxVal, defaultVal, width, color) {
var self = Container.call(this);
// Track properties
self.minValue = minVal || 0;
self.maxValue = maxVal || 100;
self.value = defaultVal || 50;
self.trackWidth = width || 300;
self.trackColor = color || 0xCCCCCC;
// Method definitions - MOVED TO TOP
// Convert value to x position
self.getXForValue = function (val) {
return (val - self.minValue) / (self.maxValue - self.minValue) * self.trackWidth;
};
// Convert x position to value
self.getValueForX = function (x) {
return self.minValue + x / self.trackWidth * (self.maxValue - self.minValue);
};
// Update handle position
self.updateHandlePosition = function () {
handle.x = self.getXForValue(self.value);
valueLabel.x = handle.x;
valueLabel.setText(Math.round(self.value).toString());
};
// Set value
self.setValue = function (val) {
self.value = Math.max(self.minValue, Math.min(self.maxValue, val));
self.updateHandlePosition();
if (self.onValueChanged) {
self.onValueChanged(self.value);
}
};
// Handle drag
self.down = function (x, y) {
self.isDragging = true;
self.setValue(self.getValueForX(x));
};
self.move = function (x, y) {
if (self.isDragging) {
self.setValue(self.getValueForX(Math.max(0, Math.min(self.trackWidth, x))));
}
};
self.up = function () {
self.isDragging = false;
};
// Create track
var track = LK.getAsset('buttonBg', {
anchorX: 0,
anchorY: 0.5,
scaleX: self.trackWidth / 120,
scaleY: 0.3
});
track.tint = self.trackColor;
self.addChild(track);
// Create handle
var handle = LK.getAsset('colorButton', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 1.5,
scaleY: 1.5
});
handle.tint = 0xFFFFFF;
handle.x = self.getXForValue(self.value);
self.addChild(handle);
self.handle = handle;
// Create value label
var valueLabel = new Text2(Math.round(self.value).toString(), {
size: 30,
fill: 0xFFFFFF
});
valueLabel.anchor.set(0.5, 0.5);
valueLabel.y = -40;
valueLabel.x = handle.x;
self.addChild(valueLabel);
self.valueLabel = valueLabel;
return self;
});
var Sticker = Container.expand(function (type, scale) {
var self = Container.call(this);
var stickerAsset;
if (type === 'star') {
stickerAsset = self.attachAsset('stickerStar', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: scale,
scaleY: scale
});
} else if (type === 'heart') {
stickerAsset = self.attachAsset('stickerHeart', {
anchorX: 0.5,
anchorY: 0.5,
scaleX: scale,
scaleY: scale
});
}
self.down = function () {
tween(stickerAsset, {
scaleX: scale * 0.9,
scaleY: scale * 0.9
}, {
duration: 100
});
};
self.up = function () {
tween(stickerAsset, {
scaleX: scale,
scaleY: scale
}, {
duration: 100
});
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0xAFEEEE // Light turquoise background color
});
/****
* Game Code
****/
// Define color palette - arranged in rainbow gradient
var colors = [
// Black (left)
0x000000,
// Violet group
0x9400D3,
// Violet
0x4B0082,
// Indigo
0x8A2BE2,
// Blue Violet
// Blue group
0x0000FF,
// Blue
0x000080,
// Navy Blue
0x00FFFF,
// Cyan
0x008080,
// Teal
// Green group
0x00FF00,
// Green
0x32CD32,
// Lime Green
0x808000,
// Olive
// Red group
0x800000,
// Maroon
0xA52A2A,
// Brown
0xFF0000,
// Red
0xFF7F00,
// Orange
// Yellow group
0xFFD700,
// Gold
0xFFFF00,
// Yellow
// Pink group
0xFF69B4,
// Hot Pink
// Gray
0x808080,
// White (right)
0xFFFFFF];
// Define brush sizes
var brushSizes = [10, 20, 30];
// Initialize game variables
var currentColor = colors[0];
var currentBrushSize = brushSizes[1];
var currentEraserSize = 50;
var currentStickerSize = 1.2;
var currentTool = 'brush';
var isPainting = false;
var lastX, lastY;
var selectedColorButton = null;
// Ensure savedEggs is properly initialized in storage
var savedEggs = [];
if (storage.savedEggs && Array.isArray(storage.savedEggs)) {
savedEggs = storage.savedEggs;
} else {
storage.savedEggs = [];
}
// Basket already created earlier
// Create main egg
var easterEgg = new EasterEgg();
easterEgg.x = 2048 / 2;
easterEgg.y = 2732 / 2 - 200;
game.addChild(easterEgg);
// Create UI components
// Tool panel
var toolPanel = LK.getAsset('toolPanel', {
anchorX: 0.5,
anchorY: 0.5,
x: 2048 / 2 - 5,
y: 2732 - 100 // Moved up by 20 units
});
game.addChild(toolPanel);
// Color panel
var colorPanel = LK.getAsset('colorPanel', {
anchorX: 0.5,
anchorY: 0.5,
x: 2048 / 2,
y: 2732 - 345 // Moved down by 5 units
});
game.addChild(colorPanel);
// Add color buttons
var colorButtons = [];
for (var i = 0; i < colors.length; i++) {
var colorButton = new ColorButton(colors[i]);
// Position in two rows (10 in first row, 10 in second row)
if (i < 10) {
// First row
colorButton.x = i * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units
colorButton.y = 2732 - 410; // First row - moved up by 10 units
} else {
// Second row
colorButton.x = (i - 10) * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units
colorButton.y = 2732 - 280; // Second row
}
game.addChild(colorButton);
colorButtons.push(colorButton);
// Scale up by 2x
tween(colorButton, {
scaleX: 2,
scaleY: 2
}, {
duration: 300
});
// Add click handler
(function (color, button) {
colorButton.down = function () {
tween(colorButton, {
scaleX: 1.8,
scaleY: 1.8
}, {
duration: 100
});
currentColor = color;
};
colorButton.up = function () {
tween(colorButton, {
scaleX: 2,
scaleY: 2
}, {
duration: 100
});
// Stop any animations on previously selected button
if (selectedColorButton) {
tween.stop(selectedColorButton);
tween(selectedColorButton, {
scaleX: 2,
scaleY: 2
}, {
duration: 100
});
}
// Set new selected button
selectedColorButton = button;
// Start pulsing animation
function pulseButton() {
tween(selectedColorButton, {
scaleX: 2.2,
scaleY: 2.2
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(selectedColorButton, {
scaleX: 1.8,
scaleY: 1.8
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: pulseButton
});
}
});
}
// Start the pulsing animation
pulseButton();
};
})(colors[i], colorButton);
}
// Create tool buttons
// Calculate button width including scale factor
var buttonWidth = 120 * 2; // 120px width * 2 scale
var buttonSpacing = 25; // 25 units apart
var startX = 300; // Starting X position
// Create tool buttons
var brushButton = new Button("Brush", 0x6495ED);
brushButton.x = startX - 75; // Moved left by 25 more units
brushButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(brushButton);
tween(brushButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
brushButton.down = function () {
tween(brushButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
brushButton.up = function () {
tween(brushButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
currentTool = 'brush';
};
var stickerStarButton = new Button("Star", 0xFFD700);
stickerStarButton.x = startX + (buttonWidth + buttonSpacing) * 1 - 75; // Moved left by 25 more units
stickerStarButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(stickerStarButton);
// Set background to gold color
stickerStarButton.children[0].tint = 0xFFD700; // Gold color
tween(stickerStarButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
stickerStarButton.down = function () {
tween(stickerStarButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
stickerStarButton.up = function () {
tween(stickerStarButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
currentTool = 'star';
// Toggle size slider visibility
sizeSlider.visible = !sizeSlider.visible;
};
var stickerHeartButton = new Button("Heart", 0xFF0000);
stickerHeartButton.x = startX + (buttonWidth + buttonSpacing) * 2 - 75; // Moved left by 25 more units
stickerHeartButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(stickerHeartButton);
tween(stickerHeartButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
stickerHeartButton.down = function () {
tween(stickerHeartButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
stickerHeartButton.up = function () {
tween(stickerHeartButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
currentTool = 'heart';
};
var rotateLeftButton = new Button("< Rotate", 0x9370DB);
rotateLeftButton.x = startX + (buttonWidth + buttonSpacing) * 3 - 75; // Moved left by 25 more units
rotateLeftButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(rotateLeftButton);
tween(rotateLeftButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
rotateLeftButton.down = function () {
tween(rotateLeftButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
rotateLeftButton.up = function () {
tween(rotateLeftButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
easterEgg.rotate(-Math.PI / 8);
};
// Add a thin grey vertical divider between rotate buttons
var divider = LK.getAsset('buttonBg', {
anchorX: 0.5,
anchorY: 0.5,
x: startX + (buttonWidth + buttonSpacing) * 3.5 - 75,
// Position between the two rotate buttons
y: 2732 - 100,
// Same Y as buttons
scaleX: 0.05,
// Make it thin
scaleY: 2 // Same height as buttons
});
divider.tint = 0xe6e6fa; // Light lavender color
game.addChild(divider);
var rotateRightButton = new Button("Rotate >", 0x9370DB);
rotateRightButton.x = startX + (buttonWidth + buttonSpacing) * 4 - 75; // Moved left by 25 more units
rotateRightButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(rotateRightButton);
tween(rotateRightButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
rotateRightButton.down = function () {
tween(rotateRightButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
rotateRightButton.up = function () {
tween(rotateRightButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
easterEgg.rotate(Math.PI / 8);
};
var saveButton = new Button("Save", 0x32CD32);
saveButton.x = startX + (buttonWidth + buttonSpacing) * 5 - 75; // Moved left by 25 more units
saveButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(saveButton);
tween(saveButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
saveButton.down = function () {
tween(saveButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
saveButton.up = function () {
tween(saveButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
// Save the current egg design
var completedEgg = easterEgg.captureDesign();
// Add to saved eggs
var newEggData = {
x: 150 + savedEggs.length % 4 * 180,
y: 2732 - 600 - Math.floor(savedEggs.length / 4) * 220,
color: currentColor
};
// Ensure savedEggs is properly initialized as an array
if (!Array.isArray(savedEggs)) {
savedEggs = [];
}
// Add the new egg data to our array
savedEggs.push(newEggData);
// Update storage with a copy of the array
storage.savedEggs = savedEggs.slice();
// Play save sound
LK.getSound('saveSound').play();
// Add the egg to the basket display
displaySavedEggs();
// Increment score
LK.setScore(LK.getScore() + 1);
// Clear the current egg for a new design
easterEgg.clearDesigns();
};
var eraserButton = new Button("Eraser", 0x808080);
eraserButton.x = colorPanel.x + colorPanel.width / 2 - 145; // Moved right by 100 units
eraserButton.y = colorPanel.y - colorPanel.height / 2 + 139; // Moved down to match all colors button
game.addChild(eraserButton);
tween(eraserButton, {
scaleX: 2.2,
scaleY: 3.1
}, {
duration: 300
});
eraserButton.down = function () {
tween(eraserButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
eraserButton.up = function () {
tween(eraserButton, {
scaleX: 2.2,
scaleY: 3.1
}, {
duration: 100
});
currentTool = 'eraser';
};
// Add color palette button
var allColorButton = new Button("All Colors", 0x9370DB);
allColorButton.x = colorPanel.x + colorPanel.width / 2 - 415; // Position it - moved left by 100 units (from -315 to -415)
allColorButton.y = colorPanel.y - colorPanel.height / 2 + 139; // Moved down by 4 units (from 135 to 139)
game.addChild(allColorButton);
tween(allColorButton, {
scaleX: 2.2,
scaleY: 3.1
}, {
duration: 300
});
// Apply rainbow gradient to all colors button
var btnBackground = allColorButton.children[0];
var rainbowColors = [0xFF0000, 0xFF7F00, 0xFFFF00, 0x00FF00, 0x0000FF, 0x4B0082, 0x9400D3];
var colorIndex = 0;
var duration = 3000; // 3 seconds for full rainbow cycle
// Function to cycle through rainbow colors
function cycleRainbowColors() {
tween(btnBackground, {
tint: rainbowColors[colorIndex]
}, {
duration: duration / rainbowColors.length,
onFinish: function onFinish() {
colorIndex = (colorIndex + 1) % rainbowColors.length;
cycleRainbowColors();
}
});
}
// Start the rainbow cycle
cycleRainbowColors();
allColorButton.down = function () {
tween(allColorButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
allColorButton.up = function () {
// Reset to normal size first
tween(allColorButton, {
scaleX: 2.2,
scaleY: 3.1
}, {
duration: 100
});
// Toggle the full color palette
colorPalette.visible = !colorPalette.visible;
// Update selector position to match current selected color
if (colorPalette.visible) {
colorPalette.updateSelector(currentColor);
}
};
var clearButton = new Button("Clear", 0xFF6347);
clearButton.x = startX + (buttonWidth + buttonSpacing) * 6 - 75; // Moved next to save button
clearButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(clearButton);
tween(clearButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 300
});
clearButton.down = function () {
tween(clearButton, {
scaleX: 1.98,
scaleY: 1.8
}, {
duration: 100
});
};
clearButton.up = function () {
tween(clearButton, {
scaleX: 2.2,
scaleY: 2
}, {
duration: 100
});
easterEgg.clearDesigns();
LK.getSound('clearSound').play();
};
// Function to toggle eraser tool
function toggleEraserThicknessSlider(visible) {
// Set eraser as current tool when enabled
if (visible) {
currentTool = 'eraser';
}
}
// Create basket display
var basket = LK.getAsset('basket', {
anchorX: 0.5,
anchorY: 0.5,
x: 2048 / 2,
y: 2732 - 800 // Moved up by 60 units to make room for two rows of color buttons
});
game.addChildAt(basket, 0); // Add at index 0 to ensure it's behind the egg
// Bring the easterEgg to the front to ensure proper display order
game.removeChild(easterEgg);
game.addChild(easterEgg);
// Title text
var titleText = new Text2("Easter Egg Artist", {
size: 100,
fill: 0x8B4513 // Dark brown
});
titleText.anchor.set(0.5, 0);
titleText.x = 2048 / 2;
titleText.y = 50;
game.addChild(titleText);
// Score display - hidden but kept in code for reference
var scoreText = new Text2("Eggs: 0", {
size: 60,
fill: 0x4B0082 // Indigo
});
scoreText.anchor.set(0, 0);
scoreText.x = 120;
scoreText.y = 120;
scoreText.visible = false; // Hide the score text
// Function to display saved eggs
function displaySavedEggs() {
// Remove any existing displayed eggs
for (var i = game.children.length - 1; i >= 0; i--) {
if (game.children[i].isCompletedEgg) {
game.removeChild(game.children[i]);
}
}
// Display saved eggs
for (var i = 0; i < savedEggs.length; i++) {
var eggData = savedEggs[i];
var displayedEgg = new CompletedEgg(eggData.color);
displayedEgg.x = eggData.x;
displayedEgg.y = eggData.y;
displayedEgg.isCompletedEgg = true;
game.addChild(displayedEgg);
}
}
// Display any saved eggs
displaySavedEggs();
// Game event handlers
game.down = function (x, y) {
if (y < 2732 - 350) {
isPainting = true;
lastX = x;
lastY = y;
if (currentTool === 'brush') {
var brushStroke = new BrushStroke(currentColor, currentBrushSize);
easterEgg.addDesign(x, y, brushStroke);
LK.getSound('brushSound').play();
} else if (currentTool === 'star' || currentTool === 'heart') {
var size = currentTool === 'star' ? currentStickerSize : 1.2;
var sticker = new Sticker(currentTool, size);
easterEgg.addDesign(x, y, sticker);
LK.getSound('stickerSound').play();
} else if (currentTool === 'eraser') {
// Remove the last design element
if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
LK.getSound('brushSound').play(); // Play sound for eraser too
}
}
}
};
game.move = function (x, y) {
if (isPainting && (currentTool === 'brush' || currentTool === 'eraser')) {
// Calculate distance between last point and current point
var dx = x - lastX;
var dy = y - lastY;
var distance = Math.sqrt(dx * dx + dy * dy);
// Get current size based on tool
var currentSize = currentTool === 'brush' ? currentBrushSize : currentEraserSize;
// Get current color based on tool
var strokeColor = currentTool === 'brush' ? currentColor : 0xFFFFFF;
// Get alpha based on tool (0 for eraser to make it invisible)
var strokeAlpha = currentTool === 'brush' ? 1 : 0;
// Play brush sound occasionally while using eraser
if (currentTool === 'eraser' && Math.random() < 0.05) {
LK.getSound('brushSound').play();
}
// If distance is greater than half the size, add intermediate points
if (distance > currentSize / 2) {
var steps = Math.ceil(distance / (currentSize / 2));
for (var i = 1; i <= steps; i++) {
var pointX = lastX + dx * i / steps;
var pointY = lastY + dy * i / steps;
if (currentTool === 'eraser') {
// For eraser, remove the last design element
if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
}
} else {
var stroke = new BrushStroke(strokeColor, currentSize);
stroke.alpha = strokeAlpha;
easterEgg.addDesign(pointX, pointY, stroke);
}
}
} else {
if (currentTool === 'eraser') {
// For eraser, remove the last design element
if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
}
} else {
var stroke = new BrushStroke(strokeColor, currentSize);
stroke.alpha = strokeAlpha;
easterEgg.addDesign(x, y, stroke);
}
}
lastX = x;
lastY = y;
}
};
game.up = function () {
isPainting = false;
};
// Update function
game.update = function () {
// Update score display
scoreText.setText("Eggs: " + LK.getScore());
};
// Create and add the full color palette
var colorPalette = new ColorPalette();
colorPalette.x = 2048 / 2;
colorPalette.y = 2732 / 2 - 200; // Position at center, aligned with the egg
game.addChild(colorPalette);
// Set up color selection callback
colorPalette.onColorSelected = function (color) {
currentColor = color;
// Stop any animations on previously selected button
if (selectedColorButton) {
tween.stop(selectedColorButton);
tween(selectedColorButton, {
scaleX: 2,
scaleY: 2
}, {
duration: 100
});
}
// Find button with matching color and set as selected
var _loop = function _loop() {
if (colorButtons[i].color === color) {
var _pulseSelectedButton2 = function pulseSelectedButton() {
tween(selectedColorButton, {
scaleX: 2.2,
scaleY: 2.2
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(selectedColorButton, {
scaleX: 1.8,
scaleY: 1.8
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: _pulseSelectedButton2
});
}
});
}; // Start the pulsing animation
selectedColorButton = colorButtons[i];
// Start pulsing animation
_pulseSelectedButton2();
return 1; // break
}
};
for (var i = 0; i < colorButtons.length; i++) {
if (_loop()) {
break;
}
}
};
// Create size slider for star stickers
var sizeSlider = new Slider(0.5, 3, 1.2, 300, 0xFFD700); // Gold color
sizeSlider.x = 2048 / 2; // Position at center of map
sizeSlider.y = 2732 / 2 + 500; // Moved down by 500 units
sizeSlider.visible = false; // Hidden by default
game.addChild(sizeSlider);
// Add label above slider
var sizeLabel = new Text2("Sticker Size", {
size: 40,
fill: 0xFFD700 // Gold color
});
sizeLabel.anchor.set(0.5, 0.5);
sizeLabel.x = sizeSlider.x + 150;
sizeLabel.y = sizeSlider.y - 70;
sizeLabel.visible = false;
game.addChild(sizeLabel);
// Update sticker size when slider value changes
sizeSlider.onValueChanged = function (value) {
// Update sticker size for next sticker
if (currentTool === 'star') {
currentStickerSize = value;
}
};
// Make label visible when slider is visible
game.update = function () {
// Update score display
scoreText.setText("Eggs: " + LK.getScore());
// Update size label visibility to match slider
sizeLabel.visible = sizeSlider.visible;
};
// Start background music
LK.playMusic('easterMusic', {
fade: {
start: 0,
end: 0.2,
duration: 1000
}
});
// Initialize first color button as selected with animation
if (colorButtons.length > 0) {
var _pulseSelectedButton = function pulseSelectedButton() {
tween(selectedColorButton, {
scaleX: 2.2,
scaleY: 2.2
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(selectedColorButton, {
scaleX: 1.8,
scaleY: 1.8
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: _pulseSelectedButton
});
}
});
}; // Start the initial pulsing animation
selectedColorButton = colorButtons[0];
// Start pulsing animation for first color button
_pulseSelectedButton();
}