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

102 lines
3.7 KiB
HTML
Raw Normal View History

Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
Ajout de transformations, css bootstrap Les fichiers de resources ont été bougés dans leur dossiers propres (css, js, fonts). La position de la souris dans le canvas est maintenant correcte quelle que soit la position du canvas dans la page.
2017-12-10 04:53:20 +00:00
<title>Alchemist</title>
<link rel="stylesheet" href="css/tp.css" type="text/css" media="all">
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" media="all">
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
<script id="nuanceurSommets" type="x-shader/x-vertex">
Passage de la multiplication MVC dans le nuanceur de sommets
2017-10-23 21:34:21 +00:00
uniform mat4 mmodel;
uniform mat4 mview;
uniform mat4 mproj;
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
uniform vec3 lightDir;
attribute vec4 vPosition;
attribute vec4 vColor;
varying float v_NdotL;
varying vec4 v_color;
void main()
{
// assigner la position du sommet
Passage de la multiplication MVC dans le nuanceur de sommets
2017-10-23 21:34:21 +00:00
gl_Position = mproj * mview * mmodel * vPosition;
Ajout de transformations, css bootstrap Les fichiers de resources ont été bougés dans leur dossiers propres (css, js, fonts). La position de la souris dans le canvas est maintenant correcte quelle que soit la position du canvas dans la page.
2017-12-10 04:53:20 +00:00
//gl_Position = mmodel * mview * mproj * vPosition;
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
// assigner les coordonnées de texture
v_color = vColor;
}
</script>
<script id="nuanceurFragments" type="x-shader/x-fragment">
// informer du degré de précision qu'on veut dans les calculs
// (Plus à ce sujet: http://stackoverflow.com/questions/5366416/in-opengl-es-2-0-glsl-where-do-you-need-precision-specifiers/6336285#6336285 )
precision mediump float;
uniform sampler2D laTexture;
uniform vec2 positionSouris;
varying float v_NdotL;
varying vec4 v_color;
void main()
{
// obtenir la couleur de la texture
vec4 coul = v_color;
if ( length( positionSouris - gl_FragCoord.xy ) < 50.0 )
{
vec4 coulCercle = vec4( 1.0, 0.0, 0.0, 0.7 );
coul = coul * (1.0-coulCercle.a) + coulCercle * coulCercle.a;
// coul = coul * coulCercle; // réponse aussi acceptée
}
gl_FragColor = vec4( coul.rgb, coul.a );
}
</script>
</head>
<body onload="TPdebut()">
Ajout de transformations, css bootstrap Les fichiers de resources ont été bougés dans leur dossiers propres (css, js, fonts). La position de la souris dans le canvas est maintenant correcte quelle que soit la position du canvas dans la page.
2017-12-10 04:53:20 +00:00
<div class="container-fluid">
<div class="row">
<div class="col-md-5">
<table class="table" id="trans-list">
<thead>
<th class="text-center">T</th>
<th class="text-center">x</th>
<th class="text-center">y</th>
<th class="text-center">z</th>
<th class="text-center">𝜃(°)</th>
<th></th>
</thead>
<tbody>
</tbody>
</table>
<button type="button" class="btn btn-success btn-sm" onclick="addTransformation(this, 'rotation'); return false">
<span class="glyphicon glyphicon-repeat"></span> Rotation
</button>
<button type="button" class="btn btn-success btn-sm" onclick="addTransformation(this, 'translation'); return false">
<span class="glyphicon glyphicon-move"></span> Translation
</button>
<button type="button" class="btn btn-success btn-sm" onclick="addTransformation(this, 'scale'); return false">
<span class="glyphicon glyphicon-resize-small"></span> Échelle
</button>
</div>
<div class="col-md-7">
<canvas class="canevas" id="tp-canevas" height="600" width="900">
Si vous voyez ceci, votre navigateur ne supporte pas webgl.
</canvas>
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
Ajout de transformations, css bootstrap Les fichiers de resources ont été bougés dans leur dossiers propres (css, js, fonts). La position de la souris dans le canvas est maintenant correcte quelle que soit la position du canvas dans la page.
2017-12-10 04:53:20 +00:00
<div class="text">Les <a href="http://www.khronos.org/registry/webgl/specs/latest/1.0/">spécifications de Webgl</a> sont<br>remplies d'informations intéressantes.</div>
</div>
</div>
</div>
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
</body>
Ajout de transformations, css bootstrap Les fichiers de resources ont été bougés dans leur dossiers propres (css, js, fonts). La position de la souris dans le canvas est maintenant correcte quelle que soit la position du canvas dans la page.
2017-12-10 04:53:20 +00:00
<script type="text/javascript" src="js/webgl-utils.js"></script>
<script type="text/javascript" src="js/webgl-debug.js"></script>
<script type="text/javascript" src="js/J3DI.js"></script>
<script type="text/javascript" src="js/gl-matrix-min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
Commit initial. Import depuis webgl-tp6
2017-10-23 18:31:42 +00:00
</html>
Reference in a new issue Copy permalink