scripts/renderer.js
author Eugen Sawin <sawine@me73.com>
Wed, 27 Apr 2011 13:35:56 +0200
changeset 29 99652d00489f
parent 28 9df7034275e8
child 30 95688249c40c
permissions -rw-r--r--
Fixed scene graph positioning bug.
     1 function Context(canvas)
     2 {
     3     this.canvas = canvas;
     4     try 
     5     {
     6 	this.gl = canvas.getContext("experimental-webgl");
     7 	this.viewport = {'width': canvas.width,
     8 			 'height': canvas.height};
     9     } 
    10     catch(e) 
    11     {
    12 	alert(e);
    13     }
    14     if (!this.gl) alert("Failed: WebGL init.");
    15     this.mvMatrix = mat4.create();
    16     this.pMatrix = mat4.create();
    17     this.shader = new Shader(this);  
    18 }
    19 Context.prototype.updateMatrixUniforms = function()
    20 {
    21     var gl = this.gl;
    22     var program = this.shader;
    23     var pMatrix = this.pMatrix;
    24     var mvMatrix = this.mvMatrix;
    25 
    26     gl.uniformMatrix4fv(program.pMatrixUniform, false, pMatrix);
    27     gl.uniformMatrix4fv(program.mvMatrixUniform, false, mvMatrix);
    28     var normalMatrix = mat3.create();
    29     mat4.toInverseMat3(mvMatrix, normalMatrix);
    30     mat3.transpose(normalMatrix);
    31     gl.uniformMatrix3fv(program.nMatrixUniform, false, normalMatrix);
    32 }
    33 Context.prototype.expand = function()
    34 { 
    35     var width = window.innerWidth;
    36     var height = window.innerHeight;
    37     this.canvas.width = width;
    38     this.canvas.height = height;
    39     this.viewport.width = width;
    40     this.viewport.height = height;
    41 }
    42 
    43 function Shader(context)
    44 {
    45     var gl = context.gl;
    46     var fragment = loadShader(gl, "fragment-shader");
    47     var vertex = loadShader(gl, "vertex-shader");
    48     this.program = gl.createProgram();
    49     gl.attachShader(this.program, vertex);
    50     gl.attachShader(this.program, fragment);
    51     gl.linkProgram(this.program);
    52 
    53     if (!gl.getProgramParameter(this.program, gl.LINK_STATUS))
    54     {
    55 	alert("Failed: Shader init.");
    56     }
    57 
    58     gl.useProgram(this.program);
    59     this.vertexPosition = gl.getAttribLocation(this.program, "aVertexPosition");
    60     gl.enableVertexAttribArray(this.vertexPosition);
    61 
    62     this.vertexNormal = gl.getAttribLocation(this.program, "aVertexNormal");
    63     gl.enableVertexAttribArray(this.vertexNormal);
    64     
    65     this.vertexColour = gl.getAttribLocation(this.program, "aVertexColour");
    66     gl.enableVertexAttribArray(this.vertexColour);    
    67 
    68     this.pMatrixUniform = gl.getUniformLocation(this.program, "uPMatrix");
    69     this.mvMatrixUniform = gl.getUniformLocation(this.program, "uMVMatrix");    
    70     this.nMatrixUniform = gl.getUniformLocation(this.program, "uNMatrix");
    71     //this.samplerUniform = gl.getUniformLocation(this.program, "uSampler");
    72     this.useLightingUniform = gl.getUniformLocation(this.program, "uUseLighting");
    73     this.ambientColourUniform = gl.getUniformLocation(this.program, "uAmbientColour");
    74     this.lightingDirectionUniform = gl.getUniformLocation(this.program, "uLightingDirection");
    75     this.directionalColourUniform = gl.getUniformLocation(this.program, "uDirectionalColour");
    76     
    77     function loadShader(gl, id)
    78     {
    79 	var script = document.getElementById(id);
    80 	if (!script) return null;
    81 	
    82 	var str = "";
    83 	var child = script.firstChild;
    84 	while (child)
    85 	{
    86 	    if (child.nodeType == 3) str += child.textContent;
    87 	    child = child.nextSibling;
    88 	}
    89 	
    90 	var shader;
    91 	var common = "x-shader/x-";
    92 	if (script.type == common + "fragment") shader = gl.createShader(gl.FRAGMENT_SHADER);
    93 	else if (script.type == common + "vertex") shader = gl.createShader(gl.VERTEX_SHADER);
    94 	else return null;
    95 
    96 	gl.shaderSource(shader, str);
    97 	gl.compileShader(shader);
    98 
    99 	if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS))
   100         {
   101 	    alert(gl.getShaderInfoLog(shader));
   102 	    return null;
   103 	}
   104 
   105 	return shader;
   106     }
   107 }
   108 
   109 function Renderer(camera, context)
   110 {
   111     this.camera = camera;
   112     this.context = context;
   113     this.gl = context.gl;
   114     this.matrixStack = [];
   115 }
   116 Renderer.prototype.update = function(scene)
   117 { 
   118     var gl = this.context.gl;
   119     var viewport = this.context.viewport;
   120     var mvMatrix = this.context.mvMatrix;
   121     var pMatrix = this.context.pMatrix;
   122     var camera = this.camera;
   123 
   124     gl.viewport(0, 0, viewport.width, viewport.height);
   125     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
   126     mat4.perspective(45, viewport.width / viewport.height, 0.1, 100.0, pMatrix);
   127 
   128     mat4.identity(mvMatrix);
   129     mat4.multiply(mvMatrix, camera.matrix); 
   130     
   131     this.draw(scene);
   132     if (this.next) this.next.update(scene);
   133 }
   134 Renderer.prototype.draw = function(node)
   135 {
   136     var gl = this.context.gl;
   137     var shader = this.context.shader;
   138     var mvMatrix = this.context.mvMatrix;
   139     var pMatrix = this.context.pMatrix;
   140    
   141     if (node)
   142     {
   143 	this.pushMatrix(mvMatrix);
   144 	mat4.translate(mvMatrix, node.pos);
   145 	//mat4.rotate(mvMatrix, node.rot);
   146 	//mat4.multiply(mvMatrix, node.matrix);
   147 	var object = node.geometry;
   148 	if (object)
   149 	{
   150 	    gl.bindBuffer(gl.ARRAY_BUFFER, object.positionBuffer);
   151 	    gl.vertexAttribPointer(shader.vertexPosition, object.positionBuffer.itemSize, gl.FLOAT, false, 0, 0);
   152     
   153 	    gl.bindBuffer(gl.ARRAY_BUFFER, object.normalBuffer);
   154 	    gl.vertexAttribPointer(shader.vertexNormal, object.normalBuffer.itemSize, gl.FLOAT, false, 0, 0);
   155 
   156 	    gl.bindBuffer(gl.ARRAY_BUFFER, object.colourBuffer);
   157 	    gl.vertexAttribPointer(shader.vertexColour, object.colourBuffer.itemSize, gl.FLOAT, false, 0, 0);
   158 
   159 	    var lighting = true;
   160 	    gl.uniform1i(shader.useLightingUniform, lighting);
   161    
   162 	    if (lighting)
   163 	    {   
   164 		var uni = 0.02;
   165 		var ambient = {"r": uni, "g": uni, "b": uni};
   166 		gl.uniform3f(shader.ambientColourUniform, ambient.r, ambient.g, ambient.b);
   167 
   168 		var lightingDir = vec3.create();
   169 		vec3.add(lightingDir, [0.5, -0.5, 0.0]);
   170 		vec3.normalize(lightingDir);
   171 		vec3.scale(lightingDir, -1);     
   172 		gl.uniform3fv(shader.lightingDirectionUniform, lightingDir);
   173 	
   174 		uni = 0.9;
   175 		var directional =  {"r": uni, "g": uni, "b": uni};
   176 		gl.uniform3f(shader.directionalColourUniform, directional.r, directional.g, directional.b);
   177 	    }
   178    
   179 	    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, object.indexBuffer);
   180 	    this.context.updateMatrixUniforms();
   181 	    gl.drawElements(gl.TRIANGLES, object.indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
   182 	    //gl.drawArrays(gl.TRIANGLE_STRIP, 0, scene.positionBuffer.numItems);
   183 	}
   184     
   185 	for (var id in node.children)
   186 	{
   187 	    this.mvMatrix = mvMatrix;
   188 	    this.draw(node.children[id]);
   189 	}
   190 	this.context.mvMatrix = this.popMatrix();
   191     }
   192 }
   193 Renderer.prototype.pushMatrix = function(matrix)
   194 {
   195     var copy = mat4.create();
   196     mat4.set(matrix, copy);
   197     this.matrixStack.push(copy);
   198 }
   199 Renderer.prototype.popMatrix = function()    
   200 {
   201     if (this.matrixStack.length > 0) return this.matrixStack.pop();
   202 }