xxxxxxxxxx
122
let myShader, myWidth, myHeight;
let noise;
let f = 0.1;
let k = 0.1;
let dA = 2.;
let dB = 1.;
let offset = 0.0001;
let timestep = 1.;
function preload() {
bufferShader = loadShader("buffer.vert", "buffer.frag");
displacementShader = loadShader("displacement.vert", "displacement.frag");
equationShader =
loadShader("equation.vert", "equation.frag");
scalerShader = loadShader("scaler.vert", "scaler.frag");
noise = loadImage("noise.png");
}
function setup() {
// shaders require WEBGL mode to work
createCanvas(windowWidth, windowHeight, WEBGL);
myWidth = width - 10;
myHeight = height - 10;
buffer = createGraphics(myWidth, myHeight, WEBGL);
buffer.noStroke();
buffer.fill("red")
buffer.rect(0, 0, myWidth, myHeight);
buffer.fill("green");
// circle(0, 0, 100);
for(let i = 0; i < 5000; i += 1) {
buffer.circle(random()*myWidth, random()*myHeight, 1);
}
equation = createGraphics(myWidth, myHeight, WEBGL);
equation.noStroke();
scaler = createGraphics(myWidth, myHeight, WEBGL);
scaler.noStroke();
p_slider = createSlider(0., 0.5, 0.001, 0.001);
p_slider.position(10, 20);
dA_slider = createSlider(0., 100., dA, 0.01);
dA_slider.position(10, 40);
dB_slider = createSlider(0., 100., dB, 0.01);
dB_slider.position(10, 60);
f_slider = createSlider(0., 0.5,f, 0.001);
f_slider.position(10, 80);
k_slider = createSlider(0., 0.5, k, 0.001);
k_slider.position(10, 100);
timestep_slider = createSlider(0.1, 2., timestep, 0.001);
timestep_slider.position(10, 120);
noStroke();
}
function draw() {
background(0);
// Compute next step
equation.shader(equationShader);
equationShader.setUniform("uTexture", buffer);
equationShader.setUniform('u_mouse', [mouseX/windowWidth, mouseY/windowHeight]);
equationShader.setUniform('u_time', millis()/1000);
equationShader.setUniform('u_resolution', [myWidth, myHeight]);
equationShader.setUniform('u_p', p_slider.value());
equationShader.setUniform('settings', [f_slider.value(), k_slider.value(), dA_slider.value(), dB_slider.value()]);
equationShader.setUniform('u_offset', offset);
equationShader.setUniform('u_timestep', timestep_slider.value())
equation.rect(0, 0, myWidth, myHeight);
image(equation, -myWidth/2, -myHeight/2);
resetShader();
// Send result to buffer shader
buffer.shader(bufferShader);
bufferShader.setUniform('u_resolution', [myWidth, myHeight]);
bufferShader.setUniform("uTexture", equation);
buffer.rect(0, 0, myWidth, myHeight);
// image(buffer, -myWidth/2, -myHeight/2 )
resetShader();
scaler.shader(scalerShader);
scalerShader.setUniform("uTexture", buffer);
scalerShader.setUniform('u_resolution', [myWidth, myHeight]);
scaler.rect(0, 0, myWidth, myHeight);
image(scaler,-myWidth, -myHeight);
resetShader();
// 3d projection of displacement
shader(displacementShader);
displacementShader.setUniform("uTexture", scaler);
// // Rotate our geometry on the X and Y axes
// rotateX(frameCount * 0.01);
rotateY(frameCount * 0.005);
// // Draw some geometry to the screen
// // We're going to tessellate the sphere a bit so we have some more geometry to work with
sphere(myWidth / 5, 200, 200);
resetShader();
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
}