lhark/alchemist
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Passage de la multiplication MVC dans le nuanceur de sommets

Browse source
This commit is contained in:
lhark 2017-10-23 17:34:21 -04:00
parent ad4e27e444
commit 631753650d
2 changed files with 38 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
index.html
View file

@ -12,8 +12,9 @@
<script type="text/javascript" src="main.js"></script> <script type="text/javascript" src="main.js"></script>
<script id="nuanceurSommets" type="x-shader/x-vertex"> <script id="nuanceurSommets" type="x-shader/x-vertex">
uniform mat4 u_modelViewProjMatrix; uniform mat4 mmodel;
uniform mat4 u_normalMatrix; uniform mat4 mview;
uniform mat4 mproj;
uniform vec3 lightDir; uniform vec3 lightDir;
attribute vec4 vPosition; attribute vec4 vPosition;
@ -25,7 +26,7 @@
void main() void main()
{ {
// assigner la position du sommet // assigner la position du sommet
gl_Position = u_modelViewProjMatrix * vPosition; gl_Position = mproj * mview * mmodel * vPosition;
// assigner les coordonnées de texture // assigner les coordonnées de texture
v_color = vColor; v_color = vColor;

71
main.js
View file

@ -140,12 +140,11 @@ function TPinitialiser()
glob.incrRotX = 0.2; glob.incrRotY = 0.3; glob.incrRotZ = 0.4; glob.incrRotX = 0.2; glob.incrRotY = 0.3; glob.incrRotZ = 0.4;
// Créer les matrices nécessaires et assigner les assigner dans le programme // Créer les matrices nécessaires et assigner les assigner dans le programme
glob.modelViewMatrix = new J3DIMatrix4(); glob.modelMatrix = new J3DIMatrix4();
// glob.u_modelViewMatrixLoc n'est pas utile car modelViewMatrix n'est pas utilisé dans les nuanceurs glob.viewMatrix = new J3DIMatrix4();
glob.mvpMatrix = new J3DIMatrix4(); glob.modelMatLoc = gl.getUniformLocation( glob.program, "mmodel" );
glob.u_modelViewProjMatrixLoc = gl.getUniformLocation( glob.program, "u_modelViewProjMatrix" ); glob.viewMatLoc = gl.getUniformLocation( glob.program, "mview" );
glob.normalMatrix = new J3DIMatrix4(); glob.projMatLoc = gl.getUniformLocation( glob.program, "mproj" );
glob.u_normalMatrixLoc = gl.getUniformLocation( glob.program, "u_normalMatrix" );
// terminer l'initialisation // terminer l'initialisation
TPchargerTextures(); TPchargerTextures();
@ -166,35 +165,8 @@ function TPinitialiser()
return gl; return gl;
} }
function TPafficherModele( gl, num ) function TPafficherModele( gl )
{ {
// Incrémenter les angles de rotation
glob.angleRotX += glob.incrRotX; if ( glob.angleRotX >= 360.0 ) glob.angleRotX -= 360.0;
glob.angleRotY += glob.incrRotY; if ( glob.angleRotY >= 360.0 ) glob.angleRotY -= 360.0;
glob.angleRotZ += glob.incrRotZ; if ( glob.angleRotZ >= 360.0 ) glob.angleRotZ -= 360.0;
// Construire la matrice de modélisation
glob.modelViewMatrix.makeIdentity();
glob.modelViewMatrix.lookat( 0, 0, 7, 0, 0, 0, 0, 1, 0 );
var sens = ( num == 1 ) ? +1 : -1;
glob.modelViewMatrix.rotate( sens*glob.angleRotX, 1.0, 0.0, 0.0 );
glob.modelViewMatrix.rotate( sens*glob.angleRotY, 0.0, 1.0, 0.0 );
glob.modelViewMatrix.rotate( sens*glob.angleRotZ, 0.0, 0.0, 1.0 );
// Construire le produit de matrice "modélisation * projection" et la passer aux nuanceurs
glob.mvpMatrix.load( glob.perspectiveMatrix );
glob.mvpMatrix.multiply( glob.modelViewMatrix );
glob.mvpMatrix.setUniform( gl, glob.u_modelViewProjMatrixLoc, false );
// Construire la matrice de transformation des normales et la passer aux nuanceurs
glob.normalMatrix.load( glob.modelViewMatrix );
glob.normalMatrix.invert();
glob.normalMatrix.transpose();
glob.normalMatrix.setUniform( gl, glob.u_normalMatrixLoc, false );
// Activer la texture à utiliser
gl.bindTexture( gl.TEXTURE_2D, ( num == 1 ) ? glob.texture1 : glob.texture2 );
gl.uniform2f( gl.getUniformLocation( glob.program, "positionSouris" ), glob.positionSourisX, glob.canevas.height-glob.positionSourisY ); gl.uniform2f( gl.getUniformLocation( glob.program, "positionSouris" ), glob.positionSourisX, glob.canevas.height-glob.positionSourisY );
// Tracer le cube // Tracer le cube
@ -204,15 +176,40 @@ function TPafficherModele( gl, num )
function TPafficherScene(gl) function TPafficherScene(gl)
{ {
glob.perspectiveMatrix = new J3DIMatrix4(); glob.perspectiveMatrix = new J3DIMatrix4();
glob.perspectiveMatrix.perspective( 40, glob.canevas.width / glob.canevas.height, 1, 10 ); glob.perspectiveMatrix.perspective( 40, glob.canevas.width / glob.canevas.height, 0.01, 10 );
glob.perspectiveMatrix.setUniform(gl, glob.projMatLoc, false);
// Effacer le canevas // Effacer le canevas
gl.clear( gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT ); gl.clear( gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT );
// Définir la clôture 1 // Définir la clôture 1
gl.viewport( 0, 0, glob.canevas.width, glob.canevas.height ); gl.viewport( 0, 0, glob.canevas.width, glob.canevas.height );
// Tracer le modèle
TPafficherModele( gl, 1 ); // Incrémenter les angles de rotation
glob.angleRotX += glob.incrRotX; if ( glob.angleRotX >= 360.0 ) glob.angleRotX -= 360.0;
glob.angleRotY += glob.incrRotY; if ( glob.angleRotY >= 360.0 ) glob.angleRotY -= 360.0;
glob.angleRotZ += glob.incrRotZ; if ( glob.angleRotZ >= 360.0 ) glob.angleRotZ -= 360.0;
// Construire la matrice de modélisation
glob.viewMatrix.makeIdentity();
glob.viewMatrix.lookat( 0, 0, 5, 0, 0, 0, 0, 1, 0 );
glob.viewMatrix.setUniform(gl, glob.viewMatLoc, false);
glob.modelMatrix.makeIdentity();
glob.modelMatrix.setUniform(gl, glob.modelMatLoc, false);
TPafficherModele( gl );
glob.modelMatrix.rotate( glob.angleRotX, 1.0, 0.0, 0.0 );
glob.modelMatrix.setUniform(gl, glob.modelMatLoc, false);
TPafficherModele(gl);
glob.modelMatrix.rotate( glob.angleRotY, 0.0, 1.0, 0.0 );
glob.modelMatrix.setUniform(gl, glob.modelMatLoc, false);
TPafficherModele(gl);
glob.modelMatrix.rotate( glob.angleRotZ, 0.0, 0.0, 1.0 );
glob.modelMatrix.setUniform(gl, glob.modelMatLoc, false);
TPafficherModele( gl );
} }
var requestId; var requestId;