let theShader;
function
setup() {
createCanvas(400, 400, WEBGL);
background(0);
noStroke();
theShader = createShader(vertShader, fragShader);
}
function
draw() {
theShader.setUniform(
'u_resolution'
, [width, height]);
theShader.setUniform(
'u_time'
, frameCount*.01);
shader(theShader);
rect(0, 0, 400, 400);
}
let vertShader = `
attribute vec3 aPosition;
void main() {
vec4 positionVec4 = vec4(aPosition, 1.0);
positionVec4.xy = positionVec4.xy * 2.0 - 1.0;
gl_Position = positionVec4;
}`;
let fragShader = `
#ifdef GL_ES
precision mediump float;
#endif
uniform vec2 u_resolution;
uniform vec2 u_mouse;
uniform float u_time;
vec3 colorA = vec3(0.905,0.045,0.045);
vec3 colorB = vec3(0.995,0.705,0.051);
void main() {
vec2 st = gl_FragCoord.xy/u_resolution.xy;
float sinF = sin(u_time) * 0.5 + 0.5;
vec3 colorTop = mix(colorA, colorB, sinF);
vec3 colorBottom = mix(colorB, colorA, sinF);
vec3 pct = vec3(st.y);
vec3 color = vec3(0.0);
color = mix(colorTop, colorBottom, pct);
gl_FragColor = vec4(color,1);
}`;