Library GLU.js (https://github.com/rbeitra/GLU.js) simplifies the use of the WebGL API, defining the wrapper object GLU intended to encapsulate a canvas context, uniforms, shaders, programs, data buffers, textures, materials, models and frame buffer.
Support library GLUTIL.js provides a preview of the texture.
GLU.js
 
 
glu = new GLU.Context();
 
Creates an empty GLU-object designed to encapsulate the canvas context, uniforms, shader programs, buffers, textures, materials, models and frame buffer.
 
 
glu.initGL(canvas);
 
Initializes the GLU-object with the HTML-element canvas.
 
 
gl = glu.gl;
 
Returns the canvas-context.
 
 
gluUniform = glu.Uniform(uniformName, type, data, positions)
 
Defines the uniform:
 
uMVMatrix = glu.Uniform('uMVMatrix', 'Matrix4fv', {matrix: mvMatrix, transpose: false}, ['transpose', 'matrix']); uPMatrix = glu.Uniform('uPMatrix', 'Matrix4fv', {matrix: pMatrix, transpose: false}, ['transpose', 'matrix']);
 
gluUniform.bind(program)
 
Binds the uniform with the program.
 
 
 
gluShader = glu.Shader(id, shaderString, isVertex)
 
 
Defines the shader:
 
glushaderfs = glu.Shader('shader-fs');
glushadervs = glu.Shader('shader-vs');
 
gluProgram = glu.Program(shaders, attributes, uniforms)
 
Defines the program:
 
gluProgram = glu.Program(
                        [glu.Shader('shader-fs'), glu.Shader('shader-vs')]
                    );
gluProgram.bind()
 
Applies the methods gl.useProgram() and gl.enableVertexAttribArray().
 
 
gluProgram.unbind()
 
Applies the method gl.disableVertexAttribArray().
 
 
gluProgram.setupAttribute(attributeName)
 
Adds the vertex attribute to the program.
 
 
gluProgram.setupUniform(uniformName)
 
Adds the uniform to the program.
 
 
gluBuffer = glu.Buffer(mode, dataType, itemSize, drawMode)
 
Defines the buffer object's data store.
 
 
gluBuffer.bind()
 
For the canvas-context defines this buffer using the method gl.bindBuffer().
 
 
gluBuffer.unbind()
 
For the canvas-context defines the null buffer using the method gl.bindBuffer().
 
 
gluBuffer.setArray(array)
 
Defines the buffer data from the array of data using the methods gluBuffer.arrayToTypedArray(array, type) and gluBuffer.setData(data).
 
 
gluBuffer.setData(data)
 
Specifies the buffer data using the method gl.bufferData().
 
 
gluBuffer.arrayToTypedArray(array, type)
 
For the specified type of data return data:
 
gl.BYTE:
data = new Int8Array(array);
 
gl.UNSIGNED_BYTE:
data = new Uint8Array(array);
 
gl.SHORT:
data = new Int16Array(array);
 
gl.UNSIGNED_SHORT:
data = new Uint16Array(array);
 
gl.INT:
data = new Int32Array(array);
 
gl.UNSIGNED_INT:
data = new Uint32Array(array);
 
gl.FLOAT (по умолчанию):
data = new Float32Array(array);
 
 
gluBuffer.checkBuffer(buffer)
 
Applies the method gl.isBuffer(buffer).
 
 
gluTexture = glu.Texture()
 
Defines the empty texture using the method gl.createTexture().
 
 
gluTexture.bind()
 
For the canvas context defines this 2D-texture using the method gl.bindTexture().
 
 
gluTexture.unbind()
 
For the canvas context defines the null 2D-texture using the method gl.bindTexture().
 
 
gluTexture.setImage(image, makePowerOfTwo)
 
Defines the 2D texture image using the WebGL-method:
 
void texImage2D(GLenum target, GLint level, GLenum internalformat, GLenum format, GLenum type, ImageData? Pixels).
 
If the parameter makePowerOfTwo is not false, then the image is optimized so that the texture resolution has a power of two (128x128, 256x256, 512x512, 1024x1024, etc).
 
 
gluTexture.setFloatData(floatArray, width, height, format)
 
Defines the 2D texture image from the array of data using the WebGL-method:
 
void texImage2D(GLenum target, GLint level, GLenum internalformat, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, ArrayBufferView? Pixels).
 
 
gluTexture.setupRenderBuffer(width, height)
 
Applies the method:
 
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null).
 
 
gluTexture.setWrapClamp()
 
