User prompt
Create a firework effect which is a ring of many particles expanding, an expanding ring resembling fireworks. Create such a class.
User prompt
Please fix the bug: 'Timeout.tick error: requestAnimationFrame is not a function' in or related to this line: 'requestAnimationFrame(_animate);' Line Number: 1259
User prompt
Please fix the bug: 'Timeout.tick error: requestAnimationFrame is not a function' in or related to this line: 'requestAnimationFrame(_animate);' Line Number: 1259
User prompt
Correct. Please proceed with that plan.
User prompt
Please fix the bug: 'Timeout.tick error: currentTime is not defined' in or related to this line: 'var progress = (currentTime - startTime) / duration;' Line Number: 1240
User prompt
Please fix the bug: 'Timeout.tick error: progress is not defined' in or related to this line: 'self.y += Math.sin(angle) * speed - 9.8 * progress * progress; // Gravity effect' Line Number: 1240
User prompt
The firework effect should be like a circle of particles expanding, similar to the sparks of fireworks commonly seen in the air, in the sky.
User prompt
Improve the firework effect to have more particles and look nicer.
Code edit (9 edits merged)
Please save this source code
User prompt
trigger fireworks on the screen when setting the text 'happy new year!'
User prompt
Create a function that makes a firework particle effect
Code edit (1 edits merged)
Please save this source code
Remix started
Copy Jewel Crush Unicorn
===================================================================
--- original.js
+++ change.js
@@ -1188,8 +1188,37 @@
}
animate();
};
});
+// FireworkParticle class
+var FireworkParticle = Container.expand(function () {
+ var self = Container.call(this);
+ var particleGraphics = self.attachAsset('confettiRed', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.init = function (x, y) {
+ self.x = x;
+ self.y = y;
+ var angle = Math.random() * Math.PI * 2;
+ var speed = 5 + Math.random() * 10; // Increased speed for firework effect
+ var duration = 500 + Math.random() * 500; // Shorter duration for quick explosion effect
+ var startTime = Date.now();
+ var animate = function animate() {
+ var currentTime = Date.now();
+ var progress = (currentTime - startTime) / duration;
+ self.x += Math.cos(angle) * speed;
+ self.y += Math.sin(angle) * speed - 9.8 * progress * progress; // Gravity effect
+ self.alpha = 1 - progress; // Fade out effect
+ if (progress < 1) {
+ LK.setTimeout(animate, 16);
+ } else {
+ self.destroy();
+ }
+ };
+ animate();
+ };
+});
// Gem class
var Gem = Container.expand(function (color) {
var self = Container.call(this);
self.scaleUpAndDown = function (delay) {
@@ -1806,11 +1835,11 @@
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return ("string" === r ? String : Number)(t);
}
-var welcomeText = new Text2("Happy New Year /nof the Dragon!", {
- size: 300,
- fill: "#ffffff",
+var welcomeText = new Text2("Year of the Dragon", {
+ size: 110,
+ fill: "#ffff00",
x: 1024,
// Center of the screen
y: 1366,
// Middle of the screen
@@ -1818,14 +1847,15 @@
anchorY: 0.5,
stroke: true,
weight: 800,
dropShadow: true,
- strokeColor: '#000000',
- strokeThickness: 10
+ dropShadowDistance: 20,
+ strokeColor: '#ff0000',
+ strokeThickness: 14
});
welcomeText.anchor.set(.5);
LK.gui.center.addChild(welcomeText); // Add countdown display to the center GUI layer
-welcomeText.y = -300;
+welcomeText.y = -200;
var countdownValue = 3; // Start countdown from 3
var countdownTxt = new Text2(countdownValue.toString(), {
size: 300,
fill: "#ffffff",
@@ -1836,9 +1866,10 @@
anchorX: 0.5,
anchorY: 0.5,
stroke: true,
weight: 800,
- dropShadow: true
+ dropShadow: true,
+ strokeThickness: 14
});
countdownTxt.anchor.set(.5);
LK.gui.center.addChild(countdownTxt); // Add countdown display to the center GUI layer
var countdownInterval = LK.setInterval(function () {
@@ -1877,9 +1908,25 @@
scaleStep();
};
scaleUp();
} else if (countdownValue === 0) {
- countdownTxt.setText('GO!');
+ countdownTxt.setText('Happy new year!');
+ countdownTxt.setStyle({
+ size: 80,
+ fill: "#ffffff",
+ x: 1024,
+ // Center of the screen
+ y: 1366,
+ // Middle of the screen
+ anchorX: 0.5,
+ anchorY: 0.5,
+ stroke: true,
+ weight: 800,
+ dropShadow: true,
+ dropShadowDistance: 20,
+ strokeColor: '#ff0000',
+ strokeThickness: 14
+ });
spinHourglass();
// Bounce effect
var scaleUpDuration = 200; // Duration to scale up in milliseconds
var scaleDownDuration = 200; // Duration to scale down in milliseconds
@@ -1899,9 +1946,9 @@
};
scaleStep();
};
var scaleDown = function scaleDown() {
- var fadeOutDuration = 500; // Duration for the fade out in milliseconds
+ var fadeOutDuration = 1500; // Duration for the fade out in milliseconds
var startTime = Date.now();
var fadeStep = function fadeStep() {
var currentTime = Date.now();
var progress = Math.min(1, (currentTime - startTime) / fadeOutDuration);
Magic, purple gem. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
glow. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Hourglass icon white. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Glow glare star. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Cute toony red cool dragon in flight sideview. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Shiny red envelope bao, chinese new years. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Magic greem gem in odd shape. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Magic Orange Gem. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Magic Blue Drop Shaped Gem. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
remove
Brilliant Gold Checkmark. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Magic diamond. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Mystic cavern. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Chinese new years, magical landscape, year of the dragon. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.