## Documentation

- Overview
- Website
- Tutorials
- Class Index

## Classes

- _global_
- CL3D
- CL3D.AnimatedMeshSceneNode
- CL3D.Animator
- CL3D.AnimatorAnimateTexture
- CL3D.AnimatorCameraFPS
- CL3D.AnimatorCameraModelViewer
- CL3D.AnimatorCollisionResponse
- CL3D.AnimatorFlyCircle
- CL3D.AnimatorFlyStraight
- CL3D.AnimatorFollowPath
- CL3D.AnimatorOnClick
- CL3D.AnimatorOnProximity
- CL3D.AnimatorRotation
- CL3D.BillboardSceneNode
- CL3D.BoundingBoxTriangleSelector
- CL3D.Box3d
- CL3D.CameraSceneNode
- CL3D.ColorF
- CL3D.CopperCubeVariable
- CL3D.CopperLicht
- CL3D.CubeSceneNode
- CL3D.HotspotSceneNode
- CL3D.Light
- CL3D.LightSceneNode
- CL3D.Line3d
- CL3D.Material
- CL3D.Matrix4
- CL3D.Mesh
- CL3D.MeshBuffer
- CL3D.MeshSceneNode
- CL3D.MeshTriangleSelector
- CL3D.MetaTriangleSelector
- CL3D.Mobile2DInputSceneNode
- CL3D.OctTreeTriangleSelector
- CL3D.Overlay2DSceneNode
- CL3D.ParticleSystemSceneNode
- CL3D.PathSceneNode
- CL3D.Plane3d
- CL3D.Quaternion
- CL3D.Renderer
- CL3D.Scene
- CL3D.SceneNode
- CL3D.SkyBoxSceneNode
- CL3D.SoundSceneNode
- CL3D.TerrainSceneNode
- CL3D.Texture
- CL3D.TextureManager
- CL3D.Triangle3d
- CL3D.TriangleSelector
- CL3D.Vect2d
- CL3D.Vect3d
- CL3D.Vertex3D
- CL3D.WaterSurfaceSceneNode

CopperLicht API Documentation

# Class CL3D.Renderer

3D renderer, interface for drawing 3d geometry. You can access this using CopperLicht.getRenderer().

Class Overview
CL3D.Renderer(textureManager)
3D renderer, interface for drawing 3d geometry.

Parameters:
textureManager

Field Summary
Field Attributes | Field Name and Description
--- | ---
| OnChangeMaterial Event handler called after the renderer switches to a specific material, useful for shader programming.

Method Summary
Method Attributes | Method Name and Description
--- | ---
| addDynamicLight(l) Adds a new dynamic light to the rendering pipeline.
| addRenderTargetTexture(sx, sy, createFloatingPointTexture, createDepthTexture, registerInTextureManagerWithThisName) Creates a new render target Texture
| beginScene(clearColor) Starts the drawing process by clearing the whole scene.
| clearDynamicLights() Clears all dynamic lights in the rendering pipeline.
| clearZBuffer() Clears the z buffer
| createMaterialType(vertexShaderSource, fragmentShaderSource, blendenabled, blendsfactor, blenddfactor, functionShaderCallback) Creates a new CL3D.Material type with custom shaders.
| createTextureFrom2DCanvas(canvas, nonscaling) Creates a CL3D.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, sharp) Draws a 2d image
| draw2DRectangle(x, y, width, height, color, blend) Draws a 2d rectangle
| drawMesh(mesh, forceNoShadowMap) Draws a Mesh with the current world, view and projection matrix.
| drawMeshBuffer(buf, indexCountToUse) Draws a mesh buffer.
| enableShadowMap(enable, shadowMapTexture, shadowMapLightMatrix, shadowMapTexture2, shadowMapLightMatrix2) Enables / Disables rendering with shadow map support.
| endScene() Ends the drawing process by flushing the renderin instructions.
| getGLProgramFromMaterialType(mattype) Returns the webgl shader program from a material type.
| getHeight() Returns the current height of the rendering surface in pixels.
| getProjection() Returns the currently used projection matrix.
| getRenderTarget() Returns the current render target, usually a Texture texture or null
| getRenderTargetSize() Returns the size of the current render target, or screen size if no render target
| 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.
| isShadowMapEnabled()
| quicklyEnableShadowMap(enable) Quickly enables / Disables rendering with shadow map support without any state changes.
| setCullMode(mode) Sets cull mode
| setDirectionalLight(l) Sets the current dynamic directional light to the rendering pipeline.
| setInvertedDepthTest(enable) Sets if the depth test should be enabled or not.
| setMaterial(mat, forceNoShadowMap) Sets a material to activate for drawing 3d graphics.
| setProjection(m) Sets the projection transformation matrix.
| setRenderTarget(texture, clearBackBuffer, clearZBuffer, bgcolor) Sets the current render target
| setView(m) Sets the view transformation matrix.
| setWorld(m) Sets the world transformation matrix.
| updateTextureFrom2DCanvas(canvas, nonscaling, nonscaling) Fills an existing CL3D.Texture with the content of a from a 2d canvas

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:
    // note that createMaterialType() also accepts a shadercallback function as parameters
    // which you could use instead of this approach.
    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:
{CL3D.Light} l
  light data of the light to add

