let block2;

let clack;

let count;

​

function preload() {

    clack = loadSound('clack.wav');

}

​

function sound() {

    //clack.play();

    count++;

    clack.setVolume(0.3);

}

​

function setup() {

    createCanvas(windowWidth - 2, 300);

    block1 = new Block(100, 40, 0, 1, 0);

    block2 = new Block(200, 150, -1, 100, 40);

    count = 0;

}

​

function draw() {

    background(0);

​

    let clackSound = false;

​

    if (block1.collide(block2)) {

        const v1 = block1.bounce(block2);

        const v2 = block2.bounce(block1);

        block1.v = v1;

        block2.v = v2;

        clackSound = true;

        sound();

    }

    if (block1.hitWall()) {

        block1.reverse();

        sound();

        clackSound = true;

    }

    if (block2.hitWalls(block2)) {

        block2.reversee(block2);

        sound();

        clackSound = true;

    }

    block1.display();

    block2.display();

    block1.update();

    block2.update();

    displayingtext();

    if (count == 50 || count == 100 ||

        count == 150 || count == 200) {

        block1.changeColor();

        block2.changeColor();

    }

    if (clackSound)

        clack.play();

}

​

function displayingtext() {

    textSize(32);

    stroke(255);

    strokeWeight(2);

    fill(0, 102, 153);

    text('No. of collisions :  ' + count, 10, 30);

}