CopperLicht API Documentation
Class CL3D.Renderer
3D renderer, interface for drawing 3d geometry. You can access this using CopperLicht.getRenderer().
Field Attributes | Field Name and Description |
---|---|
Event handler called after the renderer switches to a specific material, useful for shader programming.
|
Method Attributes | Method Name and Description |
---|---|
Adds a new dynamic light to the rendering pipeline.
|
|
beginScene(clearColor)
Starts the drawing process by clearing the whole scene.
|
|
Clears all dynamic lights in the rendering pipeline.
|
|
createMaterialType(vertexShaderSource, fragmentShaderSource, blendenabled, blendsfactor, blenddfactor)
Creates a new CL3D.Material type with custom shaders.
|
|
createTextureFrom2DCanvas(canvas, nonscaling)
Creates a Texture from a 2d canvas
|
|
deleteTexture(tex)
Deletes a Texture, freeing a lot of memory
|
|
draw2DImage(x, y, width, height, tex, blend, shaderToUse, srcRightX, srcBottomY)
|
|
draw2DRectangle(x, y, width, height, color, blend)
|
|
drawMesh(mesh)
Draws a Mesh with the current world, view and projection matrix.
|
|
drawMeshBuffer(buf)
Draws a mesh buffer.
|
|
endScene()
Ends the drawing process by flushing the renderin instructions.
|
|
getGLProgramFromMaterialType(mattype)
Returns the webgl shader program from a material type.
|
|
Returns the current height of the rendering surface in pixels.
|
|
Returns the currently used projection matrix.
|
|
getView()
Returns the currently used view matrix.
|
|
getWebGL()
Returns access to the webgl interface.
|
|
getWidth()
Returns the current width of the rendering surface in pixels.
|
|
getWorld()
Returns the currently used view matrix.
|
|
setMaterial(mat)
Sets a material to activate for drawing 3d graphics.
|
|
Sets the projection transformation matrix.
|
|
setView(m)
Sets the view transformation matrix.
|
|
setWorld(m)
Sets the world transformation matrix.
|
Field Detail
OnChangeMaterial
Event handler called after the renderer switches to a specific material, useful for shader programming.
You can use this to set the variables and uniforms in a custom shader by using this callback.
The first parameter of the function is the material type id, which gets returned for example by createMaterialType().
var engine = startCopperLichtFromFile('3darea', 'test.ccbjs'); // [...] create a shader and material here using for example // var newMaterialType = engine.getRenderer(). // createMaterialType(vertex_shader_source, fragment_shader_source); // register callback function to set a variable in the new shader: engine.getRenderer().OnChangeMaterial = function(mattype) { var renderer = engine.getRenderer(); if (renderer && mattype == newMaterialType) { var gl = renderer.getWebGL(); // get variable location var program = renderer.getGLProgramFromMaterialType(newMaterialType); var variableLocation = gl.getUniformLocation(program, "test"); // set the content of the variable gl.uniform1f(location, 1.23); } };
Method Detail
addDynamicLight(l)
Adds a new dynamic light to the rendering pipeline.
- Parameters:
- l
- {CL3D.Light} light data of the light to add
beginScene(clearColor)
Starts the drawing process by clearing the whole scene. Is called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
- Parameters:
- clearColor
- {Number} Color for the background. See CL3D.createColor.
clearDynamicLights()
Clears all dynamic lights in the rendering pipeline. Is called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
createMaterialType(vertexShaderSource, fragmentShaderSource, blendenabled, blendsfactor, blenddfactor)
Creates a new CL3D.Material type with custom shaders. Returns an id which can be used in Material.Type.
There is a tutorial showing how to create a new CL3D.Material in the documentation, but also this short
example may give an overview:
// add a cube to test out var cubenode = new CubeSceneNode(); scene.getRootSceneNode().addChild(cubenode); cubenode.getMaterial(0).Tex1 = engine.getTextureManager().getTexture("crate_wood.jpg", true); // now, we want to use a custom material for our cube, lets write // a vertex and a fragment shader: // (note: there must be no character, even no space behind // the '\' characters). var vertex_shader = " \ uniform mat4 worldviewproj; \ attribute vec4 vPosition; \ attribute vec4 vNormal; \ attribute vec2 vTexCoord1; \ attribute vec2 vTexCoord2; \ varying vec2 v_texCoord1; \ varying vec2 v_texCoord2; \ void main() \ { \ gl_Position = worldviewproj * vPosition;\ v_texCoord1 = vTexCoord1.st; \ v_texCoord2 = vTexCoord2.st; \ }"; var fragment_shader = " \ uniform sampler2D texture1; \ uniform sampler2D texture2; \ \ varying vec2 v_texCoord1; \ varying vec2 v_texCoord2; \ \ void main() \ { \ vec2 texCoord = vec2(v_texCoord1.s, v_texCoord1.t); \ gl_FragColor = texture2D(texture1, texCoord) * 2; \ }"; // create a solid material using the shaders. For transparent materials, // take a look at the other parameters of createMaterialType var newMaterialType = engine.getRenderer().createMaterialType(vertex_shader, fragment_shader); if (newMaterialType != -1) cubenode.getMaterial(0).Type = newMaterialType; else alert('could not create shader');
- Parameters:
- vertexShaderSource
- {String} Source for the vertex shader of the new CL3D.Material. CopperLicht will set the current World-View-Projection matrix in an attribute named 'worldviewproj' (if existing), the normal transformation matrix in an attribute named 'normaltransform' if available, and the concatenated view model transformation into an attribute named 'modelviewtransform', if available. Positions will be stored in vPosition, normals in vNormal, the first texture coordinate in vTexCoord1 and the second in vTexCoord2. All other variables will need to be set manually by you. Use getGLProgramFromMaterialType to do this.
- fragmentShaderSource
- {String} Source for the fragment shader of the new CL3D.Material. If the fragment shader uses a variable 'texture1' and 'texture2' as in the example above, CopperLicht will set this to the textures of the current material.
- blendenabled
- {Boolean} this is optional and can be set to true to enable blending. See next two parameters. Note: When creating a transparent material, in order to let it be sorted correctly by CopperLicht, override the Material.isTransparent to return true for your material type.
- blendsfactor
- this is optional. Blend source factor, when blending is enabled. Set to a webGL blend factor like gl.ONE or gl.SRC_ALPHA. You can get the gl object by using getWebGL().
- blenddfactor
- this is optional. Blend destination factor, when blending is enabled. Set to a webGL blend factor like gl.ONE_MINUS_SRC_ALPHA or gl.ONE_MINUS_SRC_COLOR. You can get the gl object by using getWebGL().
createTextureFrom2DCanvas(canvas, nonscaling)
Creates a Texture from a 2d canvas
- Parameters:
- canvas
- {Canvas} a 2d canvas to be converted into a texture
- nonscaling
- {boolean} optional parameter, if set to true, and the texture don't have a power-of-two size, the texture will not be scaled up, but copied without scaling. This is useful for font or 2D textures, for example, to make them less blurry.
deleteTexture(tex)
Deletes a Texture, freeing a lot of memory
- Parameters:
- tex
- {Texture} the texture to draw
draw2DImage(x, y, width, height, tex, blend, shaderToUse, srcRightX, srcBottomY)
- Parameters:
- x
- {Number} x coordinate in pixels
- y
- {Number} y coordinate in pixels
- width
- {Number} width of the rectangle in pixels
- height
- {Number} height of the rectangle in pixels
- tex
- {Texture} texture to draw
- blend
- {Boolean} (optional) set to true to enable alpha blending (using the alpha component of the color) and false not to blend
- shaderToUse
- (optional) shader to be used or null if the default shader should be used. Set this to something returned by getGLProgramFromMaterialType() for example.
- srcRightX
- srcBottomY
draw2DRectangle(x, y, width, height, color, blend)
- Parameters:
- x
- {Number} x coordinate in pixels
- y
- {Number} y coordinate in pixels
- width
- {Number} width of the rectangle in pixels
- height
- {Number} height of the rectangle in pixels
- color
- {Number} color of the rectangle. See CL3D.createColor()
- blend
- {Boolean} (optional) set to true to enable alpha blending (using the alpha component of the color) and false not to blend
drawMesh(mesh)
Draws a Mesh with the current world, view and projection matrix.
- Parameters:
- mesh
- {Mesh} the mesh to draw
drawMeshBuffer(buf)
Draws a mesh buffer.
Note, you might want to set the material of the mesh buffer before drawing it, use setMaterial()
to do this before calling this function.
- Parameters:
- buf
- {MeshBuffer} the mesh buffer to draw.
endScene()
Ends the drawing process by flushing the renderin instructions. Is called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
{program}
getGLProgramFromMaterialType(mattype)
Returns the webgl shader program from a material type. This is useful when you are using createMaterialType to create your
own shaders and need to set material constants using for example uniform1i.
- Parameters:
- mattype
- {int} The material type, like for example Material.EMT_SOLID, or your own material type returned by createMaterialType.
- Returns:
- {program} Returns the WebGL shader program or null if not found.
getHeight()
Returns the current height of the rendering surface in pixels.
getProjection()
Returns the currently used projection matrix.
getView()
Returns the currently used view matrix.
getWebGL()
Returns access to the webgl interface. This should not be needed.
getWidth()
Returns the current width of the rendering surface in pixels.
getWorld()
Returns the currently used view matrix.
setMaterial(mat)
Sets a material to activate for drawing 3d graphics.
All 3d drawing functions will draw geometry using this material thereafter.
- Parameters:
- mat
- {Material} Material to set
setProjection(m)
Sets the projection transformation matrix. This is automatically called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
- Parameters:
- m
- {Matrix} matrix representing the transformation matrix.
setView(m)
Sets the view transformation matrix. This is automatically called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
- Parameters:
- m
- {Matrix} matrix representing the transformation matrix.
setWorld(m)
Sets the world transformation matrix. This is automatically called by CopperLicht.draw3dScene(),
so it shouldn't be necessary to call this yourself.
- Parameters:
- m
- {Matrix} matrix representing the transformation matrix.