66 lines, 18 of them comments ยท 1,033 tokens, written in 28 seconds for $0.0022


 1  let gridSize = 30; // Spacing between circles
 2  let circleBase = 15; // Base circle size
 3  let exploding = false; // Explosion state
 4  let explodeStartTime = 0; // When explosion started
 5  const explodeDuration = 500; // Explosion duration in milliseconds
 6  
 7  function setup() {
 8    createCanvas(600, 400);
 9    colorMode(HSB, 360, 100, 100, 1); // Use HSB color mode
10    noStroke();
11  }
12  
13  function draw() {
14    // Animate background gradient
15    let hue = (frameCount * 0.5) % 360;
16    background(hue, 40, 100);
17    
18    // Calculate explosion progress (0 to 1)
19    let explosionProgress = 0;
20    if (exploding) {
21      explosionProgress = min(1, (millis() - explodeStartTime) / explodeDuration);
22      if (explosionProgress === 1) {
23        exploding = false; // End explosion
24      }
25    }
26    
27    // Draw grid of circles
28    for (let x = gridSize; x < width; x += gridSize) {
29      for (let y = gridSize; y < height; y += gridSize) {
30        // Calculate distance from mouse
31        let d = dist(x, y, mouseX, mouseY);
32        
33        // Calculate explosion displacement
34        let displacement = 0;
35        if (exploding) {
36          // Calculate direction away from mouse
37          let angle = atan2(y - mouseY, x - mouseX);
38          // Scale displacement by explosion progress and inverse of distance
39          displacement = explosionProgress * 100 * (1 - min(1, d/200));
40          x += displacement * cos(angle);
41          y += displacement * sin(angle);
42        }
43        
44        // Circle size changes with mouse distance
45        let size = circleBase * (0.5 + 100 / (d + 100));
46        
47        // Circle color based on position and time
48        let hue = (x * 0.5 + y * 0.5 + frameCount) % 360;
49        fill(hue, 80, 90);
50        
51        // Draw circle
52        ellipse(x, y, size);
53        
54        // Reset position if explosion was applied
55        if (exploding) {
56          x -= displacement * cos(angle);
57          y -= displacement * sin(angle);
58        }
59      }
60    }
61  }
62  
63  function mousePressed() {
64    exploding = true;
65    explodeStartTime = millis();
66  }