Skip to content

Instantly share code, notes, and snippets.

@empireshades
Last active March 14, 2022 03:15
Show Gist options
  • Save empireshades/687b03735ce7aa3a15ec8b9bb1764f30 to your computer and use it in GitHub Desktop.
Save empireshades/687b03735ce7aa3a15ec8b9bb1764f30 to your computer and use it in GitHub Desktop.
p5.js sketch
// grey dots colored dot p5.js
let canvasedge = 600;
// how much to increment each for loop by
let inc = 30;
let ra_x = 0;
let ra_y = 0;
let lastX=0;
let lastY=0;
let lastredX=0;
let lastredY=0;
function setup() {
createCanvas(canvasedge, canvasedge);
}
function draw() {
background(0);
// dominant fill color (grey)
let c = color(110, 110, 110);
if ((frameCount % 1000) == 0) {
ra_x = random(canvasedge);
ra_x = int(ra_x / inc) * inc
ra_y = random(canvasedge);
ra_y = int(ra_y / inc) * inc
}
let red = 0;
for(x = 0; x <= mouseX; x += inc){
for(y = 0; y <= mouseY; y += inc){
// if coords match random red, and mouse has moved,
// then fill red
if ((x == ra_x && y == ra_y) && (mouseX != lastX || mouseY != lastY)) {
fill(color(120,10,10));
ellipse(x, y, 20, 20);
lastredX = x;
lastredY = y;
// otherwise mouse hasn't moved and refill the last
// known red dot
} else if (x == lastredX && y == lastredY) {
fill(color(120,10,10));
ellipse(lastredX, lastredY, 20, 20);
// fill grey box
} else {
fill(c);
ellipse(x, y, 20, 20);
}
}
}
lastX = mouseX;
lastY = mouseY;
}
let w = 600;
let h = 600;
var r; //radius
var angle
var step //distance between steps in radians
let hwasa;
function preload() {
hwasa = loadImage("https://media2.bollywoodhungama.in/wp-content/uploads/2021/09/MAMAMOO-Hwasa-to-reportedly-make-her-solo-comeback-in-2021-2.jpg");
}
function setup() {
createCanvas(w, h);
//initialize variables
r = 165;
angle = 0;
offset = 0;
step = TWO_PI/360; //in radians equivalent of 360/6 in degrees
frameRate(25);
}
function draw() {
clear();
noFill();
// big circle
circle(w/2, h/2, .95 * w);
//move 0,0 to the center of the screen
translate(width/2, height/2);
// draw smaller circles
for (let i = 0; i < 4; i++) {
//convert polar coordinates to cartesian coordinates
var x = r * sin(angle + (TWO_PI/4)*i);
var y = r * cos(angle + (TWO_PI/4)*i);
imageMode(CENTER);
image(hwasa, x, y, w/2.5, h/3);
//draw ellipse at every x,y point
ellipse(x, y, w/2.75);
}
// increase angle by step size to make
// rotation movement
angle = angle + step;
fill(0);
textSize(abs(sin(frameCount/50)*32) + 10);
textAlign(CENTER, CENTER);
text('❤️❤️❤️❤️', 0, 0);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment