let cnv2;
let myShader;
function setup() {
createCanvas(windowWidth, windowHeight, WEBGL);
cnv2 = createGraphics(width * 2, height * 2);
myShader = createShader(vert, frag);
cnv2.stroke(255);
cnv2.strokeWeight(2);
shader(myShader);
nRot = int(random(5, 20));
cnv2.translate(width, height);
myShader.setUniform("num1", random(0.1, 0.5));
myShader.setUniform("num2", random(0.1, 0.5));
myShader.setUniform("num3", random(-1, 1));
}
function draw() {
let t = frameCount / 2000;
let n = 40 + 19 * sin(t);
myShader.setUniform("u_time", t);
myShader.setUniform("u_resolution", [width / 10, height / 10]);
cnv2.background(50, 190, 200, 2);
for (let j = 0; j < nRot; j++) {
cnv2.push();
cnv2.rotate((TWO_PI / nRot) * j);
cnv2.translate(100 * sin(t), 100 * cos(t));
for (let i = 0; i < n; i++) {
cnv2.push();
cnv2.rotate((TWO_PI / n) * i * j + t);
cnv2.translate(0, 0);
cnv2.fill(255);
cnv2.circle(width / 2, height / 2, 10);
cnv2.pop();
}
cnv2.pop();
}
drawScreen();
}
function drawScreen() {
myShader.setUniform("texture", cnv2);
push();
rect(-width, -height, width, height);
pop();
}
var frag = `
#ifdef GL_ES
precision mediump float;
#endif
uniform vec2 u_resolution;
varying vec2 vTexCoord;
uniform float u_time;
uniform float num1;
uniform float num2;
uniform float num3;
uniform sampler2D texture;
void main() {
vec2 uv = vTexCoord;
vec2 st = gl_FragCoord.xy/u_resolution.xy;
uv.y = 1.0 - uv.y;//flip y
float d = length(uv);
vec2 offset = vec2(num1*sin(num1*u_time*st.x-d*st.y*cos(u_time)), num2*cos(u_time*num3+st.y- d*sin(u_time)-st.x*num3));
vec3 col;
col.r = texture2D(texture, uv + offset*num3).r;
col.g = texture2D(texture, uv+offset*num3).g;
col.b = texture2D(texture, uv+ offset*num3).b;
gl_FragColor = vec4(col.r*0.8- d*sin(u_time*num1),col.g-d*cos(u_time*num2-d),col.b- d*cos(u_time), 1);
}
`;
var vert = `
attribute vec3 aPosition;
attribute vec2 aTexCoord;
varying vec2 vTexCoord;
void main() {
// copy the texcoords
vTexCoord = aTexCoord;
vec4 positionVec4 = vec4(aPosition, 1.0);
positionVec4.xy = positionVec4.xy * 2.6 - 1.0;//remap center
gl_Position = positionVec4;
}
`;
function mousePressed() {
setup();
draw();
}