Defines the texture properties TEXTURE_WRAP_S and TEXTURE_WRAP_T as CLAMP_TO_EDGE.
 
 
gluTexture.setWrapRepeat()
 
Defines the texture properties TEXTURE_WRAP_S and TEXTURE_WRAP_T as REPEAT.
 
 
gluTexture.setFilterNearest()
 
Defines the texture properties TEXTURE_MAG_FILTER and TEXTURE_MIN_FILTER as NEAREST.
 
 
gluTexture.setFilterLinear()
 
Defines the texture properties TEXTURE_MAG_FILTER and TEXTURE_MIN_FILTER as LINEAR.
 
 
gluTexture.setFilterMipmap()
 
Defines the texture properties TEXTURE_MAG_FILTER and TEXTURE_MIN_FILTER as LINEAR.
 
 
gluTexture.createMipmapIfNeeded()
 
When the value of the parameter TEXTURE_MIN_FILTER is LINEAR_MIPMAP_LINEAR the method gl.generateMipmap(gl.TEXTURE_2D) is called.
 
 
gluTexture.loadImage(url, makePowerOfTwo, onComplete)
 
Defines the 2D texture image loading the image from the URL and then applying the method gluTexture.setImage(image, makePowerOfTwo). The function onComplete is called after calling the method setImage.
 
 
gluTexture.createPowerOfTwoImage(image)
 
The image is optimized so that the texture resolution has a power of two (128x128, 256x256, 512x512, 1024x1024, etc).
 
 
gluTexture.isPowerOfTwo(x)
 
Checks whether the size of the power of two rule.
 
 
gluTexture.nextHighestPowerOfTwo(x)
 
Scales the size to the size that matches the power of two rule.
 
 
 
gluMaterial = glu.Material(program, textures)
 
Defined the program, textures, blending mode and the type of the primitives.
 
 
gluMaterial.bind()
 
Applies the methods gl.useProgram(), gl.enableVertexAttribArray(), and gl.bindTexture().
 
 
gluMaterial.unbindTextures()
 
Applies the method gluTexture.unbind().
 
 
gluMaterial.getGLTextureSlot(id)
 
Returns the identifier of the texture on its index, for example gl.TEXTURE4.
 
 
gluMaterial.unbind()
 
Applies the methods gluMaterial.unbindTextures() and gluProgram.unbind().
 
 
gluMaterial.blendingDefault()
 
Calls the methods gl.enable(gl.BLEND), gl.enable(gl.DEPTH_TEST), gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE), gl.enable(gl.CULL_FACE), gl.cullFace(gl.BACK).
 
 
gluMaterial.blendingDoubleSided()
 
Calls the methods gl.enable(gl.BLEND), gl.enable(gl.DEPTH_TEST), gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE), gl.disable(gl.CULL_FACE).
 
 
gluMaterial.blendingParticles()
 
Calls the methods gl.enable(gl.BLEND), gl.disable(gl.DEPTH_TEST), gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE), gl.disable(gl.CULL_FACE).
 
 
gluMaterial.blendingNone()
 
Calls the methods gl.disable(gl.BLEND), gl.disable(gl.DEPTH_TEST), gl.disable(gl.CULL_FACE).
 
 
gluMaterial.setModeTriangles()
 
Sets the triangles as the primitives.
 
 
gluMaterial.setModeLines()
 
Sets the lines as the primitives.
 
 
gluMaterial.setModePoints()
 
Sets the points as the primitives.
 
 
gluGeometry = glu.Geometry(buffers)
 
Defines the buffers of indexes, vertices, textures, colors, and normals based on data sets. Defines the buffers for the cube, sphere, rectangle.
 
 
gluGeometry.makeRect(subH, subV, width, height, color, vertexName, texName, colorName, normalName)
 
Defines the buffers for the rectangle:
 
