Updated loaders and examples to new BufferAttribute pattern.

examples/index.html

@@ -169,6 +169,7 @@
 				"webgl_lines_sphere",
 				"webgl_lines_splines",
 				"webgl_loader_assimp2json",
+				"webgl_loader_awd",
 				"webgl_loader_collada",
 				"webgl_loader_collada_keyframe",
 				"webgl_loader_collada_skinning",

examples/js/loaders/AWDLoader.js

@@ -735,7 +735,7 @@ THREE.AWDLoader = (function (){
         // ------------------
         if ( str_type === 1 ) {
 
-          attrib = new THREE.Float32Attribute( str_len/12, 3 );
+          attrib = new THREE.Float32Attribute( ( str_len / 12 ) * 3, 3 );
           buffer = attrib.array;
 
           geom.addAttribute( 'position', attrib );
@@ -754,7 +754,7 @@ THREE.AWDLoader = (function (){
         // -----------------
         else if (str_type === 2) {
 
-          attrib = new THREE.Uint16Attribute( str_len/2, 1 );
+          attrib = new THREE.Uint16Attribute( ( str_len / 2 ), 1 );
           geom.addAttribute( 'index', attrib );
 
           geom.offsets.push({
@@ -778,7 +778,7 @@ THREE.AWDLoader = (function (){
         // -------------------
         else if (str_type === 3) {
 
-          attrib = new THREE.Float32Attribute( str_len/8, 2 );
+          attrib = new THREE.Float32Attribute( ( str_len / 8 ) * 2, 2 );
           buffer = attrib.array;
 
           geom.addAttribute( 'uv', attrib );
@@ -794,7 +794,7 @@ THREE.AWDLoader = (function (){
         // NORMALS
         else if (str_type === 4) {
 
-          attrib = new THREE.Float32Attribute( str_len/12, 3 );
+          attrib = new THREE.Float32Attribute( ( str_len / 12 ) * 3, 3 );
           geom.addAttribute( 'normal', attrib );
           buffer = attrib.array
           idx = 0

examples/js/loaders/UTF8Loader.js

@@ -28,19 +28,15 @@ THREE.UTF8Loader.prototype.load = function ( jsonUrl, callback, options ) {
 THREE.UTF8Loader.BufferGeometryCreator = function () {
 };
 
-THREE.UTF8Loader.BufferGeometryCreator.prototype.create = function ( attribArray, indexArray ) {
+THREE.UTF8Loader.BufferGeometryCreator.prototype.create = function ( attribArray, indices ) {
 
-	var ntris = indexArray.length / 3;
+	var ntris = indices.length / 3;
 
 	var geometry = new THREE.BufferGeometry();
 
-    var positions = new THREE.Float32Attribute( ntris * 3, 3 );
-    var normals = new THREE.Float32Attribute( ntris * 3, 3 );
-    var uvs = new THREE.Float32Attribute( ntris * 3, 2 );
-
-	var positionsArray = positions.array;
-	var normalsArray = normals.array;
-	var uvsArray = uvs.array;
+	var positions = new Float32Array( ntris * 3 * 3 );
+	var normals = new Float32Array( ntris * 3 * 3 );
+	var uvs = new Float32Array( ntris * 3 * 2 );
 
 	var i, j, offset;
 	var x, y, z;
@@ -60,9 +56,9 @@ THREE.UTF8Loader.BufferGeometryCreator.prototype.create = function ( attribArray
 		y = attribArray[ i + 1 ];
 		z = attribArray[ i + 2 ];
 
-		positionsArray[ j++ ] = x;
-		positionsArray[ j++ ] = y;
-		positionsArray[ j++ ] = z;
+		positions[ j++ ] = x;
+		positions[ j++ ] = y;
+		positions[ j++ ] = z;
 
 	}
 
@@ -76,8 +72,8 @@ THREE.UTF8Loader.BufferGeometryCreator.prototype.create = function ( attribArray
 		u = attribArray[ i ];
 		v = attribArray[ i + 1 ];
 
-		uvsArray[ j++ ] = u;
-		uvsArray[ j++ ] = v;
+		uvs[ j++ ] = u;
+		uvs[ j++ ] = v;
 
 	}
 
@@ -92,18 +88,18 @@ THREE.UTF8Loader.BufferGeometryCreator.prototype.create = function ( attribArray
 		y = attribArray[ i + 1 ];
 		z = attribArray[ i + 2 ];
 
-		normalsArray[ j++ ] = x;
-		normalsArray[ j++ ] = y;
-		normalsArray[ j++ ] = z;
+		normals[ j++ ] = x;
+		normals[ j++ ] = y;
+		normals[ j++ ] = z;
 
 	}
 
-    geometry.addAttribute( 'index', indexArray, 1 );
-    geometry.addAttribute( 'position', positions );
-    geometry.addAttribute( 'normal', normals );
-    geometry.addAttribute( 'uv', uvs );
+    geometry.addAttribute( 'index', new THREE.Uint32Attribute( indices, 1 ) );
+    geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+    geometry.addAttribute( 'normal', new THREE.Float32Attribute( normals, 3 ) );
+    geometry.addAttribute( 'uv', new THREE.Float32Attribute( uvs, 2 ) );
 
-    geometry.offsets.push( { start: 0, count: indexArray.length, index: 0 } );
+    geometry.offsets.push( { start: 0, count: indices.length, index: 0 } );
 
 	geometry.computeBoundingSphere();
 

examples/js/loaders/ctm/CTMLoader.js

@@ -211,17 +211,17 @@ THREE.CTMLoader.prototype.createModel = function ( file, callback ) {
 			colors = file.body.attrMaps[ 0 ].attr;
 		}
 
-		this.addAttribute( 'index', new THREE.Uint32Attribute( indices.length, 1 ).set( indices ) );
-		this.addAttribute( 'position', new THREE.Float32Attribute( positions.length, 3 ).set( positions ) );
+		this.addAttribute( 'index', new THREE.Uint32Attribute( indices, 1 ) );
+		this.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
 
 		if ( normals !== undefined ) 
-			this.addAttribute( 'normal', new THREE.Float32Attribute( normals.length, 3 ).set( normals ) );
+			this.addAttribute( 'normal', new THREE.Float32Attribute( normals, 3 ) );
 
 		if ( uvs !== undefined ) 
-			this.addAttribute( 'uv', new THREE.Float32Attribute( uvs.length, 2 ).set( uvs ) );
+			this.addAttribute( 'uv', new THREE.Float32Attribute( uvs, 2 ) );
 
 		if ( colors !== undefined ) 
-			this.addAttribute( 'color', new THREE.Float32Attribute( colors.length, 4 ).set( colors ) );
+			this.addAttribute( 'color', new THREE.Float32Attribute( colors, 4 ) );
 
 	}
 

examples/webgl_buffergeometry.html

@@ -82,11 +82,6 @@
 
 				var geometry = new THREE.BufferGeometry();
 
-				geometry.addAttribute( 'index', new Uint16Array( triangles * 3 ), 1 );
-				geometry.addAttribute( 'position', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'normal', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( triangles * 3 * 3 ), 3 );
-
 				// break geometry into
 				// chunks of 21,845 triangles (3 unique vertices per triangle)
 				// for indices to fit into 16 bit integer number
@@ -94,7 +89,7 @@
 
 				var chunkSize = 21845;
 
-				var indices = geometry.getAttribute( 'index' ).array;
+				var indices = new Uint16Array( triangles * 3 );
 
 				for ( var i = 0; i < indices.length; i ++ ) {
 
@@ -102,9 +97,9 @@
 
 				}
 
-				var positions = geometry.getAttribute( 'position' ).array;
-				var normals = geometry.getAttribute( 'normal' ).array;
-				var colors = geometry.getAttribute( 'color' ).array;
+				var positions = new Float32Array( triangles * 3 * 3 );
+				var normals = new Float32Array( triangles * 3 * 3 );
+				var colors = new Float32Array( triangles * 3 * 3 );
 
 				var color = new THREE.Color();
 
@@ -200,6 +195,11 @@
 
 				}
 
+				geometry.addAttribute( 'index', new THREE.Uint16Attribute( indices, 1 ) );
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'normal', new THREE.Float32Attribute( normals, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
+
 				var offsets = triangles / chunkSize;
 
 				for ( var i = 0; i < offsets; i ++ ) {

examples/webgl_buffergeometry_custom_attributes_particles.html

@@ -137,17 +137,9 @@
 
 			geometry = new THREE.BufferGeometry();
 
-			geometry.addAttribute( 'position', new Float32Array( particles * 3 ), 3 );
-			geometry.addAttribute( 'customColor', new Float32Array( particles * 3 ), 3 );
-			geometry.addAttribute( 'size', new Float32Array( particles ), 1 );
-
-			var positions = geometry.getAttribute( 'position' ).array;
-			var values_color = geometry.getAttribute( 'customColor' ).array;
-			values_size = geometry.getAttribute( 'size' ).array;
-
-			sphere = new THREE.ParticleSystem( geometry, shaderMaterial );
-
-			// sphere.sortParticles = true;
+			var positions = new Float32Array( particles * 3 );
+			var values_color = new Float32Array( particles * 3 );
+			values_size = new Float32Array( particles );
 
 			var color = new THREE.Color( 0xffaa00 );;
 
@@ -170,6 +162,14 @@
 
 			}
 
+			geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+			geometry.addAttribute( 'customColor', new THREE.Float32Attribute( values_color, 3 ) );
+			geometry.addAttribute( 'size', new THREE.Float32Attribute( values_size, 1 ) );
+
+			sphere = new THREE.ParticleSystem( geometry, shaderMaterial );
+
+			// sphere.sortParticles = true;
+
 			scene.add( sphere );
 
 			renderer = new THREE.WebGLRenderer();

examples/webgl_buffergeometry_lines.html

@@ -69,11 +69,8 @@
 				var geometry = new THREE.BufferGeometry();
 				var material = new THREE.LineBasicMaterial({ vertexColors: true });
 
-				geometry.addAttribute( 'position', new Float32Array( segments * 3 ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( segments * 3 ), 3 );
-
-				var positions = geometry.getAttribute( 'position' ).array;
-				var colors = geometry.getAttribute( 'color' ).array;
+				var positions = new Float32Array( segments * 3 );
+				var colors = new Float32Array( segments * 3 );
 
 				var r = 800;
 
@@ -97,6 +94,9 @@
 
 				}
 
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
+
 				geometry.computeBoundingSphere();
 
 				mesh = new THREE.Line( geometry, material );

examples/webgl_buffergeometry_lines_indexed.html

@@ -69,7 +69,8 @@
 				var colors = [];
 				var indices_array = [];
 
-				// --------------------------------
+				//
+
 				var iteration_count = 4;
 				var rangle = 60 * Math.PI / 180.0;
 
@@ -181,9 +182,9 @@
 				);
 				// --------------------------------
 
-				geometry.addAttribute( 'index', new Uint16Array( indices_array ), 1 );
-				geometry.addAttribute( 'position', new Float32Array( positions ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( colors ), 3 );
+				geometry.addAttribute( 'index', new THREE.Uint16Attribute( indices_array, 1 ) );
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
 				geometry.computeBoundingSphere();
 
 				mesh = new THREE.Line( geometry, material, THREE.LinePieces );

examples/webgl_buffergeometry_particles.html

@@ -69,11 +69,8 @@
 
 				var geometry = new THREE.BufferGeometry();
 
-				geometry.addAttribute( 'position', new Float32Array( particles * 3 ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( particles * 3 ), 3 );
-
-				var positions = geometry.getAttribute( 'position' ).array;
-				var colors = geometry.getAttribute( 'color' ).array;
+				var positions = new Float32Array( particles * 3 );
+				var colors = new Float32Array( particles * 3 );
 
 				var color = new THREE.Color();
 
@@ -105,6 +102,9 @@
 
 				}
 
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
+
 				geometry.computeBoundingSphere();
 
 				//

examples/webgl_buffergeometry_rawshader.html

@@ -113,7 +113,7 @@
 
 				var geometry = new THREE.BufferGeometry();
 
-				var vertices = new THREE.Float32Attribute( triangles * 3, 3 );
+				var vertices = new THREE.Float32Attribute( triangles * 3 * 3, 3 );
 
 				for ( var i = 0; i < vertices.length; i ++ ) {
 
@@ -123,7 +123,7 @@
 
 				geometry.addAttribute( 'position', vertices );
 
-				var colors = new THREE.Float32Attribute( triangles * 3, 4 );
+				var colors = new THREE.Float32Attribute( triangles * 3 * 4, 4 );
 
 				for ( var i = 0; i < colors.length; i ++ ) {
 

examples/webgl_buffergeometry_uint.html

@@ -82,12 +82,9 @@
 
 				var geometry = new THREE.BufferGeometry();
 
-				geometry.addAttribute( 'index', new Uint32Array( triangles * 3 ), 1 );
-				geometry.addAttribute( 'position', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'normal', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( triangles * 3 * 3 ), 3 );
 
-				var indices = geometry.getAttribute( 'index' ).array;
+
+				var indices = new Uint32Array( triangles * 3 );
 
 				for ( var i = 0; i < indices.length; i ++ ) {
 
@@ -95,9 +92,9 @@
 
 				}
 
-				var positions = geometry.getAttribute( 'position' ).array;
-				var normals = geometry.getAttribute( 'normal' ).array;
-				var colors = geometry.getAttribute( 'color' ).array;
+				var positions = new Float32Array( triangles * 3 * 3 );
+				var normals = new Float32Array( triangles * 3 * 3 );
+				var colors = new Float32Array( triangles * 3 * 3 );
 
 				var color = new THREE.Color();
 
@@ -193,6 +190,11 @@
 
 				}
 
+				geometry.addAttribute( 'index', new THREE.Uint32Attribute( indices, 1 ) );
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'normal', new THREE.Float32Attribute( normals, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
+
 				geometry.computeBoundingSphere();
 
 				var material = new THREE.MeshPhongMaterial( {

examples/webgl_gpgpu_birds.html

@@ -382,9 +382,9 @@
 
 				THREE.BufferGeometry.call( this );
 
-				var vertices = new THREE.Float32Attribute( points, 3 );
-				var birdColors = new THREE.Float32Attribute( points, 3 );
-				var references = new THREE.Float32Attribute( points, 2 );
+				var vertices = new THREE.Float32Attribute( points * 3, 3 );
+				var birdColors = new THREE.Float32Attribute( points * 3, 3 );
+				var references = new THREE.Float32Attribute( points * 2, 2 );
 				var birdVertex = new THREE.Float32Attribute( points, 1 );
 
 				this.addAttribute( 'position', vertices );

examples/webgl_interactive_buffergeometry.html

@@ -84,13 +84,9 @@
 
 				var geometry = new THREE.BufferGeometry();
 
-				geometry.addAttribute( 'position', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'normal', new Float32Array( triangles * 3 * 3 ), 3 );
-				geometry.addAttribute( 'color', new Float32Array( triangles * 3 * 3 ), 3 );
-
-				var positions = geometry.getAttribute( 'position' ).array;
-				var normals = geometry.getAttribute( 'normal' ).array;
-				var colors = geometry.getAttribute( 'color' ).array;
+				var positions = new Float32Array( triangles * 3 * 3 );
+				var normals = new Float32Array( triangles * 3 * 3 );
+				var colors = new Float32Array( triangles * 3 * 3 );
 
 				var color = new THREE.Color();
 
@@ -186,6 +182,10 @@
 
 				}
 
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( positions, 3 ) );
+				geometry.addAttribute( 'normal', new THREE.Float32Attribute( normals, 3 ) );
+				geometry.addAttribute( 'color', new THREE.Float32Attribute( colors, 3 ) );
+
 				geometry.computeBoundingSphere();
 
 				var material = new THREE.MeshPhongMaterial( {
@@ -204,7 +204,7 @@
 				mouse = new THREE.Vector2();
 
 				var geometry = new THREE.BufferGeometry();
-				geometry.addAttribute( 'position', new Float32Array( 4 * 3 ), 3 );
+				geometry.addAttribute( 'position', new THREE.Float32Attribute( 4 * 3, 3 ) );
 
 				var material = new THREE.LineBasicMaterial( { color: 0xffffff, linewidth: 2, transparent: true } );
 

src/extras/helpers/EdgesHelper.js

@@ -48,7 +48,7 @@ THREE.EdgesHelper = function ( object, hex ) {
 
 	}
 
-	geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2, 3 ) );
+	geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2 * 3, 3 ) );
 
 	var coords = geometry.attributes.position.array;
 

src/extras/helpers/WireframeHelper.js

@@ -46,7 +46,7 @@ THREE.WireframeHelper = function ( object, hex ) {
 
 		}
 
-		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2, 3 ) );
+		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2 * 3, 3 ) );
 
 		var coords = geometry.attributes.position.array;
 
@@ -106,7 +106,7 @@ THREE.WireframeHelper = function ( object, hex ) {
 
 		}
 
-		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2, 3 ) );
+		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2 * 3, 3 ) );
 
 		var coords = geometry.attributes.position.array;
 
@@ -130,7 +130,7 @@ THREE.WireframeHelper = function ( object, hex ) {
 		var numEdges = vertices.length / 3;
 		var numTris = numEdges / 3;
 
-		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2, 3 ) );
+		geometry.addAttribute( 'position', new THREE.Float32Attribute( numEdges * 2 * 3, 3 ) );
 
 		var coords = geometry.attributes.position.array;
 

src/objects/Sprite.js

@@ -5,7 +5,7 @@
 
 THREE.Sprite = ( function () {
 
-	var vertices = new THREE.Float32Attribute( 3, 3 );
+	var vertices = new THREE.Float32Attribute( 3 * 3, 3 );
 	vertices.set( [ - 0.5, - 0.5, 0, 0.5, - 0.5, 0, 0.5, 0.5, 0 ] );
 
 	var geometry = new THREE.BufferGeometry();