51 lines
1.2 KiB
HTML
51 lines
1.2 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
<html>
|
|||
|
<head>
|
|||
|
<meta charset="utf-8"/>
|
|||
|
<title>WebGL Example</title>
|
|||
|
|
|||
|
<script id="vertex-shader" type="x-shader/x-vertex">#version 300 es
|
|||
|
|
|||
|
in vec4 vPosition;
|
|||
|
in vec3 vNormal;
|
|||
|
|
|||
|
// TODO Nehme die Projektionsmatrix entgegen
|
|||
|
uniform mat4 projMatrix;
|
|||
|
|
|||
|
uniform mat4 modelMatrix;
|
|||
|
uniform mat4 viewMatrix;
|
|||
|
|
|||
|
out vec4 vfColor;
|
|||
|
|
|||
|
void main()
|
|||
|
{
|
|||
|
// TODO bestimme mit der Projektionsmatrix die Vertexposition
|
|||
|
gl_Position = projMatrix * viewMatrix * modelMatrix * vPosition;
|
|||
|
}
|
|||
|
</script>
|
|||
|
<script id="fragment-shader" type="x-shader/x-fragment">#version 300 es
|
|||
|
precision mediump float;
|
|||
|
|
|||
|
in vec4 vfColor;
|
|||
|
out vec4 fColor;
|
|||
|
|
|||
|
void main()
|
|||
|
{
|
|||
|
fColor = vfColor;
|
|||
|
}
|
|||
|
</script>
|
|||
|
<script type="text/javascript" src="common/initShaders.js"></script>
|
|||
|
<script type="text/javascript" src="common/gl-matrix.js"></script>
|
|||
|
<script type="text/javascript" src="common/objects3D.js"></script>
|
|||
|
</head>
|
|||
|
<body>
|
|||
|
<h1>Lorem Ipsum</h1>
|
|||
|
|
|||
|
<canvas id="gl-canvas" width="1024" height="512">
|
|||
|
If you see this, your browser doesn't support WebGL.
|
|||
|
</canvas>
|
|||
|
|
|||
|
<script src="main.js" type="text/javascript"></script>
|
|||
|
</body>
|
|||
|
</html>
|