addRenderTargetTexture(sx, sy, createFloatingPointTexture, createDepthTexture, registerInTextureManagerWithThisName)
Creates a new render target Texture

Parameters:
sx
  width of the texture
sy
  height of the texture
createFloatingPointTexture
createDepthTexture
registerInTextureManagerWithThisName

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.

clearZBuffer()
Clears the z buffer

createMaterialType(vertexShaderSource, fragmentShaderSource, blendenabled, blendsfactor, blenddfactor, functionShaderCallback)
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 world transformation matrix into 'worldtransform', 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().
functionShaderCallback
  {function} an optional function which should be called when the material is being used. Can be used to set shader variables.

createTextureFrom2DCanvas(canvas, nonscaling)
Creates a CL3D.Texture from a 2d canvas

Parameters:
{Canvas} canvas
  a 2d canvas to be converted into a texture
{boolean} nonscaling
  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:
{CL3D.Texture} tex
  the texture to draw

draw2DImage(x, y, width, height, tex, blend, shaderToUse, srcRightX, srcBottomY, sharp)
Draws a 2d image

Parameters:
{Number} x
  x coordinate in pixels
{Number} y
  y coordinate in pixels
{Number} width
  width of the rectangle in pixels
{Number} height
  height of the rectangle in pixels
{CL3D.Texture} tex
  texture to draw
{Boolean} blend
  (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
sharp

draw2DRectangle(x, y, width, height, color, blend)
Draws a 2d rectangle

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, forceNoShadowMap)
Draws a Mesh with the current world, view and projection matrix.

Parameters:
{CL3D.Mesh} mesh
  the mesh to draw
forceNoShadowMap

drawMeshBuffer(buf, indexCountToUse)
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:
{CL3D.MeshBuffer} buf
  the mesh buffer to draw.
indexCountToUse

enableShadowMap(enable, shadowMapTexture, shadowMapLightMatrix, shadowMapTexture2, shadowMapLightMatrix2)
Enables / Disables rendering with shadow map support. If enabled, all materials drawn will Use the shadow map and the light matrix for rendering their geometry from a light.

Parameters:
enable
shadowMapTexture
shadowMapLightMatrix
shadowMapTexture2
shadowMapLightMatrix2

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.

getRenderTarget()
Returns the current render target, usually a Texture texture or null

getRenderTargetSize()
Returns the size of the current render target, or screen size if no render target

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.

isShadowMapEnabled()

quicklyEnableShadowMap(enable)
Quickly enables / Disables rendering with shadow map support without any state changes. If enabled, all materials drawn will Use the shadow map and the light matrix for rendering their geometry from a light.

Parameters:
enable

setCullMode(mode)
Sets cull mode

Parameters:
mode
  1:font, 2:back (default), 3:front_and_back

setDirectionalLight(l)
Sets the current dynamic directional light to the rendering pipeline. The renderer supports an unlimited amount of point lights and one directional light.

Parameters:
{CL3D.Light} l
  light data of the light to add

setInvertedDepthTest(enable)
Sets if the depth test should be enabled or not.

Parameters:
enable

setMaterial(mat, forceNoShadowMap)
Sets a material to activate for drawing 3d graphics. All 3d drawing functions will draw geometry using this material thereafter.

Parameters:
{CL3D.Material} mat
  Material to set
forceNoShadowMap

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:
{CL3D.Matrix4} m
  matrix representing the transformation matrix.

setRenderTarget(texture, clearBackBuffer, clearZBuffer, bgcolor)
Sets the current render target

Parameters:
{@link Texture} texture
  Texture or null, which will become the new render target
clearBackBuffer
  To clear the buffer or not
clearZBuffer
  To clear the zbuffer or not
bgcolor
  Background color to set if clearBackBuffer is true

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:
{CL3D.Matrix4} m
  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:
{CL3D.Matrix4} m
  matrix representing the transformation matrix.

updateTextureFrom2DCanvas(canvas, nonscaling, nonscaling)
Fills an existing CL3D.Texture with the content of a from a 2d canvas

Parameters:
{Canvas} canvas
  a 2d canvas to be converted into a texture
{boolean} nonscaling
  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.
nonscaling

© 2011-2018 N.Gebhardt, Ambiera
Documentation generated by JsDoc Toolkit