Loading the Game Scene - WebGL Game Development - page 101

iDiffuse+=uPositionalColor2 *materialDiffuseColor *
directionalLightWeighting2;
if(directionalLightWeighting>0.0)
{
vec3 halfDir = normalize(-lightDirection + eyeVector);
float specAngle = max(dot(halfDir, normal), 0.0);
specular = pow(specAngle, 4.0);
iSpecular+=uSpecularColor*materialSpecularColor*specular;
}
vec3 iColor =iAmbient+ iDiffuse+iSpecular;
gl_FragColor = vec4(iColor, 1.0);
}
</script>
Understanding the main code
We changed our initShaders function to get the reference of the new uniform
variables. We then added this function to our shaders ( diffuseColor and
position of lights):
function initShaders() {
......................
shaderProgram.uLightPositionLamp1 =
gl.getUniformLocation(shaderProgram, "uLightPositionLamp1");
shaderProgram.uPositionalColor1 =
gl.getUniformLocation(shaderProgram, "uPositionalColor1");
shaderProgram.uLightPositionLamp2 =
gl.getUniformLocation(shaderProgram, "uLightPositionLamp2");
shaderProgram.uPositionalColor2 =
gl.getUniformLocation(shaderProgram, "uPositionalColor2");
................................
}
Function setLightUniform sets the values of position and diffuse color
of the lights that we have added to our shaders.
function setLightUniform(){
....................
var lightingPosition = [20.00,5.00,200.00];
gl.uniform3fv(shaderProgram.uLightPositionLamp1,
lightingPosition);
gl.uniform3f(shaderProgram.uPositionalColor1,
lightColor[0],lightColor[1],lightColor[2]);
var lightingPosition1 = [20.00,5.00,-100.0];
gl.uniform3fv(shaderProgram.uLightPositionLamp2,
lightingPosition1);
gl.uniform3f(shaderProgram.uPositionalColor2,1.0,1.0,1.0);
}