diff --git a/examples/js/wip/Geometry4.js b/examples/js/wip/Geometry4.js new file mode 100644 index 0000000000000000000000000000000000000000..189b5e0f0a27d8786efb6c9d56d2a8c2d660aaff --- /dev/null +++ b/examples/js/wip/Geometry4.js @@ -0,0 +1,82 @@ +THREE.Geometry4 = function ( size ) { + + THREE.BufferGeometry.call( this ); + + var verticesBuffer = new ArrayBuffer( size * 3 * 4 ); + var normalsBuffer = new ArrayBuffer( size * 3 * 4 ); + var uvsBuffer = new ArrayBuffer( size * 2 * 4 ); + + this.attributes[ 'position' ] = { array: new Float32Array( verticesBuffer, 0, size * 3 ), itemSize: 3 }; + this.attributes[ 'normal' ] = { array: new Float32Array( normalsBuffer, 0, size * 3 ), itemSize: 3 }; + this.attributes[ 'uv' ] = { array: new Float32Array( uvsBuffer, 0, size * 2 ), itemSize: 2 }; + + this.vertices = new THREE.VectorArrayProxy( this.attributes[ 'position' ] ); + this.normals = new THREE.VectorArrayProxy( this.attributes[ 'normal' ] ); + this.uvs = new THREE.VectorArrayProxy( this.attributes[ 'uv' ] ); + +}; +THREE.Geometry4.prototype = Object.create( THREE.BufferGeometry.prototype ); + +THREE.VectorArrayProxy = function(attribute) { + + // Acts as a proxy for an array of vectors, by setting up accessors which return THREE.Vector*Proxy objects + + this.attribute = attribute; + + for (var i = 0, l = this.attribute.array.length / this.attribute.itemSize; i < l; i++) { + + Object.defineProperty(this, i, { + get: (function(i) { return function() { return this.getValue(i); }})(i), + set: (function(i) { return function(v) { return this.setValue(i, v); }})(i), + }); + + } + +} + +THREE.VectorArrayProxy.prototype.getValue = function(i) { + + // Allocates a new THREE.Vector2Proxy or THREE.Vector3Proxy depending on the itemSize of our attribute + + var subarray = this.attribute.array.subarray(i * this.attribute.itemSize, (i + 1) * this.attribute.itemSize); + + switch (this.attribute.itemSize) { + + case 2: + return new THREE.Vector2Proxy(subarray); + + case 3: + return new THREE.Vector3Proxy(subarray); + + } + +} +THREE.VectorArrayProxy.prototype.setValue = function(i, v) { + + var vec = this[i]; + vec.copy(v); + +} + +// Vector Proxy Objects + +THREE.Vector2Proxy = function(subarray) { + + this.subarray = subarray; + +} +THREE.Vector2Proxy.prototype = Object.create( THREE.Vector2.prototype ); +Object.defineProperty(THREE.Vector2Proxy.prototype, 'x', { get: function() { return this.subarray[0]; }, set: function(v) { this.subarray[0] = v; } }); +Object.defineProperty(THREE.Vector2Proxy.prototype, 'y', { get: function() { return this.subarray[1]; }, set: function(v) { this.subarray[1] = v; } }); + + +THREE.Vector3Proxy = function(subarray) { + + this.subarray = subarray; + +} +THREE.Vector3Proxy.prototype = Object.create( THREE.Vector3.prototype ); + +Object.defineProperty(THREE.Vector3Proxy.prototype, 'x', { get: function() { return this.subarray[0]; }, set: function(v) { this.subarray[0] = v; } }); +Object.defineProperty(THREE.Vector3Proxy.prototype, 'y', { get: function() { return this.subarray[1]; }, set: function(v) { this.subarray[1] = v; } }); +Object.defineProperty(THREE.Vector3Proxy.prototype, 'z', { get: function() { return this.subarray[2]; }, set: function(v) { this.subarray[2] = v; } }); \ No newline at end of file diff --git a/examples/js/wip/Geometry5.js b/examples/js/wip/Geometry5.js new file mode 100644 index 0000000000000000000000000000000000000000..b2bab3800dae94522bc951b57730f41853d649ee --- /dev/null +++ b/examples/js/wip/Geometry5.js @@ -0,0 +1,75 @@ +/** + * @author mrdoob / http://mrdoob.com/ + */ + +THREE.Geometry5 = function ( size ) { + + THREE.BufferGeometry.call( this ); + + var verticesBuffer = new Float32Array( size * 3 ); + var normalsBuffer = new Float32Array( size * 3 ); + var uvsBuffer = new Float32Array( size * 2 ); + + this.vertices = []; + this.normals = []; + this.uvs = []; + + for ( var i = 0; i < size; i ++ ) { + + this.vertices.push( new THREE.TypedVector3( verticesBuffer, i * 3 ) ); + this.normals.push( new THREE.TypedVector3( normalsBuffer, i * 3 ) ); + this.uvs.push( new THREE.TypedVector2( uvsBuffer, i * 2 ) ); + + } + + this.attributes[ 'position' ] = { array: verticesBuffer, itemSize: 3 }; + this.attributes[ 'normal' ] = { array: normalsBuffer, itemSize: 3 }; + this.attributes[ 'uv' ] = { array: uvsBuffer, itemSize: 2 }; + +}; + +THREE.Geometry5.prototype = Object.create( THREE.BufferGeometry.prototype ); + +THREE.TypedVector2 = function ( array, offset ) { + + this.array = array; + this.offset = offset; + +}; + +THREE.TypedVector2.prototype = Object.create( THREE.Vector2.prototype ); + +Object.defineProperties( THREE.TypedVector2.prototype, { + 'x': { + get: function () { return this.array[ this.offset ]; }, + set: function ( v ) { this.array[ this.offset ] = v; } + }, + 'y': { + get: function () { return this.array[ this.offset + 1 ]; }, + set: function ( v ) { this.array[ this.offset + 1 ] = v; } + } +} ); + +THREE.TypedVector3 = function ( array, offset ) { + + this.array = array; + this.offset = offset; + +}; + +THREE.TypedVector3.prototype = Object.create( THREE.Vector3.prototype ); + +Object.defineProperties( THREE.TypedVector3.prototype, { + 'x': { + get: function () { return this.array[ this.offset ]; }, + set: function ( v ) { this.array[ this.offset ] = v; } + }, + 'y': { + get: function () { return this.array[ this.offset + 1 ]; }, + set: function ( v ) { this.array[ this.offset + 1 ] = v; } + }, + 'z': { + get: function () { return this.array[ this.offset + 2 ]; }, + set: function ( v ) { this.array[ this.offset + 2 ] = v; } + } +} ); \ No newline at end of file diff --git a/examples/js/wip/IndexedGeometry5.js b/examples/js/wip/IndexedGeometry5.js new file mode 100644 index 0000000000000000000000000000000000000000..073bbe693fb8f05327dfe63d14e9afad8cc044ab --- /dev/null +++ b/examples/js/wip/IndexedGeometry5.js @@ -0,0 +1,77 @@ +/** + * @author mrdoob / http://mrdoob.com/ + */ + +THREE.IndexedGeometry5 = function ( indices, size ) { + + THREE.BufferGeometry.call( this ); + + var verticesBuffer = new Float32Array( size * 3 ); + var normalsBuffer = new Float32Array( size * 3 ); + var uvsBuffer = new Float32Array( size * 2 ); + + this.indices = new Uint16Array( indices ); + this.vertices = []; + this.normals = []; + this.uvs = []; + + for ( var i = 0; i < size; i ++ ) { + + this.vertices.push( new THREE.TypedVector3( verticesBuffer, i * 3 ) ); + this.normals.push( new THREE.TypedVector3( normalsBuffer, i * 3 ) ); + this.uvs.push( new THREE.TypedVector2( uvsBuffer, i * 2 ) ); + + } + + this.attributes[ 'index' ] = { array: this.indices, itemSize: 1 }; + this.attributes[ 'position' ] = { array: verticesBuffer, itemSize: 3 }; + this.attributes[ 'normal' ] = { array: normalsBuffer, itemSize: 3 }; + this.attributes[ 'uv' ] = { array: uvsBuffer, itemSize: 2 }; + +}; + +THREE.IndexedGeometry5.prototype = Object.create( THREE.BufferGeometry.prototype ); + +THREE.TypedVector2 = function ( array, offset ) { + + this.array = array; + this.offset = offset; + +}; + +THREE.TypedVector2.prototype = Object.create( THREE.Vector2.prototype ); + +Object.defineProperties( THREE.TypedVector2.prototype, { + 'x': { + get: function () { return this.array[ this.offset ]; }, + set: function ( v ) { this.array[ this.offset ] = v; } + }, + 'y': { + get: function () { return this.array[ this.offset + 1 ]; }, + set: function ( v ) { this.array[ this.offset + 1 ] = v; } + } +} ); + +THREE.TypedVector3 = function ( array, offset ) { + + this.array = array; + this.offset = offset; + +}; + +THREE.TypedVector3.prototype = Object.create( THREE.Vector3.prototype ); + +Object.defineProperties( THREE.TypedVector3.prototype, { + 'x': { + get: function () { return this.array[ this.offset ]; }, + set: function ( v ) { this.array[ this.offset ] = v; } + }, + 'y': { + get: function () { return this.array[ this.offset + 1 ]; }, + set: function ( v ) { this.array[ this.offset + 1 ] = v; } + }, + 'z': { + get: function () { return this.array[ this.offset + 2 ]; }, + set: function ( v ) { this.array[ this.offset + 2 ] = v; } + } +} ); \ No newline at end of file diff --git a/examples/js/wip/IndexedPlaneGeometry5.js b/examples/js/wip/IndexedPlaneGeometry5.js new file mode 100644 index 0000000000000000000000000000000000000000..6ca3f9787321769c109dd1adb674e1a6b8f9ab05 --- /dev/null +++ b/examples/js/wip/IndexedPlaneGeometry5.js @@ -0,0 +1,82 @@ +/** + * @author mrdoob / http://mrdoob.com/ + * based on http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/org/papervision3d/objects/primitives/Plane.as + */ + +THREE.IndexedPlaneGeometry5 = function ( width, height, widthSegments, heightSegments ) { + + this.width = width; + this.height = height; + + this.widthSegments = widthSegments || 1; + this.heightSegments = heightSegments || 1; + + var width_half = width / 2; + var height_half = height / 2; + + var gridX = this.widthSegments; + var gridY = this.heightSegments; + + var gridX1 = gridX + 1; + var gridY1 = gridY + 1; + + var segment_width = this.width / gridX; + var segment_height = this.height / gridY; + + var indices = gridX * gridY * 6; + var vertices = gridX1 * gridY1; + + THREE.IndexedGeometry5.call( this, indices, vertices ); + + var offset = 0; + + for ( var iy = 0; iy < gridY1; iy ++ ) { + + var y = iy * segment_height - height_half; + + for ( var ix = 0; ix < gridX1; ix ++ ) { + + var x = ix * segment_width - width_half; + + this.vertices[ offset ].x = x; + this.vertices[ offset ].y = - y; + + this.normals[ offset ].z = 1; + + this.uvs[ offset ].x = ix / gridX; + this.uvs[ offset ].y = iy / gridY; + + offset ++; + + } + + } + + var offset = 0; + + for ( var iy = 0; iy < gridY; iy ++ ) { + + for ( var ix = 0; ix < gridX; ix ++ ) { + + var a = ix + gridX1 * iy; + var b = ix + gridX1 * ( iy + 1 ); + var c = ( ix + 1 ) + gridX1 * ( iy + 1 ); + var d = ( ix + 1 ) + gridX1 * iy; + + this.indices[ offset ] = a; + this.indices[ offset + 1 ] = b; + this.indices[ offset + 2 ] = d; + + this.indices[ offset + 3 ] = b; + this.indices[ offset + 4 ] = c; + this.indices[ offset + 5 ] = d; + + offset += 6; + + } + + } + +}; + +THREE.IndexedPlaneGeometry5.prototype = Object.create( THREE.IndexedGeometry5.prototype ); diff --git a/examples/js/wip/PlaneGeometry5.js b/examples/js/wip/PlaneGeometry5.js new file mode 100644 index 0000000000000000000000000000000000000000..be20f6536c7b7013125979e7c2caee1f42f4e11e --- /dev/null +++ b/examples/js/wip/PlaneGeometry5.js @@ -0,0 +1,65 @@ +/** + * @author mrdoob / http://mrdoob.com/ + * based on http://papervision3d.googlecode.com/svn/trunk/as3/trunk/src/org/papervision3d/objects/primitives/Plane.as + */ + +THREE.PlaneGeometry5 = function ( width, height, widthSegments, heightSegments ) { + + THREE.Geometry5.call( this, ( widthSegments * heightSegments ) * 2 * 3 ); + + var vertices = this.vertices; + var normals = this.normals; + var uvs = this.uvs; + + this.width = width; + this.height = height; + + this.widthSegments = widthSegments || 1; + this.heightSegments = heightSegments || 1; + + var widthHalf = width / 2; + var heightHalf = height / 2; + + var gridX = this.widthSegments; + var gridY = this.heightSegments; + + var segmentWidth = this.width / gridX; + var segmentHeight = this.height / gridY; + + var offset = 0; + + for ( var iy = 0; iy < gridY; iy ++ ) { + + var y1 = iy * segmentHeight - heightHalf; + var y2 = ( iy + 1 ) * segmentHeight - heightHalf; + + for ( var ix = 0; ix < gridX; ix ++ ) { + + var x1 = ix * segmentWidth - widthHalf; + var x2 = ( ix + 1 ) * segmentWidth - widthHalf; + + vertices[ offset + 0 ].set( x1, y1, 0 ); + vertices[ offset + 1 ].set( x2, y1, 0 ); + vertices[ offset + 2 ].set( x1, y2, 0 ); + + normals[ offset + 0 ].z = 1; + normals[ offset + 1 ].z = 1; + normals[ offset + 2 ].z = 1; + + vertices[ offset + 3 ].set( x2, y1, 0 ); + vertices[ offset + 4 ].set( x2, y2, 0 ); + vertices[ offset + 5 ].set( x1, y2, 0 ); + + normals[ offset + 3 ].z = 1; + normals[ offset + 4 ].z = 1; + normals[ offset + 5 ].z = 1; + + offset += 6; + + } + + } + +}; + +THREE.PlaneGeometry5.prototype = Object.create( THREE.Geometry5.prototype ); diff --git a/examples/misc_geometry2_sandbox.html b/examples/misc_geometry2_sandbox.html index f713455917fd2a57e8271805a5d866e52c8730d8..11516e0878c59150085b2b8ed8828fe11c6f0225 100644 --- a/examples/misc_geometry2_sandbox.html +++ b/examples/misc_geometry2_sandbox.html @@ -17,6 +17,8 @@ + + @@ -25,7 +27,11 @@ - + + + + + @@ -57,10 +63,11 @@ // - addGeometries( 'PlaneGeometryB', 'BoxGeometry', 0 ); + // addGeometries( 'PlaneGeometry', 'BoxGeometry', 0 ); + // addGeometries( 'IndexedPlaneGeometry5', 'BoxGeometry', 0 ); // addGeometries( 'PlaneGeometry2', 'BoxGeometry2', 0 ); // addGeometries( 'PlaneGeometry3', 'BoxGeometry2', 0 ); - // addGeometries( 'PlaneGeometryB', 'BoxGeometry2', 0 ); + addGeometries( 'PlaneGeometryB', 'BoxGeometry2', 0 ); // @@ -79,6 +86,7 @@ window.addEventListener( 'resize', onWindowResize, false ); + /* setInterval( function () { console.log( '---' ); @@ -86,9 +94,11 @@ createGeometry( 'PlaneGeometry' ); createGeometry( 'PlaneGeometry2' ); createGeometry( 'PlaneGeometry2b' ); + createGeometry( 'PlaneGeometry5' ); createGeometry( 'PlaneGeometryB' ); }, 2000 ); +*/ } @@ -107,12 +117,12 @@ // Plane console.time( PlaneGeometry ); - var geometry = new THREE[ PlaneGeometry ]( 200, 200, 100, 100 ); + var geometry = new THREE[ PlaneGeometry ]( 200, 200, 200, 200 ); console.timeEnd( PlaneGeometry ); geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) ); - var material = new THREE.MeshPhongMaterial( { color: 0xffffff /*, wireframe: true*/ } ); + var material = new THREE.MeshPhongMaterial( { color: 0xff0000/*, wireframe: true*/ } ); plane = new THREE.Mesh( geometry, material ); plane.position.x = x;