46 lines
906 B
JavaScript
46 lines
906 B
JavaScript
|
const black = '#1a181a';
|
||
|
|
const white = '#e5c463';
|
||
|
|
let width = window.innerWidth;
|
||
|
|
let height = window.innerHeight;
|
||
|
|
|
||
|
|
let xScale = 0.015;
|
||
|
|
let yScale = 0.02;
|
||
|
|
|
||
|
|
let gridsize = 10;
|
||
|
|
|
||
|
|
let canvas;
|
||
|
|
let frameBuffer;
|
||
|
|
|
||
|
|
function setup(){
|
||
|
|
canvas = createCanvas(width, height, WEBGL);
|
||
|
|
frameBuffer = createFramebuffer({ width: 800, height: 800 });
|
||
|
|
noFill();
|
||
|
|
noStroke();
|
||
|
|
rotateY(45);
|
||
|
|
}
|
||
|
|
|
||
|
|
function draw() {
|
||
|
|
if (frameCount % 60 === 0) {
|
||
|
|
frameBuffer.begin();
|
||
|
|
background(black);
|
||
|
|
fill(white);
|
||
|
|
const count = frameCount / 100;
|
||
|
|
for (let x = -0.5 * width; x < 0.5 * width; x += gridsize) {
|
||
|
|
for (let y = -0.5 * height; y < 0.5 * height; y += gridsize) {
|
||
|
|
let noiseValue = noise(x * xScale, y * yScale, count);
|
||
|
|
|
||
|
|
square(x, y, noiseValue * gridsize);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
frameBuffer.end();
|
||
|
|
}
|
||
|
|
|
||
|
|
background(black);
|
||
|
|
push();
|
||
|
|
rotateY(frameCount / 1000);
|
||
|
|
textureWrap(MIRROR);
|
||
|
|
texture(frameBuffer);
|
||
|
|
sphere(200);
|
||
|
|
pop();
|
||
|
|
}
|