gluGeometry = glu.Geometry(); gluGeometry.makeRect(1, 1, 2, 2, {r: 1, g: 1, b: 0, a: 1}, 'aVertexPosition', 'aColor');
 
 
Defines the buffers for the sphere:
 
gluGeometry = glu.Geometry();
gluGeometry.makeSphere(32, 16, 0.5, {r: 1, g: 0, b: 1, a: 1}, 'aVertexPosition', 'aTextureCoord', 'aColor', 'aNormal');
 
 
gluGeometry.makeCube(width, height, depth, color, vertexName, texName, colorName, normalName)
 
Defines the buffers for the cube:
 
gluGeometry = glu.Geometry();
gluGeometry.makeCube(2, 2, 2, colors, 'aVertexPosition', 'aTextureCoord', 'aColor', 'aNormal');
 
 
gluGeometry.makeFromArrays(indexArray, vertexArray, vertexName, texArray, texName, colorArray, colorName, normalArray, normalName)
 
Defines the buffers of indexes, vertices, textures, colors, and normals based on data sets.
 
 
gluGeometry.mergePoints(precision, indexArray, vertexArray, texArray, colorArray, normalArray)
 
Merges the points with the specified precision.
 
 
gluObject = glu.Object(geometry, material, uniforms)
 
Encapsulates the geometry, material and uniforms, providing visualization of the graphic object.
 
 
gluObject.bind()
 
Applies the methods gluMaterial.bind(), gluBuffer.bind(), gluUniform.bind(program), and gl.vertexAttribPointer().
 
 
gluObject.unbind()
 
Applies the methods gluMaterial.unbind() and gluBuffer.unbind().
 
 
gluObject.updateUniform(uniform)
 
Applies the method gluUniform.bind(program).
 
 
gluObject.draw()
 
Visualizes the graphic object.
 
 
gluObject.drawNum(num)
 
Applies the method gl.drawElements(GLenum mode, GLsizei count, GLenum type, GLintptr offset).
 
 
gluFramebuffer = glu.Framebuffer()
 
Creates the frame buffer using the methods gl.createFramebuffer(), gl.bindFramebuffer(), gl.createRenderbuffer(), gl.bindRenderbuffer(), gluFramebuffer.checkRenderbuffer(renderbuffer), gluFramebuffer.checkFramebuffer(framebuffer), gluTexture.bind(), gl.framebufferTexture2D(), gl.framebufferRenderbuffer(), gl.bindRenderbuffer(), and gl.bindFramebuffer().
 
 
gluFramebuffer.bind()
 
For the canvas context defines this frame buffer using the method gl.bindFramebuffer().
 
 
gluFramebuffer.unbind()
 
For the canvas context defines the null frame buffer using the method gl.bindFramebuffer().
 
 
gluFramebuffer.setSize(width, height)
 
If the dimensions of the texture is not the same as specified applies the method gluTexture.setupRenderBuffer(width, height).
 
 
gluFramebuffer.checkRenderbuffer(renderbuffer)
 
Applies the method gl.isRenderbuffer(renderbuffer).
 
gluFramebuffer.checkFramebuffer(framebuffer)
 
Applies the methods gl.isFramebuffer(framebuffer) and gl.checkFramebufferStatus(gl.FRAMEBUFFER).
 
 
GLUTIL.js
 
 
GLUTILTexturePreview = GLUTIL.TexturePreview(gl, texture, width, height)
 
Provides the preview of the texture.
 
 
GLUTILTexturePreview.draw()
 
Visualizes the texture.

Our services

Our developments are at the forefront of high technologies

We design and develop web sites

Individual site design
Creating dynamic sites
Website layout and programming

We develop information systems

Automation of business processes for small and medium business
Collection, storage and processing of data
Using cloud technologies

We create mobile apps

Integration with a Web site
Creating mobile versions of web sites
Using Augmented Reality and Computer Vision

About us

NOV Tech Solutions specializes in developing services for operational management of business, creating web and mobile applications on order

NOV Tech Solutions is a team of highly qualified professionals working for the result

We work quickly and efficiently, using the most modern technologies

We appreciate and take care of our customers, constantly improving the service and expanding the list of services

Our partners

Contacts