Allow size and offset to be set when constructing buffer

visgl · Feb 7, 2020 · ef5abbd · ef5abbd
1 parent c210cb3
commit ef5abbd
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 6 deletions.
diff --git a/modules/webgl/src/classes/buffer.js b/modules/webgl/src/classes/buffer.js
@@ -93,7 +93,7 @@ export default class Buffer extends Resource {
 
     // Set data: (re)initializes the buffer
     if (props.data) {
-      this._setData(props.data);
+      this._setData(props.data, props.offset, props.size);
     } else {
       this._setByteLength(props.byteLength || 0);
     }
@@ -294,21 +294,21 @@ export default class Buffer extends Resource {
   // PRIVATE METHODS
 
   // Allocate a new buffer and initialize to contents of typed array
-  _setData(data, usage = this.usage) {
+  _setData(data, offset = 0, size = data.byteLength + offset) {
     assert(ArrayBuffer.isView(data));
 
     this._trackDeallocatedMemory();
 
     const target = this._getTarget();
     this.gl.bindBuffer(target, this.handle);
-    this.gl.bufferData(target, data, usage);
+    this.gl.bufferData(target, size, this.usage);
+    this.gl.bufferSubData(target, offset, data);
     this.gl.bindBuffer(target, null);
 
-    this.usage = usage;
     this.debugData = data.slice(0, DEBUG_DATA_LENGTH);
-    this.bytesUsed = data.byteLength;
+    this.bytesUsed = size;
 
-    this._trackAllocatedMemory(data.byteLength);
+    this._trackAllocatedMemory(size);
 
     // infer GL type from supplied typed array
     const type = getGLTypeFromTypedArray(data);

diff --git a/modules/webgl/test/classes/buffer.spec.js b/modules/webgl/test/classes/buffer.spec.js
@@ -23,6 +23,43 @@ test('Buffer#constructor/delete', t => {
   t.end();
 });
 
+test('Buffer#constructor offset', t => {
+  const {gl2} = fixture;
+  if (!gl2) {
+    t.comment('WebGL2 not available, skipping tests');
+    t.end();
+    return;
+  }
+
+  const data = new Float32Array([1, 2, 3]);
+
+  let buffer = new Buffer(gl2, {data, offset: 8});
+  let receivedData = buffer.getData();
+  let expectedData = new Float32Array([0, 0, 1, 2, 3]);
+  t.deepEqual(receivedData, expectedData, 'Buffer constructor offsets data');
+
+  t.equal(buffer.byteLength, expectedData.byteLength, 'Buffer byteLength set properly');
+  t.equal(buffer.bytesUsed, expectedData.byteLength, 'Buffer byteLength set properly');
+
+  buffer = new Buffer(gl2, {data, size: data.byteLength + 12});
+  receivedData = buffer.getData();
+  expectedData = new Float32Array([1, 2, 3, 0, 0, 0]);
+  t.deepEqual(receivedData, expectedData, 'Buffer constructor sets buffer size');
+
+  t.equal(buffer.byteLength, expectedData.byteLength, 'Buffer byteLength set properly');
+  t.equal(buffer.bytesUsed, expectedData.byteLength, 'Buffer byteLength set properly');
+
+  buffer = new Buffer(gl2, {data, offset: 8, size: data.byteLength + 12});
+  receivedData = buffer.getData();
+  expectedData = new Float32Array([0, 0, 1, 2, 3, 0]);
+  t.deepEqual(receivedData, expectedData, 'Buffer constructor sets buffer size and offsets data');
+
+  t.equal(buffer.byteLength, expectedData.byteLength, 'Buffer byteLength set properly');
+  t.equal(buffer.bytesUsed, expectedData.byteLength, 'Buffer byteLength set properly');
+
+  t.end();
+});
+
 test('Buffer#bind/unbind', t => {
   const {gl} = fixture;