For this assignment I wanted to try to make 3D figures using what we learned. I edited the code so that I can have diagonal lines, in doing that I made a trapezoid. I used 2 of the shapes to create each of the faces and overlayed another effect so that there is a red outline. I used a sin function to animate it and try to make it look like there is light circling the object but it did not seem to work.
// Function for trapezoid
float rect(vec2 st, vec2 size, vec2 loc,float skew, float stretch, vec2 wh){
float result = 1.0;
vec2 border = (1.0-size)/2.000;
result = step( border.x, mix (st.x,st.y,skew)+-loc.x);
result *= step( border.x, wh.x-mix (st.x,st.y,(skew))+loc.x);
result *= step( border.y, mix (st.x,st.y,stretch)+-loc.y);
result *= step( border.y, wh.y-mix (st.x,st.y,stretch)+loc.y);
return result;
}
void main() {
vec2 st = gl_FragCoord.xy/u_resolution.xy;
st.x *= u_resolution.x/u_resolution.y;
//Left cube face
//Variables
vec2 wH1= vec2(0.9,1.22); // Width and height varible to make the layers uniform
vec2 loc1= vec2 (-0.132,-0.204); //Location varible to make the layers uniform
//Colour mixing to get the right colour
vec3 colourA1 = vec3(0.554,1.000,0.673);
colourA1.r = rect(st, vec2 (0.472),loc1,0.,1.434, vec2(wH1));
colourA1.g = rect(st, vec2 (0.400),loc1,0.,1.434, vec2(wH1));
vec3 colourA2 = vec3(0.554,1.000,0.673);
colourA2.r = rect(st, vec2 (0.400),loc1,0.,1.434, vec2(wH1));
vec3 colourA = mix(colourA1,colourA2,0.460);
//Left cube face
//Variables
vec2 wH2= vec2(0.98,0.97);
vec2 loc2= vec2 (0.172,-0.052);
//Colour mixing to get the right colour
vec3 colourB1= vec3(0.767,0.785,0.595);
colourB1.r = rect(st, vec2 (0.448),vec2 (0.228,-0.044),0.,0.858, vec2(0.95,0.97));
colourB1.g = rect(st, vec2 (0.400),loc2,0.,0.858, vec2(wH2));
vec3 colourB2= vec3(0.990,0.985,0.995);
colourB2.r = rect(st, vec2 (0.400),loc2,0.,0.858, vec2(wH2));
vec3 colourB = mix(colourB1,colourB2,-0.172);
// mixing the faces and animation
float amt= sin((st.x+u_time)*(6.28*0.276)+0.5)*cos((st.x+u_time)*(6.28*0.276)+0.5);
vec3 colour= mix(colourA, colourB,amt);
result;
}