/*
Rishabh Patni
Use: Control the snow with the force! (Kidding, use your mouse)
*/
/* MOVE MOUSE TO CHANGE THE DIRECTION AND SPEED OF THW SNOW */
// A variable to hold the new object
var mySnow;
//Initializing an array to hold the multiple new objects
var allMySnow = [];
function setup() {
createCanvas(600, 600);
// Creating a new object and assigning it to the variable
mySnow = new Snow();
// For loop to add objects to the array
for (var i = 0; i < 800; i++) {
allMySnow[i] = new Snow();
}
}
function draw() {
background("black");
//Loop over array to draw all snow
for (var i = 0; i < allMySnow.length; i++) {
allMySnow[i].display();
allMySnow[i].move();
}
}
//Object
class Snow {
constructor() {
this.x = round(random(-400, 1000));
this.y = round(random(0, height));
this.size = random(2, 8);
this.speed = random(1, 6);
}
display() {
//Draws the concentric circles
noStroke();
fill("white");
circle(this.x, this.y, this.size);
}
move() {
let dir = map(mouseX, 0, width, -this.speed/5, this.speed/5, true);
let sp = map(mouseY, 0, height, this.speed/5, this.speed, true);
//Moves the circles in different speeds
this.y += sp;
this.x += dir
//Brings the object back to the top of the canvas
if (this.y > height) {
this.y = 0;
}
}
}
This Pen doesn't use any external CSS resources.