gl-util - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

attribute.js

@@ -5,9 +5,14 @@ 'use strict'
 const extend = require('object-assign');
+const getProgram = require('./program')
 
 
-let attributesCache = new WeakMap();
+let attributesCache = setAttribute.cache = new WeakMap();
 let attributesIdx = new WeakMap();
 
-module.exports = function setAttribute (gl, name, options) {
+module.exports = setAttribute;
+
+function setAttribute (gl, name, options, program) {
 	if (!gl) throw Error('WebGL context is not provided');
+	if (!program) program = getProgram(gl);
+	if (!program) throw Error('Context has no active program');
 
@@ -20,3 +25,3 @@ //object with attributes passed
 		for (let name in attributes) {
-			result[name] = setAttribute(gl, name, attributes[name]);
+			result[name] = setAttribute(gl, name, attributes[name], program);
 		}
@@ -28,7 +33,4 @@
 
-	let program = gl.getParameter(gl.CURRENT_PROGRAM);
-	if (!program) throw Error('Context has no active program');
+	let attributes = attributesCache.has(program) ? attributesCache.get(program) : attributesCache.set(program, {}).get(program);
 
-	let attributes = attributesCache.has(gl) ? attributesCache.get(gl) : attributesCache.set(gl, {}).get(gl);
-
 	//return all attribs if no name provided
@@ -133,6 +135,6 @@ if (!name) return attributes;
 	if (attribute.index == null) {
-		let topIndex = attributesIdx.get(gl) || 0;
+		let topIndex = attributesIdx.get(program) || 0;
 		attribute.index = topIndex++;
 		topIndex = Math.max(topIndex, attribute.index);
-		attributesIdx.set(gl, topIndex);
+		attributesIdx.set(program, topIndex);
 	}
@@ -139,0 +141,0 @@

package.json

 {
   "name": "gl-util",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "Set of practical webgl utils",
@@ -5,0 +5,0 @@ "main": "index.js",

program.js

 'use strict'
 
-module.exports = function setProgram (gl, vSrc, fSrc) {
+let programsCache = setProgram.programsCache = new WeakMap();
+
+module.exports = setProgram;
+
+
+function setProgram (gl, vSrc, fSrc) {
 	if (!gl) throw Error('WebGL context is not provided')
@@ -5,0 +10,0 @@

readme.md

@@ -11,11 +11,11 @@ # gl-util [![unstable](http://badges.github.io/stability-badges/dist/unstable.svg)](http://github.com/badges/stability-badges)
 
-Get/set current program or create new program from vertex and fragment sources.
+Get/set active program or create new program from vertex and fragment sources. The _WebGLProgram_ instance is returned.
 
-### `uniform(gl, name?, data?)`
-### `uniform(gl, {name: data, ...})`
+### `uniform(gl, name?, data?, program?)`
+### `uniform(gl, {name: data, ...}, program?)`
 
-Get/set uniform or multiple uniforms. Returns object with uniform parameters: `{name, location, data, type}`.
+Get/set uniform or multiple uniforms. Returns object with uniform parameters: `{name, location, data, type}`. Uniforms are stored per-program instance, so to make sure right program is active before updating uniforms a `program` can be passed as the last argument.
 
-### `texture(gl, name?, data|parameters?)`
-### `texture(gl, {name: data|parameters, ...})`
+### `texture(gl, name?, data|parameters?, program?)`
+### `texture(gl, {name: data|parameters, ...}, program?)`
 
@@ -26,3 +26,3 @@ Set texture[s] data or parameters:
 |---|---|
-| `data` | Data passed to texture. |
+| `data` | Data passed to texture. Can be array, typed array, image, canvas or string denoting the URL of image to load. |
 | `index` | Texture unit number, if undefined - calculated automatically. |
@@ -35,7 +35,8 @@ | `filter` | Sets texture scaling for both min and mag. Can be defined as two separate properties `minFilter` and `magFilter`. By default `gl.LINEAR`. |
 | `type` | `gl.UNSIGNED_BYTE`, can be `gl.FLOAT` with proper extension enabled |
+| `level` | `0`, mipmap level. |
 
-Returns object with texture properties `{data, index, minFilter, magFilter, wrapS, wrapT, width, height, format, type}`.
+Returns object with texture properties `{data, index, location, minFilter, magFilter, wrapS, wrapT, width, height, format, type}`.
 
-### `attribute(gl, name?, data|parameters?)`
-### `attribute(gl, {name: data|parameters, ...})`
+### `attribute(gl, name?, data|parameters?, program?)`
+### `attribute(gl, {name: data|parameters, ...}, program?)`
 
@@ -57,6 +58,4 @@ Set attribute[s] data or parameters:
 
-Returns attribute properties `{data, size, stride, offset, usage, type, normalized, index, target, buffer}`
+Returns attribute properties `{data, size, stride, offset, usage, type, normalized, index, target, buffer}`.
 
-Related docs: [vertexAttribPointer](https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/vertexAttribPointer).
-
 ## Motivation
@@ -63,0 +62,0 @@

test.js

@@ -7,3 +7,3 @@ const gl = require('webgl-context')()
 
-util.program(gl, `
+let p1 = util.program(gl, `
 	precision mediump float;
@@ -26,12 +26,61 @@
 
+let p2 = util.program(gl, `
+	precision mediump float;
 
-util.attribute(gl, 'position', {data: [0,0,1,0,0,1], size: 2});
+	attribute vec3 position;
+
+	void main() {
+		gl_Position = vec4(position * 2. - 1., 1.);
+	}
+`, `
+	precision mediump float;
+
+	uniform vec3 color;
+
+	void main () {
+		gl_FragColor = vec4(color, 1.);
+	}
+` )
+
+let p3 = util.program(gl, `
+	precision mediump float;
+
+	attribute vec2 position;
+
+	void main() {
+		gl_Position = vec4(position * 2. - 1., 0., 1.);
+	}
+`, `
+	precision mediump float;
+
+	uniform sampler2D color;
+	uniform vec4 viewport;
+
+	void main () {
+		vec2 coord = (gl_FragCoord.xy - viewport.xy) / viewport.zw;
+		gl_FragColor = texture2D(color, coord);
+	}
+`)
+
+
+util.program(gl, p1);
+util.attribute(gl, 'position', {data: [0,0,1,0,0,1]});
 util.uniform(gl, 'color', [1, .2, 0, 1.]);
 gl.drawArrays(gl.TRIANGLES, 0, 3);
 
+setTimeout(() => {
+	util.program(gl, p2);
+	util.attribute(gl, 'position', {data: [0,0,0,.5,0,0,0,.5,0]});
+	util.uniform(gl, 'color', [.8, .9, 0])
+	gl.drawArrays(gl.TRIANGLES, 0, 3);
 
-setTimeout(function () {
-	util.attribute(gl, 'position', {data: [0,0,.5,0,0,.5], size: 2});
-	util.uniform(gl, 'color', [1, .8, 0, 1.]);
-	gl.drawArrays(gl.TRIANGLES, 0, 3);
-}, 1000);
+	setTimeout(() => {
+		util.program(gl, p3);
+		util.attribute(gl, 'position', {data: [0,0,1,0,0,1]});
+		util.texture(gl, 'color', './texture.gif');
+		util.uniform(gl, 'viewport', [0,0,gl.drawingBufferWidth, gl.drawingBufferHeight]);
+		setTimeout(() => {
+			gl.drawArrays(gl.TRIANGLES, 0, 3);
+		}, 100)
+	}, 500)
+}, 500);

texture.js

@@ -5,10 +5,17 @@ 'use strict'
 const isPlainObject = require('is-plain-obj')
+const getProgram = require('./program')
 
-let texturesCache = new WeakMap();
+let texturesCache = setTexture.cache = new WeakMap();
 let texturesIdx = new WeakMap();
 
 
-module.exports = function setTexture (gl, name, options) {
+module.exports = setTexture;
+
+
+function setTexture (gl, name, options, program) {
 	if (!gl) throw Error('WebGL context is not provided');
 
+	if (!program) program = getProgram(gl);
+	if (!program) throw Error('Context has no active program');
+
 	//object with textures passed
@@ -20,3 +27,3 @@ if (name && typeof name != 'string') {
 		for (let name in textures) {
-			result[name] = setTexture(gl, name, textures[name]);
+			result[name] = setTexture(gl, name, textures[name], program);
 		}
@@ -27,7 +34,4 @@
 
-	let program = gl.getParameter(gl.CURRENT_PROGRAM);
-	if (!program) throw Error('Context has no active program');
+	let textures = texturesCache.has(program) ? texturesCache.get(program) : texturesCache.set(program, {}).get(program);
 
-	let textures = texturesCache.has(gl) ? texturesCache.get(gl) : texturesCache.set(gl, {}).get(gl);
-
 	//return all textures if no name provided
@@ -67,6 +71,6 @@ if (!name) return textures;
 	if (texture.index == null || options.index != null) {
-		let textureCount = texturesIdx.get(gl) || 0;
+		let textureCount = texturesIdx.get(program) || 0;
 		texture.index = options.index != null ? options.index : textureCount++;
 		textureCount = Math.max(textureCount, texture.index);
-		texturesIdx.set(gl, textureCount);
+		texturesIdx.set(program, textureCount);
 		texture.location && gl.uniform1i(texture.location, texture.index);
@@ -132,3 +136,3 @@ }
 			image.addEventListener('load', () => {
-				setTexture(gl, name, image)
+				setTexture(gl, name, image, program)
 			});
@@ -139,2 +143,4 @@ data = null;
 
+	if (texture.level == null) texture.level = 0;
+
 	//handle raw data case
@@ -153,3 +159,3 @@ if (data == null || Array.isArray(data) || ArrayBuffer.isView(data)) {
 
-		gl.texImage2D(gl.TEXTURE_2D, 0, texture.format, texture.width, texture.height, 0, texture.format, texture.type, texture.data);
+		gl.texImage2D(gl.TEXTURE_2D, texture.level, texture.format, texture.width, texture.height, 0, texture.format, texture.type, texture.data);
 	} else {
@@ -159,3 +165,3 @@ texture.width = data && data.width || 1;
 		texture.data = data;
-		gl.texImage2D(gl.TEXTURE_2D, 0, texture.format, texture.format, texture.type, texture.data);
+		gl.texImage2D(gl.TEXTURE_2D, texture.level, texture.format, texture.format, texture.type, texture.data);
 	}
@@ -162,0 +168,0 @@

uniform.js

@@ -8,9 +8,14 @@ /* @module gl-util/unifrom */
 const extend = require('object-assign');
+const getProgram = require('./program')
 
+let uniformsCache = setUniform.cache = new WeakMap();
 
-let uniformsCache = new WeakMap();
+module.exports = setUniform;
 
-module.exports = function setUniform (gl, name, options) {
+function setUniform (gl, name, options, program) {
 	if (!gl) throw Error('WebGL context is not provided');
 
+	if (!program) program = getProgram(gl);
+	if (!program) throw Error('Context has no active program');
+
 	//object with uniforms passed
@@ -22,3 +27,3 @@ if (name && typeof name != 'string') {
 		for (let name in uniforms) {
-			result[name] = setUniform(gl, name, uniforms[name]);
+			result[name] = setUniform(gl, name, uniforms[name], program);
 		}
@@ -29,7 +34,4 @@
 
-	let program = gl.getParameter(gl.CURRENT_PROGRAM);
-	if (!program) throw Error('Context has no active program');
+	let uniforms = uniformsCache.has(program) ? uniformsCache.get(program) : uniformsCache.set(program, {}).get(program);
 
-	let uniforms = uniformsCache.has(gl) ? uniformsCache.get(gl) : uniformsCache.set(gl, {}).get(gl);
-
 	//return all uniforms if no name provided
@@ -36,0 +38,0 @@ if (!name) return uniforms;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

81248

increased by287.8%

Number of package files

11

increased by10%

Lines of code

547

increased by9.62%

Worsened metrics

Number of lines in readme file

64

decreased by-1.54%

No dependency changes