Skip to content
Snippets Groups Projects
Commit ef65033e authored by housseme.chaibi's avatar housseme.chaibi
Browse files

lab3 modification

parent da1eb1f2
No related branches found
No related tags found
No related merge requests found
No preview for this file type
......@@ -7,8 +7,9 @@
<body onload="main()">
<input type="radio" name="myRadios" onclick="handleClick(this);" value="0" checked /> Directionnelle
<input type="radio" name="myRadios" onclick="handleClick(this);" value="0" /> Directionnelle
<input type="radio" name="myRadios" onclick="handleClick(this);" value="1" /> Ponctuelle <br/>
<input type="radio" name="myRadios" onclick="handleClick(this);" value="2" checked /> Directionnelle sans effect spectaculaire <br/>
<input type="checkbox" id="camx" name="camx" onclick="getCamera();"value="camx" />Cam X
<input type="checkbox" id="camy" name="camy"
......
......@@ -5,14 +5,54 @@ var VSHADER_SOURCE =
'attribute vec4 a_Color;\n' +
'attribute vec4 a_Normal;\n' +
'uniform mat4 u_MvpMatrix;\n' +
'uniform mat4 u_PlanMatrix;\n' +
'uniform mat4 u_NormalMatrix;\n' +
'uniform vec3 u_LightDirection;\n' +
'varying vec4 v_Color;\n' +
'void main() {\n' +
'vec3 to_light;\n' +
'vec3 vertex_normal;\n' +
'vec3 reflection;\n' +
'float cos_angle;\n' +
'vec3 specular_color;\n' +
'vec3 object_color;\n' +
' gl_Position = u_MvpMatrix * a_Position ;\n' +
' vec4 normal = u_NormalMatrix * a_Normal;\n' +
' float nDotL = max(dot(u_LightDirection, normalize(normal.xyz)), 0.0);\n' +
' vec3 lightDirection = normalize (vec3(u_LightDirection));\n' +
' vec3 normalref = normalize(vec3(u_NormalMatrix * a_Normal));\n' +
'reflection =2.0 * dot(normalref,lightDirection) * normalref - lightDirection;\n' +
'reflection=normalize(reflection);\n' +
'cos_angle=dot(reflection,lightDirection);\n' +
'cos_angle=clamp(cos_angle,0.0,1.0);\n' +
'if (cos_angle > 0.0) {\n' +
'specular_color=vec3(1.0,1.0,1.0) * cos_angle;\n' +
'} else {\n' +
'specular_color=vec3(0.0,0.0,0.0); }\n' +
' v_Color = vec4(a_Color.xyz * nDotL +specular_color , a_Color.a);\n' +
'}\n';
var VSHADER_D =
'attribute vec4 a_Position;\n' +
'attribute vec4 a_Color;\n' +
'attribute vec4 a_Normal;\n' +
'uniform mat4 u_MvpMatrix;\n' +
'uniform mat4 u_NormalMatrix;\n' +
'uniform vec3 u_LightDirection;\n' +
'varying vec4 v_Color;\n' +
'void main() {\n' +
' gl_Position = u_MvpMatrix * a_Position ;\n' +
' vec4 normal = u_NormalMatrix * a_Normal;\n' +
' float nDotL = max(dot(u_LightDirection, normalize(normal.xyz)), 0.0);\n' +
' vec3 lightDirection = normalize (vec3(u_LightDirection));\n' +
' vec3 normalref = normalize(vec3(u_NormalMatrix * a_Normal));\n' +
' v_Color = vec4(a_Color.xyz * nDotL, a_Color.a);\n' +
'}\n';
......@@ -57,21 +97,38 @@ var PONCTVERT =
'uniform vec3 u_AmbientLight;\n' + // Ambient light color
'varying vec4 v_Color;\n' +
'void main() {\n' +
'vec3 to_light;\n' +
'vec3 vertex_normal;\n' +
'vec3 reflection;\n' +
'float cos_angle;\n' +
'vec3 specular_color;\n' +
'vec3 object_color;\n' +
' gl_Position = u_MvpMatrix * a_Position;\n' +
// Recalculate the normal based on the model matrix and make its length 1.
' vec3 normal = normalize(vec3(u_NormalMatrix * a_Normal));\n' +
// Calculate world coordinate of vertex
' vec4 vertexPosition = u_ModelMatrix * a_Position;\n' +
// Calculate the light direction and make it 1.0 in length
' vec3 lightDirection = normalize(u_LightPosition - vec3(vertexPosition));\n' +
// Calculate the dot product of the normal and light direction
' float nDotL = max(dot(normal, lightDirection), 0.0);\n' +
// Calculate the color due to diffuse reflection
' vec3 diffuse = u_LightColor * a_Color.rgb * nDotL;\n' +
// Calculate the color due to ambient reflection
' vec3 ambient = u_AmbientLight * a_Color.rgb;\n' +
// Add the surface colors due to diffuse reflection and ambient reflection
' v_Color = vec4(diffuse + ambient, a_Color.a);\n' +
'reflection =2.0 * dot(normal,lightDirection) * normal - lightDirection;\n' +
'reflection=normalize(reflection);\n' +
'cos_angle=dot(reflection,lightDirection);\n' +
'cos_angle=clamp(cos_angle,0.0,1.0);\n' +
'if (cos_angle > 0.0) {\n' +
'specular_color=u_LightColor * cos_angle;\n' +
'diffuse=diffuse * (1.0 -cos_angle );\n' +
'} else {\n' +
'specular_color=vec3(0.0,0.0,0.0); }\n' +
' v_Color = vec4(diffuse + ambient + specular_color , a_Color.a);\n' +
'}\n';
// Fragment shader program
......@@ -79,27 +136,35 @@ var PONCFRAG =
'#ifdef GL_ES\n' +
'precision mediump float;\n' +
'#endif\n' +
'uniform vec3 u_Light_position;\n' +
'uniform vec3 u_Light_color;\n' +
'uniform float u_Shininess;\n' +
'varying vec3 v_Vertex;\n' +
'varying vec3 v_Normal;\n' +
'varying vec4 v_Color;\n' +
'void main() {\n' +
' gl_FragColor = v_Color;\n' +
'}\n';
var normalsBas = new Float32Array([ // Normal Bas
0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, // v0-v1-v2-v3 front
1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, // v0-v3-v4-v5 right
0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, // v0-v5-v6-v1 up
-1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, // v1-v6-v7-v2 left
0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, // v7-v4-v3-v2 down
0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0 // v4-v7-v6-v5 back
0.5, 0.2, 0.5, 0, 0.2, 0.5, -0.5, -1.0, 1.0, 1.0, -1.0, 1.0, //font
0.5, 0.2, 0.5, 1.0, -1.0, 1.0, 1.0, -1.0, -0.5, 0.5, 0.2, 0, //right
0.5, 0.2, 0.5, 0.5, 0.2, 0, 0, 0.2, 0, 0, 0.2, 0.5, //up
-0.5, 0.2, 0.5, -1, 0.2, 0, -1, -1.0, -0.5, -0.5, -1.0, 1.0, //left
-0.5, -1.0, -1, 1.0, -1.0, -0.5, 1.0, -1.0, 1.0, -0.5, -1.0, 1.0, //down
1.0, -1.0, -0.5, -0.5, -0.5, -0.5, 0, 0.1, -1.0, 0.5, 0.2, -1.0 //back
]);
var normalsHaut = new Float32Array([ // Normal Haut
0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, // v0-v1-v2-v3 front
-1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, // v0-v3-v4-v5 right
0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, // v0-v5-v6-v1 up
1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, // v1-v6-v7-v2 left
0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, // v7-v4-v3-v2 down
0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0 // v4-v7-v6-v5 back
0.5, 0.2, 0.5, 0, 0.2, 0.5, -0.5, -1.0, 1.0, 1.0, -1.0, 1.0, //font
0.5, 0.2, 0.5, 1.0, -1.0, 1.0, 1.0, -1.0, -0.5, 0.5, 0.2, 0, //right
-0.5, -1.0, -1, 1.0, -1.0, -0.5, 1.0, -1.0, 1.0, -0.5, -1.0, 1.0, //down
-0.5, 0.2, 0.5, -1, 0.2, 0, -1, -1.0, -0.5, -0.5, -1.0, 1.0, //left
0.5, 0.2, 0.5, 0.5, 0.2, 0, 0, 0.2, 0, 0, 0.2, 0.5, //up
1.0, -1.0, -0.5, -0.5, -0.5, -0.5, 0, 0.1, -1.0, 0.5, 0.2, -1.0 //back
]);
// Retrieve <canvas> element
......@@ -110,7 +175,7 @@ var camZ = 0;
var lumPosX = 0;
var lumPosY = 0;
var lumPosZ = 1;
var mode = 0;
var mode = 2;
function main() {
handleClick;
draw();
......@@ -118,8 +183,11 @@ function main() {
}
function draw() {
// Get the rendering context for WebGL
var gl = getWebGLContext(canvas);
if (!gl) {
......@@ -137,6 +205,7 @@ function draw() {
return;
}
// dicrectionnelle
var sabProgram = createProgram(gl, VSHADER_SOURCE, FSHADER_SOURCE);
sabProgram.a_Position = gl.getAttribLocation(sabProgram, 'a_Position');
sabProgram.a_Color = gl.getAttribLocation(sabProgram, 'a_Color');
......@@ -145,6 +214,15 @@ function draw() {
sabProgram.u_LightDirection = gl.getUniformLocation(sabProgram, 'u_LightDirection');
// directionnelle sans effect spectaculaire
var sabSanSpect = createProgram(gl, VSHADER_D, FSHADER_SOURCE);
sabSanSpect.a_Position = gl.getAttribLocation(sabSanSpect, 'a_Position');
sabSanSpect.a_Color = gl.getAttribLocation(sabSanSpect, 'a_Color');
sabSanSpect.u_MvpMatrix = gl.getUniformLocation(sabSanSpect, 'u_MvpMatrix');
sabSanSpect.u_NormalMatrix = gl.getUniformLocation(sabSanSpect, 'u_NormalMatrix');
sabSanSpect.u_LightDirection = gl.getUniformLocation(sabSanSpect, 'u_LightDirection');
// POINCTUEL
var poncProgram = createProgram(gl, PONCTVERT, PONCFRAG);
poncProgram.a_Position = gl.getAttribLocation(poncProgram, 'a_Position');
......@@ -176,16 +254,21 @@ function draw() {
if (mode == 1) {
prog = poncProgram
gl.useProgram(poncProgram);
gl.uniform3f(poncProgram.u_LightColor, 1, 1, 1);
gl.uniform3f(poncProgram.u_LightColor, 1.0, 1.0, 1.0);
gl.uniform3fv(poncProgram.u_LightPosition, lightDirection.elements);
gl.uniform3f(poncProgram.u_AmbientLight, 0.2, 0.2, 0.2);
gl.uniform3f(poncProgram.u_AmbientLight, 0.5, 0.5, 0.5);
}
else {
else if (mode == 0) {
prog = sabProgram;
gl.useProgram(sabProgram);
gl.uniform3fv(sabProgram.u_LightDirection, lightDirection.elements);
}
else if (mode == 2) {
prog = sabSanSpect;
gl.useProgram(sabSanSpect);
gl.uniform3fv(sabSanSpect.u_LightDirection, lightDirection.elements);
}
getCamera()
......@@ -203,7 +286,7 @@ function draw() {
gl.useProgram(prog);
var n = initVertexBuffers(gl, normalsBas, prog);
model.setPerspective(50, 1, 1, 100);
model.lookAt(3, 3, 7, 0, 0, 0, 0, 1, 0);
model.lookAt(0, 0, 7, 0, 0, 0, 0, 1, 0);
mvpMatrix.set(model);
angle = animate(angle);
......@@ -217,30 +300,22 @@ function draw() {
gl.drawElements(gl.TRIANGLES, n, gl.UNSIGNED_BYTE, 0);
//pyramide bas
lightDirection = new Vector3([-lumPosX, lumPosY, lumPosZ]);
lightDirection.normalize();
if (mode == 1) {
gl.useProgram(poncProgram);
gl.uniform3fv(prog.u_LightPosition, lightDirection.elements);
}
else {
gl.useProgram(sabProgram);
gl.uniform3fv(prog.u_LightDirection, lightDirection.elements);
}
//pyramide haut
if (camX == 1 || camY == 1 || camZ == 1)
rotMatrixHaut.setRotate(angle, camX, camY, camZ);
rotateMatrix.setRotate(180, 1, 0, 0);
tranMatrix.setTranslate(0, 0.4, 0.5);
tranMatrix.setTranslate(0, 0.4, 0.5); //(0, 0.4, 0.5);
initVertexBuffers(gl, normalsHaut, prog);
mvpMatrix.setPerspective(50, 1, 1, 100);
mvpMatrix.lookAt(3, 3, 7, 0, 0, 0, 0, 1, 0);
mvpMatrix.lookAt(0, 0, 7, 0, 0, 0, 0, 1, 0);
mvpMatrix.multiply(rotMatrixHaut).multiply(tranMatrix).multiply(rotateMatrix);
normalMatrix.setInverseOf(rotMatrixHaut);
normalMatrix.multiply(rotateMatrix);
//normalMatrix.setInverseOf(rotMatrixHaut);
normalMatrix.multiply(tranMatrix).multiply(rotateMatrix);
normalMatrix.transpose();
initVertexBuffers(gl, normalsHaut, prog);
gl.uniformMatrix4fv(prog.u_MvpMatrix, false, mvpMatrix.elements);
gl.uniformMatrix4fv(prog.u_NormalMatrix, false, normalMatrix.elements);
gl.drawElements(gl.TRIANGLES, n, gl.UNSIGNED_BYTE, 0);
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment