function TYPE (DAY,DATES) {
    
    this.DAY =DAY;
    this.DATES = DATES;
    
    
    noStroke();
    fill(255, 90);
    textFont("Arial"); 
    textSize(20); //size
    textAlign(LEFT, CENTER);
    text('DAY '+ this.DAY, width - 125, 35);

    textSize(18); 
    text("#CODING365", 25, 35);
    
    textSize(14); 
    text("Created by", 25, height - 50);
    textSize(16); 
    text("Pem Zhipeng Xie", 25, height - 30);

    textSize(16); 
    text(this.DATES, width - 125, height - 30);
    
//    textSize(16); 
//    text("微博@Pem臭人鹏", width - 150, height - 50);
}


/* fill(74, 224, 242);*/
let col = [];
let firwork;
let bombs = [];
var lightsaber;
let  MousePic;
let doge;
let clouds = [];
let cloud1, cloud2, cloud3, cloud4;



function setup() {
    createCanvas(windowWidth, windowHeight);
    noStroke();
    col = [color(74, 224, 242), color(233, 2, 146), color(226, 230, 54), color(150, 4, 191)];
}

function draw() {
    background(23, 35, 55);
    TYPE("089", "03 Mar 2018");


    for (var A = 0; A < bombs.length; A++) {
        for (var B = 0; B < bombs.length; B++) {
            if (A != B && dist(bombs[A].pos.x, bombs[A].pos.y, bombs[B].pos.x, bombs[B].pos.y) <= 180) {
                var colN = int(random(0, 4));
                strokeWeight(0.4);
                stroke(col[colN]);
                line(bombs[A].pos.x, bombs[A].pos.y, bombs[B].pos.x, bombs[B].pos.y);

                bombs[A].checkCollision(bombs[B].pos.x, bombs[B].pos.y, bombs[B].r);
            }
        }
    }

    for (var i = bombs.length - 1; i >= 0; i--) {
        bombs[i].display();
        bombs[i].changeSize();
        bombs[i].move();
        bombs[i].bound();

        if (bombs.length > 15) {

            let mdistance = this.dist(mouseX, mouseY, bombs[i].pos.x, bombs[i].pos.y);
            if (mdistance <= bombs[i].r) bombs[i].addForce(pmouseX, pmouseY, mouseX, mouseY);
            
           MousePic = new bigbang();
        MousePic.show();

        }

        if (bombs[i].r >= 40) {
            bombs.splice(i, 1);
        }

    }


   
}


function mousePressed() {
    if (bombs.length <= 20) bombs.push(new Bomb(mouseX + random(-10, 10), mouseY + random(-10, 10)));
    //    bombs.push(new Bomb(mouseX + random(-10, 10), mouseY + random(-10, 10)));

}





class Bomb {
    constructor(x, y) {
        this.x = x;
        this.y = y;
        this.r = random(5, 10);



        this.acc = createVector(0, 0); //加速度
        this.vel = createVector(random(-0.8, 0.8), random(-0.8, 0.8)); //速度
        this.pos = createVector(this.x, this.y); //位置
        this.speed = random(0.1, 0.03); //倍数
        this.maxr = random(10, 40);



        this.ha = int(random(0, 4));


    }




    addForce(px, py, x, y) {

        this.force = createVector((x - px), (y - py));
        this.force.mult(0.3);
        this.vel.add(this.force);


    }





    move() {
        //        this.gravity = new p5.Vector(0, 0.0001);
        //        this.acc.add(this.gravity);

        this.vel.add(this.acc);

        this.pos.add(this.vel);
        this.acc.mult(0);
    }

    //https://www.openprocessing.org/sketch/403078
    checkCollision(x, y, r) {

        this.distance = sqrt((this.pos.x - x) * (this.pos.x - x) + (this.pos.y - y) * (this.pos.y - y));

        if (this.distance < this.r / 2 + r / 2) {
            this.mag = this.vel.mag();

            // Push ball out of key object.
            this.bounce = this.pos.copy();
            this.new = createVector(x, y);
            this.bounce.sub(this.new);
            this.bounce.normalize();
            this.bounce.mult(this.r / 2 + r / 2 - this.distance);
            this.pos.add(this.bounce);

            // Set its new velocity with some friction.
            this.bounce.normalize();
            this.bounce.mult(this.mag * 0.9);
            this.vel = this.bounce;
            this.ha = int(random(0, 4));
        }

    }




    display() {
        //        stroke(10, 240, 224);
        //        strokeWeight(2);
        fill(col[this.ha]);
        ellipse(this.pos.x, this.pos.y, this.r, this.r);
    }


    changeSize(x, y) {

        if (this.r <= this.maxr) this.r += this.speed;

    }


    disappear() {
        if (this.r <= 0) {
            return true;
        }
    }



    bound() {
        if (this.pos.x <= (0 + this.r) || this.pos.x >= (width - this.r)) {
            this.vel.x *= -1;
            this.ha = int(random(0, 4));

        }
        if (this.pos.y <= (0 + this.r) || this.pos.y >= (height - this.r)) {

            this.vel.y *= -1;
            this.ha = int(random(0, 4));
        }
    }
}



function bigbang () {
    this.x = mouseX;
    this.y = mouseY;
    this.n = 40;

    this.show = function () {
        push();
        translate(this.x, this.y);
        //    scale(mouseX/90);
        push()
        for (i = 0; i < 12; i++) {

            recursion(this.n);
            rotate(PI / 6);
        }
        pop();
        pop();
    }

   
}


function recursion(r) {
   
    ratio = map(cos(frameCount / 20), 0, 1, PI / 4, 2 * PI);
    ratio2 = map(noise(frameCount / 20), -1, 1, 0, 0.70);
    ratio3 = 0.3 //map(-sin(frameCount / 30 ), -1, 1, 0, 0.30);
    //blendMode(OVERLAY);
    blendMode(SCREEN);
    // blendMode(REPLACE);
    // blendMode(BURN);


    r2 = r * ratio3;
    r = r * ratio2;


    push();

    strokeWeight(0.5);

    line()
    noStroke();

     var colN = int(random(0, 4));
    fill(col[colN ]);
    var v1 = r2 / 2;

    ellipse(r, r, 4, 4);
    ellipse(-r, -r, r / 25, r / 25);
    pop();



    if (r > 25) {
        push();
        translate(20, 0);
        rotate(ratio);
        recursion(r);
        pop();

        push();
        translate(20, 0);
        rotate(-ratio);
        recursion(r);
        pop();
    }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.js
  2. https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.dom.js
  3. https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/addons/p5.sound.js