webvr js meetup initial commit
This commit is contained in:
104
node_modules/three/examples/js/renderers/CSS2DRenderer.js
generated
vendored
Normal file
104
node_modules/three/examples/js/renderers/CSS2DRenderer.js
generated
vendored
Normal file
@@ -0,0 +1,104 @@
|
||||
/**
|
||||
* @author mrdoob / http://mrdoob.com/
|
||||
*/
|
||||
|
||||
THREE.CSS2DObject = function ( element ) {
|
||||
|
||||
THREE.Object3D.call( this );
|
||||
|
||||
this.element = element;
|
||||
this.element.style.position = 'absolute';
|
||||
|
||||
this.addEventListener( 'removed', function ( event ) {
|
||||
|
||||
if ( this.element.parentNode !== null ) {
|
||||
|
||||
this.element.parentNode.removeChild( this.element );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
THREE.CSS2DObject.prototype = Object.create( THREE.Object3D.prototype );
|
||||
THREE.CSS2DObject.prototype.constructor = THREE.CSS2DObject;
|
||||
|
||||
//
|
||||
|
||||
THREE.CSS2DRenderer = function () {
|
||||
|
||||
console.log( 'THREE.CSS2DRenderer', THREE.REVISION );
|
||||
|
||||
var _width, _height;
|
||||
var _widthHalf, _heightHalf;
|
||||
|
||||
var vector = new THREE.Vector3();
|
||||
var viewMatrix = new THREE.Matrix4();
|
||||
var viewProjectionMatrix = new THREE.Matrix4();
|
||||
|
||||
var domElement = document.createElement( 'div' );
|
||||
domElement.style.overflow = 'hidden';
|
||||
|
||||
this.domElement = domElement;
|
||||
|
||||
this.setSize = function ( width, height ) {
|
||||
|
||||
_width = width;
|
||||
_height = height;
|
||||
|
||||
_widthHalf = _width / 2;
|
||||
_heightHalf = _height / 2;
|
||||
|
||||
domElement.style.width = width + 'px';
|
||||
domElement.style.height = height + 'px';
|
||||
|
||||
};
|
||||
|
||||
var renderObject = function ( object, camera ) {
|
||||
|
||||
if ( object instanceof THREE.CSS2DObject ) {
|
||||
|
||||
vector.setFromMatrixPosition( object.matrixWorld );
|
||||
vector.applyMatrix4( viewProjectionMatrix );
|
||||
|
||||
var element = object.element;
|
||||
var style = 'translate(-50%,-50%) translate(' + ( vector.x * _widthHalf + _widthHalf ) + 'px,' + ( - vector.y * _heightHalf + _heightHalf ) + 'px)';
|
||||
|
||||
element.style.WebkitTransform = style;
|
||||
element.style.MozTransform = style;
|
||||
element.style.oTransform = style;
|
||||
element.style.transform = style;
|
||||
|
||||
if ( element.parentNode !== domElement ) {
|
||||
|
||||
domElement.appendChild( element );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
for ( var i = 0, l = object.children.length; i < l; i ++ ) {
|
||||
|
||||
renderObject( object.children[ i ], camera );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
scene.updateMatrixWorld();
|
||||
|
||||
if ( camera.parent === null ) camera.updateMatrixWorld();
|
||||
|
||||
camera.matrixWorldInverse.getInverse( camera.matrixWorld );
|
||||
|
||||
viewMatrix.copy( camera.matrixWorldInverse.getInverse( camera.matrixWorld ) );
|
||||
viewProjectionMatrix.multiplyMatrices( camera.projectionMatrix, viewMatrix );
|
||||
|
||||
renderObject( scene, camera );
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
252
node_modules/three/examples/js/renderers/CSS3DRenderer.js
generated
vendored
Normal file
252
node_modules/three/examples/js/renderers/CSS3DRenderer.js
generated
vendored
Normal file
@@ -0,0 +1,252 @@
|
||||
/**
|
||||
* Based on http://www.emagix.net/academic/mscs-project/item/camera-sync-with-css3-and-webgl-threejs
|
||||
* @author mrdoob / http://mrdoob.com/
|
||||
*/
|
||||
|
||||
THREE.CSS3DObject = function ( element ) {
|
||||
|
||||
THREE.Object3D.call( this );
|
||||
|
||||
this.element = element;
|
||||
this.element.style.position = 'absolute';
|
||||
|
||||
this.addEventListener( 'removed', function ( event ) {
|
||||
|
||||
if ( this.element.parentNode !== null ) {
|
||||
|
||||
this.element.parentNode.removeChild( this.element );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
THREE.CSS3DObject.prototype = Object.create( THREE.Object3D.prototype );
|
||||
THREE.CSS3DObject.prototype.constructor = THREE.CSS3DObject;
|
||||
|
||||
THREE.CSS3DSprite = function ( element ) {
|
||||
|
||||
THREE.CSS3DObject.call( this, element );
|
||||
|
||||
};
|
||||
|
||||
THREE.CSS3DSprite.prototype = Object.create( THREE.CSS3DObject.prototype );
|
||||
THREE.CSS3DSprite.prototype.constructor = THREE.CSS3DSprite;
|
||||
|
||||
//
|
||||
|
||||
THREE.CSS3DRenderer = function () {
|
||||
|
||||
console.log( 'THREE.CSS3DRenderer', THREE.REVISION );
|
||||
|
||||
var _width, _height;
|
||||
var _widthHalf, _heightHalf;
|
||||
|
||||
var matrix = new THREE.Matrix4();
|
||||
|
||||
var cache = {
|
||||
camera: { fov: 0, style: '' },
|
||||
objects: {}
|
||||
};
|
||||
|
||||
var domElement = document.createElement( 'div' );
|
||||
domElement.style.overflow = 'hidden';
|
||||
|
||||
domElement.style.WebkitTransformStyle = 'preserve-3d';
|
||||
domElement.style.MozTransformStyle = 'preserve-3d';
|
||||
domElement.style.oTransformStyle = 'preserve-3d';
|
||||
domElement.style.transformStyle = 'preserve-3d';
|
||||
|
||||
this.domElement = domElement;
|
||||
|
||||
var cameraElement = document.createElement( 'div' );
|
||||
|
||||
cameraElement.style.WebkitTransformStyle = 'preserve-3d';
|
||||
cameraElement.style.MozTransformStyle = 'preserve-3d';
|
||||
cameraElement.style.oTransformStyle = 'preserve-3d';
|
||||
cameraElement.style.transformStyle = 'preserve-3d';
|
||||
|
||||
domElement.appendChild( cameraElement );
|
||||
|
||||
this.setClearColor = function () {};
|
||||
|
||||
this.getSize = function() {
|
||||
|
||||
return {
|
||||
width: _width,
|
||||
height: _height
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
this.setSize = function ( width, height ) {
|
||||
|
||||
_width = width;
|
||||
_height = height;
|
||||
|
||||
_widthHalf = _width / 2;
|
||||
_heightHalf = _height / 2;
|
||||
|
||||
domElement.style.width = width + 'px';
|
||||
domElement.style.height = height + 'px';
|
||||
|
||||
cameraElement.style.width = width + 'px';
|
||||
cameraElement.style.height = height + 'px';
|
||||
|
||||
};
|
||||
|
||||
var epsilon = function ( value ) {
|
||||
|
||||
return Math.abs( value ) < Number.EPSILON ? 0 : value;
|
||||
|
||||
};
|
||||
|
||||
var getCameraCSSMatrix = function ( matrix ) {
|
||||
|
||||
var elements = matrix.elements;
|
||||
|
||||
return 'matrix3d(' +
|
||||
epsilon( elements[ 0 ] ) + ',' +
|
||||
epsilon( - elements[ 1 ] ) + ',' +
|
||||
epsilon( elements[ 2 ] ) + ',' +
|
||||
epsilon( elements[ 3 ] ) + ',' +
|
||||
epsilon( elements[ 4 ] ) + ',' +
|
||||
epsilon( - elements[ 5 ] ) + ',' +
|
||||
epsilon( elements[ 6 ] ) + ',' +
|
||||
epsilon( elements[ 7 ] ) + ',' +
|
||||
epsilon( elements[ 8 ] ) + ',' +
|
||||
epsilon( - elements[ 9 ] ) + ',' +
|
||||
epsilon( elements[ 10 ] ) + ',' +
|
||||
epsilon( elements[ 11 ] ) + ',' +
|
||||
epsilon( elements[ 12 ] ) + ',' +
|
||||
epsilon( - elements[ 13 ] ) + ',' +
|
||||
epsilon( elements[ 14 ] ) + ',' +
|
||||
epsilon( elements[ 15 ] ) +
|
||||
')';
|
||||
|
||||
};
|
||||
|
||||
var getObjectCSSMatrix = function ( matrix ) {
|
||||
|
||||
var elements = matrix.elements;
|
||||
|
||||
return 'translate3d(-50%,-50%,0) matrix3d(' +
|
||||
epsilon( elements[ 0 ] ) + ',' +
|
||||
epsilon( elements[ 1 ] ) + ',' +
|
||||
epsilon( elements[ 2 ] ) + ',' +
|
||||
epsilon( elements[ 3 ] ) + ',' +
|
||||
epsilon( - elements[ 4 ] ) + ',' +
|
||||
epsilon( - elements[ 5 ] ) + ',' +
|
||||
epsilon( - elements[ 6 ] ) + ',' +
|
||||
epsilon( - elements[ 7 ] ) + ',' +
|
||||
epsilon( elements[ 8 ] ) + ',' +
|
||||
epsilon( elements[ 9 ] ) + ',' +
|
||||
epsilon( elements[ 10 ] ) + ',' +
|
||||
epsilon( elements[ 11 ] ) + ',' +
|
||||
epsilon( elements[ 12 ] ) + ',' +
|
||||
epsilon( elements[ 13 ] ) + ',' +
|
||||
epsilon( elements[ 14 ] ) + ',' +
|
||||
epsilon( elements[ 15 ] ) +
|
||||
')';
|
||||
|
||||
};
|
||||
|
||||
var renderObject = function ( object, camera ) {
|
||||
|
||||
if ( object instanceof THREE.CSS3DObject ) {
|
||||
|
||||
var style;
|
||||
|
||||
if ( object instanceof THREE.CSS3DSprite ) {
|
||||
|
||||
// http://swiftcoder.wordpress.com/2008/11/25/constructing-a-billboard-matrix/
|
||||
|
||||
matrix.copy( camera.matrixWorldInverse );
|
||||
matrix.transpose();
|
||||
matrix.copyPosition( object.matrixWorld );
|
||||
matrix.scale( object.scale );
|
||||
|
||||
matrix.elements[ 3 ] = 0;
|
||||
matrix.elements[ 7 ] = 0;
|
||||
matrix.elements[ 11 ] = 0;
|
||||
matrix.elements[ 15 ] = 1;
|
||||
|
||||
style = getObjectCSSMatrix( matrix );
|
||||
|
||||
} else {
|
||||
|
||||
style = getObjectCSSMatrix( object.matrixWorld );
|
||||
|
||||
}
|
||||
|
||||
var element = object.element;
|
||||
var cachedStyle = cache.objects[ object.id ];
|
||||
|
||||
if ( cachedStyle === undefined || cachedStyle !== style ) {
|
||||
|
||||
element.style.WebkitTransform = style;
|
||||
element.style.MozTransform = style;
|
||||
element.style.oTransform = style;
|
||||
element.style.transform = style;
|
||||
|
||||
cache.objects[ object.id ] = style;
|
||||
|
||||
}
|
||||
|
||||
if ( element.parentNode !== cameraElement ) {
|
||||
|
||||
cameraElement.appendChild( element );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
for ( var i = 0, l = object.children.length; i < l; i ++ ) {
|
||||
|
||||
renderObject( object.children[ i ], camera );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
var fov = 0.5 / Math.tan( THREE.Math.degToRad( camera.getEffectiveFOV() * 0.5 ) ) * _height;
|
||||
|
||||
if ( cache.camera.fov !== fov ) {
|
||||
|
||||
domElement.style.WebkitPerspective = fov + "px";
|
||||
domElement.style.MozPerspective = fov + "px";
|
||||
domElement.style.oPerspective = fov + "px";
|
||||
domElement.style.perspective = fov + "px";
|
||||
|
||||
cache.camera.fov = fov;
|
||||
|
||||
}
|
||||
|
||||
scene.updateMatrixWorld();
|
||||
|
||||
if ( camera.parent === null ) camera.updateMatrixWorld();
|
||||
|
||||
camera.matrixWorldInverse.getInverse( camera.matrixWorld );
|
||||
|
||||
var style = "translate3d(0,0," + fov + "px)" + getCameraCSSMatrix( camera.matrixWorldInverse ) +
|
||||
" translate3d(" + _widthHalf + "px," + _heightHalf + "px, 0)";
|
||||
|
||||
if ( cache.camera.style !== style ) {
|
||||
|
||||
cameraElement.style.WebkitTransform = style;
|
||||
cameraElement.style.MozTransform = style;
|
||||
cameraElement.style.oTransform = style;
|
||||
cameraElement.style.transform = style;
|
||||
|
||||
cache.camera.style = style;
|
||||
|
||||
}
|
||||
|
||||
renderObject( scene, camera );
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
1155
node_modules/three/examples/js/renderers/CanvasRenderer.js
generated
vendored
Normal file
1155
node_modules/three/examples/js/renderers/CanvasRenderer.js
generated
vendored
Normal file
File diff suppressed because it is too large
Load Diff
929
node_modules/three/examples/js/renderers/Projector.js
generated
vendored
Normal file
929
node_modules/three/examples/js/renderers/Projector.js
generated
vendored
Normal file
@@ -0,0 +1,929 @@
|
||||
/**
|
||||
* @author mrdoob / http://mrdoob.com/
|
||||
* @author supereggbert / http://www.paulbrunt.co.uk/
|
||||
* @author julianwa / https://github.com/julianwa
|
||||
*/
|
||||
|
||||
THREE.RenderableObject = function () {
|
||||
|
||||
this.id = 0;
|
||||
|
||||
this.object = null;
|
||||
this.z = 0;
|
||||
this.renderOrder = 0;
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
THREE.RenderableFace = function () {
|
||||
|
||||
this.id = 0;
|
||||
|
||||
this.v1 = new THREE.RenderableVertex();
|
||||
this.v2 = new THREE.RenderableVertex();
|
||||
this.v3 = new THREE.RenderableVertex();
|
||||
|
||||
this.normalModel = new THREE.Vector3();
|
||||
|
||||
this.vertexNormalsModel = [ new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3() ];
|
||||
this.vertexNormalsLength = 0;
|
||||
|
||||
this.color = new THREE.Color();
|
||||
this.material = null;
|
||||
this.uvs = [ new THREE.Vector2(), new THREE.Vector2(), new THREE.Vector2() ];
|
||||
|
||||
this.z = 0;
|
||||
this.renderOrder = 0;
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
THREE.RenderableVertex = function () {
|
||||
|
||||
this.position = new THREE.Vector3();
|
||||
this.positionWorld = new THREE.Vector3();
|
||||
this.positionScreen = new THREE.Vector4();
|
||||
|
||||
this.visible = true;
|
||||
|
||||
};
|
||||
|
||||
THREE.RenderableVertex.prototype.copy = function ( vertex ) {
|
||||
|
||||
this.positionWorld.copy( vertex.positionWorld );
|
||||
this.positionScreen.copy( vertex.positionScreen );
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
THREE.RenderableLine = function () {
|
||||
|
||||
this.id = 0;
|
||||
|
||||
this.v1 = new THREE.RenderableVertex();
|
||||
this.v2 = new THREE.RenderableVertex();
|
||||
|
||||
this.vertexColors = [ new THREE.Color(), new THREE.Color() ];
|
||||
this.material = null;
|
||||
|
||||
this.z = 0;
|
||||
this.renderOrder = 0;
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
THREE.RenderableSprite = function () {
|
||||
|
||||
this.id = 0;
|
||||
|
||||
this.object = null;
|
||||
|
||||
this.x = 0;
|
||||
this.y = 0;
|
||||
this.z = 0;
|
||||
|
||||
this.rotation = 0;
|
||||
this.scale = new THREE.Vector2();
|
||||
|
||||
this.material = null;
|
||||
this.renderOrder = 0;
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
THREE.Projector = function () {
|
||||
|
||||
var _object, _objectCount, _objectPool = [], _objectPoolLength = 0,
|
||||
_vertex, _vertexCount, _vertexPool = [], _vertexPoolLength = 0,
|
||||
_face, _faceCount, _facePool = [], _facePoolLength = 0,
|
||||
_line, _lineCount, _linePool = [], _linePoolLength = 0,
|
||||
_sprite, _spriteCount, _spritePool = [], _spritePoolLength = 0,
|
||||
|
||||
_renderData = { objects: [], lights: [], elements: [] },
|
||||
|
||||
_vector3 = new THREE.Vector3(),
|
||||
_vector4 = new THREE.Vector4(),
|
||||
|
||||
_clipBox = new THREE.Box3( new THREE.Vector3( - 1, - 1, - 1 ), new THREE.Vector3( 1, 1, 1 ) ),
|
||||
_boundingBox = new THREE.Box3(),
|
||||
_points3 = new Array( 3 ),
|
||||
_points4 = new Array( 4 ),
|
||||
|
||||
_viewMatrix = new THREE.Matrix4(),
|
||||
_viewProjectionMatrix = new THREE.Matrix4(),
|
||||
|
||||
_modelMatrix,
|
||||
_modelViewProjectionMatrix = new THREE.Matrix4(),
|
||||
|
||||
_normalMatrix = new THREE.Matrix3(),
|
||||
|
||||
_frustum = new THREE.Frustum(),
|
||||
|
||||
_clippedVertex1PositionScreen = new THREE.Vector4(),
|
||||
_clippedVertex2PositionScreen = new THREE.Vector4();
|
||||
|
||||
//
|
||||
|
||||
this.projectVector = function ( vector, camera ) {
|
||||
|
||||
console.warn( 'THREE.Projector: .projectVector() is now vector.project().' );
|
||||
vector.project( camera );
|
||||
|
||||
};
|
||||
|
||||
this.unprojectVector = function ( vector, camera ) {
|
||||
|
||||
console.warn( 'THREE.Projector: .unprojectVector() is now vector.unproject().' );
|
||||
vector.unproject( camera );
|
||||
|
||||
};
|
||||
|
||||
this.pickingRay = function ( vector, camera ) {
|
||||
|
||||
console.error( 'THREE.Projector: .pickingRay() is now raycaster.setFromCamera().' );
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
var RenderList = function () {
|
||||
|
||||
var normals = [];
|
||||
var uvs = [];
|
||||
|
||||
var object = null;
|
||||
var material = null;
|
||||
|
||||
var normalMatrix = new THREE.Matrix3();
|
||||
|
||||
function setObject( value ) {
|
||||
|
||||
object = value;
|
||||
material = object.material;
|
||||
|
||||
normalMatrix.getNormalMatrix( object.matrixWorld );
|
||||
|
||||
normals.length = 0;
|
||||
uvs.length = 0;
|
||||
|
||||
}
|
||||
|
||||
function projectVertex( vertex ) {
|
||||
|
||||
var position = vertex.position;
|
||||
var positionWorld = vertex.positionWorld;
|
||||
var positionScreen = vertex.positionScreen;
|
||||
|
||||
positionWorld.copy( position ).applyMatrix4( _modelMatrix );
|
||||
positionScreen.copy( positionWorld ).applyMatrix4( _viewProjectionMatrix );
|
||||
|
||||
var invW = 1 / positionScreen.w;
|
||||
|
||||
positionScreen.x *= invW;
|
||||
positionScreen.y *= invW;
|
||||
positionScreen.z *= invW;
|
||||
|
||||
vertex.visible = positionScreen.x >= - 1 && positionScreen.x <= 1 &&
|
||||
positionScreen.y >= - 1 && positionScreen.y <= 1 &&
|
||||
positionScreen.z >= - 1 && positionScreen.z <= 1;
|
||||
|
||||
}
|
||||
|
||||
function pushVertex( x, y, z ) {
|
||||
|
||||
_vertex = getNextVertexInPool();
|
||||
_vertex.position.set( x, y, z );
|
||||
|
||||
projectVertex( _vertex );
|
||||
|
||||
}
|
||||
|
||||
function pushNormal( x, y, z ) {
|
||||
|
||||
normals.push( x, y, z );
|
||||
|
||||
}
|
||||
|
||||
function pushUv( x, y ) {
|
||||
|
||||
uvs.push( x, y );
|
||||
|
||||
}
|
||||
|
||||
function checkTriangleVisibility( v1, v2, v3 ) {
|
||||
|
||||
if ( v1.visible === true || v2.visible === true || v3.visible === true ) return true;
|
||||
|
||||
_points3[ 0 ] = v1.positionScreen;
|
||||
_points3[ 1 ] = v2.positionScreen;
|
||||
_points3[ 2 ] = v3.positionScreen;
|
||||
|
||||
return _clipBox.intersectsBox( _boundingBox.setFromPoints( _points3 ) );
|
||||
|
||||
}
|
||||
|
||||
function checkBackfaceCulling( v1, v2, v3 ) {
|
||||
|
||||
return ( ( v3.positionScreen.x - v1.positionScreen.x ) *
|
||||
( v2.positionScreen.y - v1.positionScreen.y ) -
|
||||
( v3.positionScreen.y - v1.positionScreen.y ) *
|
||||
( v2.positionScreen.x - v1.positionScreen.x ) ) < 0;
|
||||
|
||||
}
|
||||
|
||||
function pushLine( a, b ) {
|
||||
|
||||
var v1 = _vertexPool[ a ];
|
||||
var v2 = _vertexPool[ b ];
|
||||
|
||||
_line = getNextLineInPool();
|
||||
|
||||
_line.id = object.id;
|
||||
_line.v1.copy( v1 );
|
||||
_line.v2.copy( v2 );
|
||||
_line.z = ( v1.positionScreen.z + v2.positionScreen.z ) / 2;
|
||||
_line.renderOrder = object.renderOrder;
|
||||
|
||||
_line.material = object.material;
|
||||
|
||||
_renderData.elements.push( _line );
|
||||
|
||||
}
|
||||
|
||||
function pushTriangle( a, b, c ) {
|
||||
|
||||
var v1 = _vertexPool[ a ];
|
||||
var v2 = _vertexPool[ b ];
|
||||
var v3 = _vertexPool[ c ];
|
||||
|
||||
if ( checkTriangleVisibility( v1, v2, v3 ) === false ) return;
|
||||
|
||||
if ( material.side === THREE.DoubleSide || checkBackfaceCulling( v1, v2, v3 ) === true ) {
|
||||
|
||||
_face = getNextFaceInPool();
|
||||
|
||||
_face.id = object.id;
|
||||
_face.v1.copy( v1 );
|
||||
_face.v2.copy( v2 );
|
||||
_face.v3.copy( v3 );
|
||||
_face.z = ( v1.positionScreen.z + v2.positionScreen.z + v3.positionScreen.z ) / 3;
|
||||
_face.renderOrder = object.renderOrder;
|
||||
|
||||
// use first vertex normal as face normal
|
||||
|
||||
_face.normalModel.fromArray( normals, a * 3 );
|
||||
_face.normalModel.applyMatrix3( normalMatrix ).normalize();
|
||||
|
||||
for ( var i = 0; i < 3; i ++ ) {
|
||||
|
||||
var normal = _face.vertexNormalsModel[ i ];
|
||||
normal.fromArray( normals, arguments[ i ] * 3 );
|
||||
normal.applyMatrix3( normalMatrix ).normalize();
|
||||
|
||||
var uv = _face.uvs[ i ];
|
||||
uv.fromArray( uvs, arguments[ i ] * 2 );
|
||||
|
||||
}
|
||||
|
||||
_face.vertexNormalsLength = 3;
|
||||
|
||||
_face.material = object.material;
|
||||
|
||||
_renderData.elements.push( _face );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return {
|
||||
setObject: setObject,
|
||||
projectVertex: projectVertex,
|
||||
checkTriangleVisibility: checkTriangleVisibility,
|
||||
checkBackfaceCulling: checkBackfaceCulling,
|
||||
pushVertex: pushVertex,
|
||||
pushNormal: pushNormal,
|
||||
pushUv: pushUv,
|
||||
pushLine: pushLine,
|
||||
pushTriangle: pushTriangle
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
var renderList = new RenderList();
|
||||
|
||||
this.projectScene = function ( scene, camera, sortObjects, sortElements ) {
|
||||
|
||||
_faceCount = 0;
|
||||
_lineCount = 0;
|
||||
_spriteCount = 0;
|
||||
|
||||
_renderData.elements.length = 0;
|
||||
|
||||
if ( scene.autoUpdate === true ) scene.updateMatrixWorld();
|
||||
if ( camera.parent === null ) camera.updateMatrixWorld();
|
||||
|
||||
_viewMatrix.copy( camera.matrixWorldInverse.getInverse( camera.matrixWorld ) );
|
||||
_viewProjectionMatrix.multiplyMatrices( camera.projectionMatrix, _viewMatrix );
|
||||
|
||||
_frustum.setFromMatrix( _viewProjectionMatrix );
|
||||
|
||||
//
|
||||
|
||||
_objectCount = 0;
|
||||
|
||||
_renderData.objects.length = 0;
|
||||
_renderData.lights.length = 0;
|
||||
|
||||
function addObject( object ) {
|
||||
|
||||
_object = getNextObjectInPool();
|
||||
_object.id = object.id;
|
||||
_object.object = object;
|
||||
|
||||
_vector3.setFromMatrixPosition( object.matrixWorld );
|
||||
_vector3.applyMatrix4( _viewProjectionMatrix );
|
||||
_object.z = _vector3.z;
|
||||
_object.renderOrder = object.renderOrder;
|
||||
|
||||
_renderData.objects.push( _object );
|
||||
|
||||
}
|
||||
|
||||
scene.traverseVisible( function ( object ) {
|
||||
|
||||
if ( object instanceof THREE.Light ) {
|
||||
|
||||
_renderData.lights.push( object );
|
||||
|
||||
} else if ( object instanceof THREE.Mesh || object instanceof THREE.Line ) {
|
||||
|
||||
if ( object.material.visible === false ) return;
|
||||
if ( object.frustumCulled === true && _frustum.intersectsObject( object ) === false ) return;
|
||||
|
||||
addObject( object );
|
||||
|
||||
} else if ( object instanceof THREE.Sprite ) {
|
||||
|
||||
if ( object.material.visible === false ) return;
|
||||
if ( object.frustumCulled === true && _frustum.intersectsSprite( object ) === false ) return;
|
||||
|
||||
addObject( object );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
if ( sortObjects === true ) {
|
||||
|
||||
_renderData.objects.sort( painterSort );
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
for ( var o = 0, ol = _renderData.objects.length; o < ol; o ++ ) {
|
||||
|
||||
var object = _renderData.objects[ o ].object;
|
||||
var geometry = object.geometry;
|
||||
|
||||
renderList.setObject( object );
|
||||
|
||||
_modelMatrix = object.matrixWorld;
|
||||
|
||||
_vertexCount = 0;
|
||||
|
||||
if ( object instanceof THREE.Mesh ) {
|
||||
|
||||
if ( geometry instanceof THREE.BufferGeometry ) {
|
||||
|
||||
var attributes = geometry.attributes;
|
||||
var groups = geometry.groups;
|
||||
|
||||
if ( attributes.position === undefined ) continue;
|
||||
|
||||
var positions = attributes.position.array;
|
||||
|
||||
for ( var i = 0, l = positions.length; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushVertex( positions[ i ], positions[ i + 1 ], positions[ i + 2 ] );
|
||||
|
||||
}
|
||||
|
||||
if ( attributes.normal !== undefined ) {
|
||||
|
||||
var normals = attributes.normal.array;
|
||||
|
||||
for ( var i = 0, l = normals.length; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushNormal( normals[ i ], normals[ i + 1 ], normals[ i + 2 ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( attributes.uv !== undefined ) {
|
||||
|
||||
var uvs = attributes.uv.array;
|
||||
|
||||
for ( var i = 0, l = uvs.length; i < l; i += 2 ) {
|
||||
|
||||
renderList.pushUv( uvs[ i ], uvs[ i + 1 ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( geometry.index !== null ) {
|
||||
|
||||
var indices = geometry.index.array;
|
||||
|
||||
if ( groups.length > 0 ) {
|
||||
|
||||
for ( var g = 0; g < groups.length; g ++ ) {
|
||||
|
||||
var group = groups[ g ];
|
||||
|
||||
for ( var i = group.start, l = group.start + group.count; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushTriangle( indices[ i ], indices[ i + 1 ], indices[ i + 2 ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
for ( var i = 0, l = indices.length; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushTriangle( indices[ i ], indices[ i + 1 ], indices[ i + 2 ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
for ( var i = 0, l = positions.length / 3; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushTriangle( i, i + 1, i + 2 );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if ( geometry instanceof THREE.Geometry ) {
|
||||
|
||||
var vertices = geometry.vertices;
|
||||
var faces = geometry.faces;
|
||||
var faceVertexUvs = geometry.faceVertexUvs[ 0 ];
|
||||
|
||||
_normalMatrix.getNormalMatrix( _modelMatrix );
|
||||
|
||||
var material = object.material;
|
||||
|
||||
var isFaceMaterial = material instanceof THREE.MultiMaterial;
|
||||
var objectMaterials = isFaceMaterial === true ? object.material : null;
|
||||
|
||||
for ( var v = 0, vl = vertices.length; v < vl; v ++ ) {
|
||||
|
||||
var vertex = vertices[ v ];
|
||||
|
||||
_vector3.copy( vertex );
|
||||
|
||||
if ( material.morphTargets === true ) {
|
||||
|
||||
var morphTargets = geometry.morphTargets;
|
||||
var morphInfluences = object.morphTargetInfluences;
|
||||
|
||||
for ( var t = 0, tl = morphTargets.length; t < tl; t ++ ) {
|
||||
|
||||
var influence = morphInfluences[ t ];
|
||||
|
||||
if ( influence === 0 ) continue;
|
||||
|
||||
var target = morphTargets[ t ];
|
||||
var targetVertex = target.vertices[ v ];
|
||||
|
||||
_vector3.x += ( targetVertex.x - vertex.x ) * influence;
|
||||
_vector3.y += ( targetVertex.y - vertex.y ) * influence;
|
||||
_vector3.z += ( targetVertex.z - vertex.z ) * influence;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
renderList.pushVertex( _vector3.x, _vector3.y, _vector3.z );
|
||||
|
||||
}
|
||||
|
||||
for ( var f = 0, fl = faces.length; f < fl; f ++ ) {
|
||||
|
||||
var face = faces[ f ];
|
||||
|
||||
material = isFaceMaterial === true
|
||||
? objectMaterials.materials[ face.materialIndex ]
|
||||
: object.material;
|
||||
|
||||
if ( material === undefined ) continue;
|
||||
|
||||
var side = material.side;
|
||||
|
||||
var v1 = _vertexPool[ face.a ];
|
||||
var v2 = _vertexPool[ face.b ];
|
||||
var v3 = _vertexPool[ face.c ];
|
||||
|
||||
if ( renderList.checkTriangleVisibility( v1, v2, v3 ) === false ) continue;
|
||||
|
||||
var visible = renderList.checkBackfaceCulling( v1, v2, v3 );
|
||||
|
||||
if ( side !== THREE.DoubleSide ) {
|
||||
|
||||
if ( side === THREE.FrontSide && visible === false ) continue;
|
||||
if ( side === THREE.BackSide && visible === true ) continue;
|
||||
|
||||
}
|
||||
|
||||
_face = getNextFaceInPool();
|
||||
|
||||
_face.id = object.id;
|
||||
_face.v1.copy( v1 );
|
||||
_face.v2.copy( v2 );
|
||||
_face.v3.copy( v3 );
|
||||
|
||||
_face.normalModel.copy( face.normal );
|
||||
|
||||
if ( visible === false && ( side === THREE.BackSide || side === THREE.DoubleSide ) ) {
|
||||
|
||||
_face.normalModel.negate();
|
||||
|
||||
}
|
||||
|
||||
_face.normalModel.applyMatrix3( _normalMatrix ).normalize();
|
||||
|
||||
var faceVertexNormals = face.vertexNormals;
|
||||
|
||||
for ( var n = 0, nl = Math.min( faceVertexNormals.length, 3 ); n < nl; n ++ ) {
|
||||
|
||||
var normalModel = _face.vertexNormalsModel[ n ];
|
||||
normalModel.copy( faceVertexNormals[ n ] );
|
||||
|
||||
if ( visible === false && ( side === THREE.BackSide || side === THREE.DoubleSide ) ) {
|
||||
|
||||
normalModel.negate();
|
||||
|
||||
}
|
||||
|
||||
normalModel.applyMatrix3( _normalMatrix ).normalize();
|
||||
|
||||
}
|
||||
|
||||
_face.vertexNormalsLength = faceVertexNormals.length;
|
||||
|
||||
var vertexUvs = faceVertexUvs[ f ];
|
||||
|
||||
if ( vertexUvs !== undefined ) {
|
||||
|
||||
for ( var u = 0; u < 3; u ++ ) {
|
||||
|
||||
_face.uvs[ u ].copy( vertexUvs[ u ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
_face.color = face.color;
|
||||
_face.material = material;
|
||||
|
||||
_face.z = ( v1.positionScreen.z + v2.positionScreen.z + v3.positionScreen.z ) / 3;
|
||||
_face.renderOrder = object.renderOrder;
|
||||
|
||||
_renderData.elements.push( _face );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if ( object instanceof THREE.Line ) {
|
||||
|
||||
if ( geometry instanceof THREE.BufferGeometry ) {
|
||||
|
||||
var attributes = geometry.attributes;
|
||||
|
||||
if ( attributes.position !== undefined ) {
|
||||
|
||||
var positions = attributes.position.array;
|
||||
|
||||
for ( var i = 0, l = positions.length; i < l; i += 3 ) {
|
||||
|
||||
renderList.pushVertex( positions[ i ], positions[ i + 1 ], positions[ i + 2 ] );
|
||||
|
||||
}
|
||||
|
||||
if ( geometry.index !== null ) {
|
||||
|
||||
var indices = geometry.index.array;
|
||||
|
||||
for ( var i = 0, l = indices.length; i < l; i += 2 ) {
|
||||
|
||||
renderList.pushLine( indices[ i ], indices[ i + 1 ] );
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
var step = object instanceof THREE.LineSegments ? 2 : 1;
|
||||
|
||||
for ( var i = 0, l = ( positions.length / 3 ) - 1; i < l; i += step ) {
|
||||
|
||||
renderList.pushLine( i, i + 1 );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if ( geometry instanceof THREE.Geometry ) {
|
||||
|
||||
_modelViewProjectionMatrix.multiplyMatrices( _viewProjectionMatrix, _modelMatrix );
|
||||
|
||||
var vertices = object.geometry.vertices;
|
||||
|
||||
if ( vertices.length === 0 ) continue;
|
||||
|
||||
v1 = getNextVertexInPool();
|
||||
v1.positionScreen.copy( vertices[ 0 ] ).applyMatrix4( _modelViewProjectionMatrix );
|
||||
|
||||
var step = object instanceof THREE.LineSegments ? 2 : 1;
|
||||
|
||||
for ( var v = 1, vl = vertices.length; v < vl; v ++ ) {
|
||||
|
||||
v1 = getNextVertexInPool();
|
||||
v1.positionScreen.copy( vertices[ v ] ).applyMatrix4( _modelViewProjectionMatrix );
|
||||
|
||||
if ( ( v + 1 ) % step > 0 ) continue;
|
||||
|
||||
v2 = _vertexPool[ _vertexCount - 2 ];
|
||||
|
||||
_clippedVertex1PositionScreen.copy( v1.positionScreen );
|
||||
_clippedVertex2PositionScreen.copy( v2.positionScreen );
|
||||
|
||||
if ( clipLine( _clippedVertex1PositionScreen, _clippedVertex2PositionScreen ) === true ) {
|
||||
|
||||
// Perform the perspective divide
|
||||
_clippedVertex1PositionScreen.multiplyScalar( 1 / _clippedVertex1PositionScreen.w );
|
||||
_clippedVertex2PositionScreen.multiplyScalar( 1 / _clippedVertex2PositionScreen.w );
|
||||
|
||||
_line = getNextLineInPool();
|
||||
|
||||
_line.id = object.id;
|
||||
_line.v1.positionScreen.copy( _clippedVertex1PositionScreen );
|
||||
_line.v2.positionScreen.copy( _clippedVertex2PositionScreen );
|
||||
|
||||
_line.z = Math.max( _clippedVertex1PositionScreen.z, _clippedVertex2PositionScreen.z );
|
||||
_line.renderOrder = object.renderOrder;
|
||||
|
||||
_line.material = object.material;
|
||||
|
||||
if ( object.material.vertexColors === THREE.VertexColors ) {
|
||||
|
||||
_line.vertexColors[ 0 ].copy( object.geometry.colors[ v ] );
|
||||
_line.vertexColors[ 1 ].copy( object.geometry.colors[ v - 1 ] );
|
||||
|
||||
}
|
||||
|
||||
_renderData.elements.push( _line );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} else if ( object instanceof THREE.Sprite ) {
|
||||
|
||||
_vector4.set( _modelMatrix.elements[ 12 ], _modelMatrix.elements[ 13 ], _modelMatrix.elements[ 14 ], 1 );
|
||||
_vector4.applyMatrix4( _viewProjectionMatrix );
|
||||
|
||||
var invW = 1 / _vector4.w;
|
||||
|
||||
_vector4.z *= invW;
|
||||
|
||||
if ( _vector4.z >= - 1 && _vector4.z <= 1 ) {
|
||||
|
||||
_sprite = getNextSpriteInPool();
|
||||
_sprite.id = object.id;
|
||||
_sprite.x = _vector4.x * invW;
|
||||
_sprite.y = _vector4.y * invW;
|
||||
_sprite.z = _vector4.z;
|
||||
_sprite.renderOrder = object.renderOrder;
|
||||
_sprite.object = object;
|
||||
|
||||
_sprite.rotation = object.rotation;
|
||||
|
||||
_sprite.scale.x = object.scale.x * Math.abs( _sprite.x - ( _vector4.x + camera.projectionMatrix.elements[ 0 ] ) / ( _vector4.w + camera.projectionMatrix.elements[ 12 ] ) );
|
||||
_sprite.scale.y = object.scale.y * Math.abs( _sprite.y - ( _vector4.y + camera.projectionMatrix.elements[ 5 ] ) / ( _vector4.w + camera.projectionMatrix.elements[ 13 ] ) );
|
||||
|
||||
_sprite.material = object.material;
|
||||
|
||||
_renderData.elements.push( _sprite );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( sortElements === true ) {
|
||||
|
||||
_renderData.elements.sort( painterSort );
|
||||
|
||||
}
|
||||
|
||||
return _renderData;
|
||||
|
||||
};
|
||||
|
||||
// Pools
|
||||
|
||||
function getNextObjectInPool() {
|
||||
|
||||
if ( _objectCount === _objectPoolLength ) {
|
||||
|
||||
var object = new THREE.RenderableObject();
|
||||
_objectPool.push( object );
|
||||
_objectPoolLength ++;
|
||||
_objectCount ++;
|
||||
return object;
|
||||
|
||||
}
|
||||
|
||||
return _objectPool[ _objectCount ++ ];
|
||||
|
||||
}
|
||||
|
||||
function getNextVertexInPool() {
|
||||
|
||||
if ( _vertexCount === _vertexPoolLength ) {
|
||||
|
||||
var vertex = new THREE.RenderableVertex();
|
||||
_vertexPool.push( vertex );
|
||||
_vertexPoolLength ++;
|
||||
_vertexCount ++;
|
||||
return vertex;
|
||||
|
||||
}
|
||||
|
||||
return _vertexPool[ _vertexCount ++ ];
|
||||
|
||||
}
|
||||
|
||||
function getNextFaceInPool() {
|
||||
|
||||
if ( _faceCount === _facePoolLength ) {
|
||||
|
||||
var face = new THREE.RenderableFace();
|
||||
_facePool.push( face );
|
||||
_facePoolLength ++;
|
||||
_faceCount ++;
|
||||
return face;
|
||||
|
||||
}
|
||||
|
||||
return _facePool[ _faceCount ++ ];
|
||||
|
||||
|
||||
}
|
||||
|
||||
function getNextLineInPool() {
|
||||
|
||||
if ( _lineCount === _linePoolLength ) {
|
||||
|
||||
var line = new THREE.RenderableLine();
|
||||
_linePool.push( line );
|
||||
_linePoolLength ++;
|
||||
_lineCount ++;
|
||||
return line;
|
||||
|
||||
}
|
||||
|
||||
return _linePool[ _lineCount ++ ];
|
||||
|
||||
}
|
||||
|
||||
function getNextSpriteInPool() {
|
||||
|
||||
if ( _spriteCount === _spritePoolLength ) {
|
||||
|
||||
var sprite = new THREE.RenderableSprite();
|
||||
_spritePool.push( sprite );
|
||||
_spritePoolLength ++;
|
||||
_spriteCount ++;
|
||||
return sprite;
|
||||
|
||||
}
|
||||
|
||||
return _spritePool[ _spriteCount ++ ];
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
function painterSort( a, b ) {
|
||||
|
||||
if ( a.renderOrder !== b.renderOrder ) {
|
||||
|
||||
return a.renderOrder - b.renderOrder;
|
||||
|
||||
} else if ( a.z !== b.z ) {
|
||||
|
||||
return b.z - a.z;
|
||||
|
||||
} else if ( a.id !== b.id ) {
|
||||
|
||||
return a.id - b.id;
|
||||
|
||||
} else {
|
||||
|
||||
return 0;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function clipLine( s1, s2 ) {
|
||||
|
||||
var alpha1 = 0, alpha2 = 1,
|
||||
|
||||
// Calculate the boundary coordinate of each vertex for the near and far clip planes,
|
||||
// Z = -1 and Z = +1, respectively.
|
||||
bc1near = s1.z + s1.w,
|
||||
bc2near = s2.z + s2.w,
|
||||
bc1far = - s1.z + s1.w,
|
||||
bc2far = - s2.z + s2.w;
|
||||
|
||||
if ( bc1near >= 0 && bc2near >= 0 && bc1far >= 0 && bc2far >= 0 ) {
|
||||
|
||||
// Both vertices lie entirely within all clip planes.
|
||||
return true;
|
||||
|
||||
} else if ( ( bc1near < 0 && bc2near < 0 ) || ( bc1far < 0 && bc2far < 0 ) ) {
|
||||
|
||||
// Both vertices lie entirely outside one of the clip planes.
|
||||
return false;
|
||||
|
||||
} else {
|
||||
|
||||
// The line segment spans at least one clip plane.
|
||||
|
||||
if ( bc1near < 0 ) {
|
||||
|
||||
// v1 lies outside the near plane, v2 inside
|
||||
alpha1 = Math.max( alpha1, bc1near / ( bc1near - bc2near ) );
|
||||
|
||||
} else if ( bc2near < 0 ) {
|
||||
|
||||
// v2 lies outside the near plane, v1 inside
|
||||
alpha2 = Math.min( alpha2, bc1near / ( bc1near - bc2near ) );
|
||||
|
||||
}
|
||||
|
||||
if ( bc1far < 0 ) {
|
||||
|
||||
// v1 lies outside the far plane, v2 inside
|
||||
alpha1 = Math.max( alpha1, bc1far / ( bc1far - bc2far ) );
|
||||
|
||||
} else if ( bc2far < 0 ) {
|
||||
|
||||
// v2 lies outside the far plane, v2 inside
|
||||
alpha2 = Math.min( alpha2, bc1far / ( bc1far - bc2far ) );
|
||||
|
||||
}
|
||||
|
||||
if ( alpha2 < alpha1 ) {
|
||||
|
||||
// The line segment spans two boundaries, but is outside both of them.
|
||||
// (This can't happen when we're only clipping against just near/far but good
|
||||
// to leave the check here for future usage if other clip planes are added.)
|
||||
return false;
|
||||
|
||||
} else {
|
||||
|
||||
// Update the s1 and s2 vertices to match the clipped line segment.
|
||||
s1.lerp( s2, alpha1 );
|
||||
s2.lerp( s1, 1 - alpha2 );
|
||||
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
289
node_modules/three/examples/js/renderers/RaytracingRenderer.js
generated
vendored
Normal file
289
node_modules/three/examples/js/renderers/RaytracingRenderer.js
generated
vendored
Normal file
@@ -0,0 +1,289 @@
|
||||
/**
|
||||
* RaytracingRenderer renders by raytracing it's scene. However, it does not
|
||||
* compute the pixels itself but it hands off and coordinates the taks for workers.
|
||||
* The workers compute the pixel values and this renderer simply paints it to the Canvas.
|
||||
*
|
||||
* @author zz85 / http://github.com/zz85
|
||||
*/
|
||||
|
||||
THREE.RaytracingRenderer = function ( parameters ) {
|
||||
|
||||
console.log( 'THREE.RaytracingRenderer', THREE.REVISION );
|
||||
|
||||
parameters = parameters || {};
|
||||
|
||||
var scope = this;
|
||||
var pool = [];
|
||||
var renderering = false;
|
||||
|
||||
var canvas = document.createElement( 'canvas' );
|
||||
var context = canvas.getContext( '2d', {
|
||||
alpha: parameters.alpha === true
|
||||
} );
|
||||
|
||||
var maxRecursionDepth = 3;
|
||||
|
||||
var canvasWidth, canvasHeight;
|
||||
var canvasWidthHalf, canvasHeightHalf;
|
||||
|
||||
var clearColor = new THREE.Color( 0x000000 );
|
||||
|
||||
this.domElement = canvas;
|
||||
|
||||
this.autoClear = true;
|
||||
|
||||
var workers = parameters.workers;
|
||||
var blockSize = parameters.blockSize || 64;
|
||||
this.randomize = parameters.randomize;
|
||||
|
||||
var toRender = [], workerId = 0, sceneId = 0;
|
||||
|
||||
console.log( '%cSpinning off ' + workers + ' Workers ', 'font-size: 20px; background: black; color: white; font-family: monospace;' );
|
||||
|
||||
this.setWorkers = function( w ) {
|
||||
|
||||
workers = w || navigator.hardwareConcurrency || 4;
|
||||
|
||||
while ( pool.length < workers ) {
|
||||
var worker = new Worker( parameters.workerPath );
|
||||
worker.id = workerId++;
|
||||
|
||||
worker.onmessage = function( e ) {
|
||||
|
||||
var data = e.data;
|
||||
|
||||
if ( ! data ) return;
|
||||
|
||||
if ( data.blockSize && sceneId == data.sceneId ) { // we match sceneId here to be sure
|
||||
|
||||
var imagedata = new ImageData( new Uint8ClampedArray( data.data ), data.blockSize, data.blockSize );
|
||||
context.putImageData( imagedata, data.blockX, data.blockY );
|
||||
|
||||
// completed
|
||||
|
||||
console.log( 'Worker ' + this.id, data.time / 1000, ( Date.now() - reallyThen ) / 1000 + ' s' );
|
||||
|
||||
if ( pool.length > workers ) {
|
||||
|
||||
pool.splice( pool.indexOf( this ), 1 );
|
||||
return this.terminate();
|
||||
|
||||
}
|
||||
|
||||
renderNext( this );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
worker.color = new THREE.Color().setHSL( Math.random() , 0.8, 0.8 ).getHexString();
|
||||
pool.push( worker );
|
||||
|
||||
if ( renderering ) {
|
||||
|
||||
updateSettings( worker );
|
||||
|
||||
worker.postMessage( {
|
||||
scene: sceneJSON,
|
||||
camera: cameraJSON,
|
||||
annex: materials,
|
||||
sceneId: sceneId
|
||||
} );
|
||||
|
||||
renderNext( worker );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( ! renderering ) {
|
||||
|
||||
while ( pool.length > workers ) {
|
||||
|
||||
pool.pop().terminate();
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.setWorkers( workers );
|
||||
|
||||
this.setClearColor = function ( color, alpha ) {
|
||||
|
||||
clearColor.set( color );
|
||||
|
||||
};
|
||||
|
||||
this.setPixelRatio = function () {};
|
||||
|
||||
this.setSize = function ( width, height ) {
|
||||
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
canvasWidth = canvas.width;
|
||||
canvasHeight = canvas.height;
|
||||
|
||||
canvasWidthHalf = Math.floor( canvasWidth / 2 );
|
||||
canvasHeightHalf = Math.floor( canvasHeight / 2 );
|
||||
|
||||
context.fillStyle = 'white';
|
||||
|
||||
pool.forEach( updateSettings );
|
||||
|
||||
};
|
||||
|
||||
this.setSize( canvas.width, canvas.height );
|
||||
|
||||
this.clear = function () {
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
var totalBlocks, xblocks, yblocks;
|
||||
|
||||
function updateSettings( worker ) {
|
||||
|
||||
worker.postMessage( {
|
||||
|
||||
init: [ canvasWidth, canvasHeight ],
|
||||
worker: worker.id,
|
||||
// workers: pool.length,
|
||||
blockSize: blockSize
|
||||
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
function renderNext( worker ) {
|
||||
if ( ! toRender.length ) {
|
||||
|
||||
renderering = false;
|
||||
return scope.dispatchEvent( { type: "complete" } );
|
||||
|
||||
}
|
||||
|
||||
var current = toRender.pop();
|
||||
|
||||
var blockX = ( current % xblocks ) * blockSize;
|
||||
var blockY = ( current / xblocks | 0 ) * blockSize;
|
||||
|
||||
worker.postMessage( {
|
||||
render: true,
|
||||
x: blockX,
|
||||
y: blockY,
|
||||
sceneId: sceneId
|
||||
} );
|
||||
|
||||
context.fillStyle = '#' + worker.color;
|
||||
|
||||
context.fillRect( blockX, blockY, blockSize, blockSize );
|
||||
|
||||
}
|
||||
|
||||
var materials = {};
|
||||
|
||||
var sceneJSON, cameraJSON, reallyThen;
|
||||
|
||||
// additional properties that were not serialize automatically
|
||||
|
||||
var _annex = {
|
||||
|
||||
mirror: 1,
|
||||
reflectivity: 1,
|
||||
refractionRatio: 1,
|
||||
glass: 1
|
||||
|
||||
};
|
||||
|
||||
function serializeObject( o ) {
|
||||
|
||||
var mat = o.material;
|
||||
|
||||
if ( ! mat || mat.uuid in materials ) return;
|
||||
|
||||
var props = {};
|
||||
for ( var m in _annex ) {
|
||||
|
||||
if ( mat[ m ] !== undefined ) {
|
||||
|
||||
props[ m ] = mat[ m ];
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
materials[ mat.uuid ] = props;
|
||||
}
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
renderering = true;
|
||||
|
||||
// update scene graph
|
||||
|
||||
if ( scene.autoUpdate === true ) scene.updateMatrixWorld();
|
||||
|
||||
// update camera matrices
|
||||
|
||||
if ( camera.parent === null ) camera.updateMatrixWorld();
|
||||
|
||||
|
||||
sceneJSON = scene.toJSON();
|
||||
cameraJSON = camera.toJSON();
|
||||
++ sceneId;
|
||||
|
||||
scene.traverse( serializeObject );
|
||||
|
||||
pool.forEach( function( worker ) {
|
||||
|
||||
worker.postMessage( {
|
||||
scene: sceneJSON,
|
||||
camera: cameraJSON,
|
||||
annex: materials,
|
||||
sceneId: sceneId
|
||||
} );
|
||||
} );
|
||||
|
||||
context.clearRect( 0, 0, canvasWidth, canvasHeight );
|
||||
reallyThen = Date.now();
|
||||
|
||||
xblocks = Math.ceil( canvasWidth / blockSize );
|
||||
yblocks = Math.ceil( canvasHeight / blockSize );
|
||||
totalBlocks = xblocks * yblocks;
|
||||
|
||||
toRender = [];
|
||||
|
||||
for ( var i = 0; i < totalBlocks; i ++ ) {
|
||||
|
||||
toRender.push( i );
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Randomize painting :)
|
||||
|
||||
if ( scope.randomize ) {
|
||||
|
||||
for ( var i = 0; i < totalBlocks; i ++ ) {
|
||||
|
||||
var swap = Math.random() * totalBlocks | 0;
|
||||
var tmp = toRender[ swap ];
|
||||
toRender[ swap ] = toRender[ i ];
|
||||
toRender[ i ] = tmp;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
pool.forEach( renderNext );
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
Object.assign( THREE.RaytracingRenderer.prototype, THREE.EventDispatcher.prototype );
|
||||
567
node_modules/three/examples/js/renderers/RaytracingWorker.js
generated
vendored
Normal file
567
node_modules/three/examples/js/renderers/RaytracingWorker.js
generated
vendored
Normal file
@@ -0,0 +1,567 @@
|
||||
var worker;
|
||||
var BLOCK = 128;
|
||||
var startX, startY, division, completed = 0;
|
||||
|
||||
var scene, camera, renderer, loader, sceneId;
|
||||
|
||||
importScripts( '../../../build/three.js' );
|
||||
|
||||
|
||||
self.onmessage = function( e ) {
|
||||
|
||||
var data = e.data;
|
||||
if ( ! data ) return;
|
||||
|
||||
if ( data.init ) {
|
||||
|
||||
var
|
||||
width = data.init[ 0 ],
|
||||
height = data.init[ 1 ];
|
||||
|
||||
worker = data.worker;
|
||||
BLOCK = data.blockSize;
|
||||
|
||||
if ( ! renderer ) renderer = new THREE.RaytracingRendererWorker();
|
||||
if ( ! loader ) loader = new THREE.ObjectLoader();
|
||||
|
||||
renderer.setSize( width, height );
|
||||
|
||||
// TODO fix passing maxRecursionDepth as parameter.
|
||||
// if (data.maxRecursionDepth) maxRecursionDepth = data.maxRecursionDepth;
|
||||
|
||||
completed = 0;
|
||||
|
||||
}
|
||||
|
||||
if ( data.scene ) {
|
||||
|
||||
scene = loader.parse( data.scene );
|
||||
camera = loader.parse( data.camera );
|
||||
|
||||
var meta = data.annex;
|
||||
scene.traverse( function( o ) {
|
||||
|
||||
if ( o instanceof THREE.PointLight ) {
|
||||
|
||||
o.physicalAttenuation = true;
|
||||
|
||||
}
|
||||
|
||||
var mat = o.material;
|
||||
|
||||
if (!mat) return;
|
||||
|
||||
var material = meta[ mat.uuid ];
|
||||
for (var m in material) {
|
||||
|
||||
mat[ m ] = material[ m ];
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
sceneId = data.sceneId;
|
||||
}
|
||||
|
||||
if ( data.render && scene && camera ) {
|
||||
|
||||
startX = data.x;
|
||||
startY = data.y;
|
||||
renderer.render( scene, camera );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* DOM-less version of Raytracing Renderer
|
||||
* @author mrdoob / http://mrdoob.com/
|
||||
* @author alteredq / http://alteredqualia.com/
|
||||
* @author zz95 / http://github.com/zz85
|
||||
*/
|
||||
|
||||
THREE.RaytracingRendererWorker = function ( parameters ) {
|
||||
|
||||
console.log( 'THREE.RaytracingRendererWorker', THREE.REVISION );
|
||||
|
||||
parameters = parameters || {};
|
||||
|
||||
var scope = this;
|
||||
|
||||
var maxRecursionDepth = 3;
|
||||
|
||||
var canvasWidth, canvasHeight;
|
||||
var canvasWidthHalf, canvasHeightHalf;
|
||||
var origin = new THREE.Vector3();
|
||||
var direction = new THREE.Vector3();
|
||||
|
||||
var cameraPosition = new THREE.Vector3();
|
||||
|
||||
var raycaster = new THREE.Raycaster( origin, direction );
|
||||
var raycasterLight = new THREE.Raycaster();
|
||||
|
||||
var perspective;
|
||||
var modelViewMatrix = new THREE.Matrix4();
|
||||
var cameraNormalMatrix = new THREE.Matrix3();
|
||||
|
||||
var objects;
|
||||
var lights = [];
|
||||
var cache = {};
|
||||
|
||||
this.setSize = function ( width, height ) {
|
||||
|
||||
canvasWidth = width;
|
||||
canvasHeight = height;
|
||||
|
||||
canvasWidthHalf = Math.floor( canvasWidth / 2 );
|
||||
canvasHeightHalf = Math.floor( canvasHeight / 2 );
|
||||
|
||||
};
|
||||
|
||||
//
|
||||
|
||||
var spawnRay = ( function () {
|
||||
|
||||
var diffuseColor = new THREE.Color();
|
||||
var specularColor = new THREE.Color();
|
||||
var lightColor = new THREE.Color();
|
||||
var schlick = new THREE.Color();
|
||||
|
||||
var lightContribution = new THREE.Color();
|
||||
|
||||
var eyeVector = new THREE.Vector3();
|
||||
var lightVector = new THREE.Vector3();
|
||||
var normalVector = new THREE.Vector3();
|
||||
var halfVector = new THREE.Vector3();
|
||||
|
||||
var localPoint = new THREE.Vector3();
|
||||
var reflectionVector = new THREE.Vector3();
|
||||
|
||||
var tmpVec = new THREE.Vector3();
|
||||
|
||||
var tmpColor = [];
|
||||
|
||||
for ( var i = 0; i < maxRecursionDepth; i ++ ) {
|
||||
|
||||
tmpColor[ i ] = new THREE.Color();
|
||||
|
||||
}
|
||||
|
||||
return function spawnRay( rayOrigin, rayDirection, outputColor, recursionDepth ) {
|
||||
|
||||
var ray = raycaster.ray;
|
||||
|
||||
ray.origin = rayOrigin;
|
||||
ray.direction = rayDirection;
|
||||
|
||||
//
|
||||
|
||||
var rayLight = raycasterLight.ray;
|
||||
|
||||
//
|
||||
|
||||
outputColor.setRGB( 0, 0, 0 );
|
||||
|
||||
//
|
||||
|
||||
var intersections = raycaster.intersectObjects( objects, true );
|
||||
|
||||
// ray didn't find anything
|
||||
// (here should come setting of background color?)
|
||||
|
||||
if ( intersections.length === 0 ) {
|
||||
|
||||
return;
|
||||
|
||||
}
|
||||
|
||||
// ray hit
|
||||
|
||||
var intersection = intersections[ 0 ];
|
||||
|
||||
var point = intersection.point;
|
||||
var object = intersection.object;
|
||||
var material = object.material;
|
||||
var face = intersection.face;
|
||||
|
||||
var vertices = object.geometry.vertices;
|
||||
|
||||
//
|
||||
|
||||
var _object = cache[ object.id ];
|
||||
|
||||
localPoint.copy( point ).applyMatrix4( _object.inverseMatrix );
|
||||
eyeVector.subVectors( raycaster.ray.origin, point ).normalize();
|
||||
|
||||
// resolve pixel diffuse color
|
||||
|
||||
if ( material instanceof THREE.MeshLambertMaterial ||
|
||||
material instanceof THREE.MeshPhongMaterial ||
|
||||
material instanceof THREE.MeshBasicMaterial ) {
|
||||
|
||||
diffuseColor.copyGammaToLinear( material.color );
|
||||
|
||||
} else {
|
||||
|
||||
diffuseColor.setRGB( 1, 1, 1 );
|
||||
|
||||
}
|
||||
|
||||
if ( material.vertexColors === THREE.FaceColors ) {
|
||||
|
||||
diffuseColor.multiply( face.color );
|
||||
|
||||
}
|
||||
|
||||
// compute light shading
|
||||
|
||||
rayLight.origin.copy( point );
|
||||
|
||||
if ( material instanceof THREE.MeshBasicMaterial ) {
|
||||
|
||||
for ( var i = 0, l = lights.length; i < l; i ++ ) {
|
||||
|
||||
var light = lights[ i ];
|
||||
|
||||
lightVector.setFromMatrixPosition( light.matrixWorld );
|
||||
lightVector.sub( point );
|
||||
|
||||
rayLight.direction.copy( lightVector ).normalize();
|
||||
|
||||
var intersections = raycasterLight.intersectObjects( objects, true );
|
||||
|
||||
// point in shadow
|
||||
|
||||
if ( intersections.length > 0 ) continue;
|
||||
|
||||
// point visible
|
||||
|
||||
outputColor.add( diffuseColor );
|
||||
|
||||
}
|
||||
|
||||
} else if ( material instanceof THREE.MeshLambertMaterial ||
|
||||
material instanceof THREE.MeshPhongMaterial ) {
|
||||
|
||||
var normalComputed = false;
|
||||
|
||||
for ( var i = 0, l = lights.length; i < l; i ++ ) {
|
||||
|
||||
var light = lights[ i ];
|
||||
|
||||
lightColor.copyGammaToLinear( light.color );
|
||||
|
||||
lightVector.setFromMatrixPosition( light.matrixWorld );
|
||||
lightVector.sub( point );
|
||||
|
||||
rayLight.direction.copy( lightVector ).normalize();
|
||||
|
||||
var intersections = raycasterLight.intersectObjects( objects, true );
|
||||
|
||||
// point in shadow
|
||||
|
||||
if ( intersections.length > 0 ) continue;
|
||||
|
||||
// point lit
|
||||
|
||||
if ( normalComputed === false ) {
|
||||
|
||||
// the same normal can be reused for all lights
|
||||
// (should be possible to cache even more)
|
||||
|
||||
computePixelNormal( normalVector, localPoint, material.shading, face, vertices );
|
||||
normalVector.applyMatrix3( _object.normalMatrix ).normalize();
|
||||
|
||||
normalComputed = true;
|
||||
|
||||
}
|
||||
|
||||
// compute attenuation
|
||||
|
||||
var attenuation = 1.0;
|
||||
|
||||
if ( light.physicalAttenuation === true ) {
|
||||
|
||||
attenuation = lightVector.length();
|
||||
attenuation = 1.0 / ( attenuation * attenuation );
|
||||
|
||||
}
|
||||
|
||||
lightVector.normalize();
|
||||
|
||||
// compute diffuse
|
||||
|
||||
var dot = Math.max( normalVector.dot( lightVector ), 0 );
|
||||
var diffuseIntensity = dot * light.intensity;
|
||||
|
||||
lightContribution.copy( diffuseColor );
|
||||
lightContribution.multiply( lightColor );
|
||||
lightContribution.multiplyScalar( diffuseIntensity * attenuation );
|
||||
|
||||
outputColor.add( lightContribution );
|
||||
|
||||
// compute specular
|
||||
|
||||
if ( material instanceof THREE.MeshPhongMaterial ) {
|
||||
|
||||
halfVector.addVectors( lightVector, eyeVector ).normalize();
|
||||
|
||||
var dotNormalHalf = Math.max( normalVector.dot( halfVector ), 0.0 );
|
||||
var specularIntensity = Math.max( Math.pow( dotNormalHalf, material.shininess ), 0.0 ) * diffuseIntensity;
|
||||
|
||||
var specularNormalization = ( material.shininess + 2.0 ) / 8.0;
|
||||
|
||||
specularColor.copyGammaToLinear( material.specular );
|
||||
|
||||
var alpha = Math.pow( Math.max( 1.0 - lightVector.dot( halfVector ), 0.0 ), 5.0 );
|
||||
|
||||
schlick.r = specularColor.r + ( 1.0 - specularColor.r ) * alpha;
|
||||
schlick.g = specularColor.g + ( 1.0 - specularColor.g ) * alpha;
|
||||
schlick.b = specularColor.b + ( 1.0 - specularColor.b ) * alpha;
|
||||
|
||||
lightContribution.copy( schlick );
|
||||
|
||||
lightContribution.multiply( lightColor );
|
||||
lightContribution.multiplyScalar( specularNormalization * specularIntensity * attenuation );
|
||||
outputColor.add( lightContribution );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// reflection / refraction
|
||||
|
||||
var reflectivity = material.reflectivity;
|
||||
|
||||
if ( ( material.mirror || material.glass ) && reflectivity > 0 && recursionDepth < maxRecursionDepth ) {
|
||||
|
||||
if ( material.mirror ) {
|
||||
|
||||
reflectionVector.copy( rayDirection );
|
||||
reflectionVector.reflect( normalVector );
|
||||
|
||||
} else if ( material.glass ) {
|
||||
|
||||
var eta = material.refractionRatio;
|
||||
|
||||
var dotNI = rayDirection.dot( normalVector );
|
||||
var k = 1.0 - eta * eta * ( 1.0 - dotNI * dotNI );
|
||||
|
||||
if ( k < 0.0 ) {
|
||||
|
||||
reflectionVector.set( 0, 0, 0 );
|
||||
|
||||
} else {
|
||||
|
||||
reflectionVector.copy( rayDirection );
|
||||
reflectionVector.multiplyScalar( eta );
|
||||
|
||||
var alpha = eta * dotNI + Math.sqrt( k );
|
||||
tmpVec.copy( normalVector );
|
||||
tmpVec.multiplyScalar( alpha );
|
||||
reflectionVector.sub( tmpVec );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var theta = Math.max( eyeVector.dot( normalVector ), 0.0 );
|
||||
var rf0 = reflectivity;
|
||||
var fresnel = rf0 + ( 1.0 - rf0 ) * Math.pow( ( 1.0 - theta ), 5.0 );
|
||||
|
||||
var weight = fresnel;
|
||||
|
||||
var zColor = tmpColor[ recursionDepth ];
|
||||
|
||||
spawnRay( point, reflectionVector, zColor, recursionDepth + 1 );
|
||||
|
||||
if ( material.specular !== undefined ) {
|
||||
|
||||
zColor.multiply( material.specular );
|
||||
|
||||
}
|
||||
|
||||
zColor.multiplyScalar( weight );
|
||||
outputColor.multiplyScalar( 1 - weight );
|
||||
outputColor.add( zColor );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
var computePixelNormal = ( function () {
|
||||
|
||||
var tmpVec1 = new THREE.Vector3();
|
||||
var tmpVec2 = new THREE.Vector3();
|
||||
var tmpVec3 = new THREE.Vector3();
|
||||
|
||||
return function computePixelNormal( outputVector, point, shading, face, vertices ) {
|
||||
|
||||
var faceNormal = face.normal;
|
||||
var vertexNormals = face.vertexNormals;
|
||||
|
||||
if ( shading === THREE.FlatShading ) {
|
||||
|
||||
outputVector.copy( faceNormal );
|
||||
|
||||
} else if ( shading === THREE.SmoothShading ) {
|
||||
|
||||
// compute barycentric coordinates
|
||||
|
||||
var vA = vertices[ face.a ];
|
||||
var vB = vertices[ face.b ];
|
||||
var vC = vertices[ face.c ];
|
||||
|
||||
tmpVec3.crossVectors( tmpVec1.subVectors( vB, vA ), tmpVec2.subVectors( vC, vA ) );
|
||||
var areaABC = faceNormal.dot( tmpVec3 );
|
||||
|
||||
tmpVec3.crossVectors( tmpVec1.subVectors( vB, point ), tmpVec2.subVectors( vC, point ) );
|
||||
var areaPBC = faceNormal.dot( tmpVec3 );
|
||||
var a = areaPBC / areaABC;
|
||||
|
||||
tmpVec3.crossVectors( tmpVec1.subVectors( vC, point ), tmpVec2.subVectors( vA, point ) );
|
||||
var areaPCA = faceNormal.dot( tmpVec3 );
|
||||
var b = areaPCA / areaABC;
|
||||
|
||||
var c = 1.0 - a - b;
|
||||
|
||||
// compute interpolated vertex normal
|
||||
|
||||
tmpVec1.copy( vertexNormals[ 0 ] );
|
||||
tmpVec1.multiplyScalar( a );
|
||||
|
||||
tmpVec2.copy( vertexNormals[ 1 ] );
|
||||
tmpVec2.multiplyScalar( b );
|
||||
|
||||
tmpVec3.copy( vertexNormals[ 2 ] );
|
||||
tmpVec3.multiplyScalar( c );
|
||||
|
||||
outputVector.addVectors( tmpVec1, tmpVec2 );
|
||||
outputVector.add( tmpVec3 );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
var renderBlock = ( function () {
|
||||
|
||||
var blockSize = BLOCK;
|
||||
|
||||
var data = new Uint8ClampedArray( blockSize * blockSize * 4 );
|
||||
|
||||
var pixelColor = new THREE.Color();
|
||||
|
||||
return function renderBlock( blockX, blockY ) {
|
||||
|
||||
var index = 0;
|
||||
|
||||
for ( var y = 0; y < blockSize; y ++ ) {
|
||||
|
||||
for ( var x = 0; x < blockSize; x ++, index += 4 ) {
|
||||
|
||||
// spawn primary ray at pixel position
|
||||
|
||||
origin.copy( cameraPosition );
|
||||
|
||||
direction.set( x + blockX - canvasWidthHalf, - ( y + blockY - canvasHeightHalf ), - perspective );
|
||||
direction.applyMatrix3( cameraNormalMatrix ).normalize();
|
||||
|
||||
spawnRay( origin, direction, pixelColor, 0 );
|
||||
|
||||
// convert from linear to gamma
|
||||
|
||||
data[ index ] = Math.sqrt( pixelColor.r ) * 255;
|
||||
data[ index + 1 ] = Math.sqrt( pixelColor.g ) * 255;
|
||||
data[ index + 2 ] = Math.sqrt( pixelColor.b ) * 255;
|
||||
data[ index + 3 ] = 255;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Use transferable objects! :)
|
||||
self.postMessage( {
|
||||
data: data.buffer,
|
||||
blockX: blockX,
|
||||
blockY: blockY,
|
||||
blockSize: blockSize,
|
||||
sceneId: sceneId,
|
||||
time: Date.now() - reallyThen, // time for this renderer
|
||||
}, [ data.buffer ] );
|
||||
|
||||
data = new Uint8ClampedArray( blockSize * blockSize * 4 );
|
||||
|
||||
// OK Done!
|
||||
completed ++;
|
||||
|
||||
};
|
||||
|
||||
}() );
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
reallyThen = Date.now()
|
||||
|
||||
// update scene graph
|
||||
|
||||
if ( scene.autoUpdate === true ) scene.updateMatrixWorld();
|
||||
|
||||
// update camera matrices
|
||||
|
||||
if ( camera.parent === null ) camera.updateMatrixWorld();
|
||||
|
||||
camera.matrixWorldInverse.getInverse( camera.matrixWorld );
|
||||
cameraPosition.setFromMatrixPosition( camera.matrixWorld );
|
||||
|
||||
//
|
||||
|
||||
cameraNormalMatrix.getNormalMatrix( camera.matrixWorld );
|
||||
origin.copy( cameraPosition );
|
||||
|
||||
perspective = 0.5 / Math.tan( THREE.Math.degToRad( camera.fov * 0.5 ) ) * canvasHeight;
|
||||
|
||||
objects = scene.children;
|
||||
|
||||
// collect lights and set up object matrices
|
||||
|
||||
lights.length = 0;
|
||||
|
||||
scene.traverse( function ( object ) {
|
||||
|
||||
if ( object instanceof THREE.Light ) {
|
||||
|
||||
lights.push( object );
|
||||
|
||||
}
|
||||
|
||||
if ( cache[ object.id ] === undefined ) {
|
||||
|
||||
cache[ object.id ] = {
|
||||
normalMatrix: new THREE.Matrix3(),
|
||||
inverseMatrix: new THREE.Matrix4()
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
modelViewMatrix.multiplyMatrices( camera.matrixWorldInverse, object.matrixWorld );
|
||||
|
||||
var _object = cache[ object.id ];
|
||||
|
||||
_object.normalMatrix.getNormalMatrix( modelViewMatrix );
|
||||
_object.inverseMatrix.getInverse( object.matrixWorld );
|
||||
|
||||
} );
|
||||
|
||||
renderBlock( startX, startY );
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
Object.assign( THREE.RaytracingRendererWorker.prototype, THREE.EventDispatcher.prototype );
|
||||
483
node_modules/three/examples/js/renderers/SVGRenderer.js
generated
vendored
Normal file
483
node_modules/three/examples/js/renderers/SVGRenderer.js
generated
vendored
Normal file
@@ -0,0 +1,483 @@
|
||||
/**
|
||||
* @author mrdoob / http://mrdoob.com/
|
||||
*/
|
||||
|
||||
THREE.SVGObject = function ( node ) {
|
||||
|
||||
THREE.Object3D.call( this );
|
||||
|
||||
this.node = node;
|
||||
|
||||
};
|
||||
|
||||
THREE.SVGObject.prototype = Object.create( THREE.Object3D.prototype );
|
||||
THREE.SVGObject.prototype.constructor = THREE.SVGObject;
|
||||
|
||||
THREE.SVGRenderer = function () {
|
||||
|
||||
console.log( 'THREE.SVGRenderer', THREE.REVISION );
|
||||
|
||||
var _this = this,
|
||||
_renderData, _elements, _lights,
|
||||
_projector = new THREE.Projector(),
|
||||
_svg = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' ),
|
||||
_svgWidth, _svgHeight, _svgWidthHalf, _svgHeightHalf,
|
||||
|
||||
_v1, _v2, _v3, _v4,
|
||||
|
||||
_clipBox = new THREE.Box2(),
|
||||
_elemBox = new THREE.Box2(),
|
||||
|
||||
_color = new THREE.Color(),
|
||||
_diffuseColor = new THREE.Color(),
|
||||
_ambientLight = new THREE.Color(),
|
||||
_directionalLights = new THREE.Color(),
|
||||
_pointLights = new THREE.Color(),
|
||||
_clearColor = new THREE.Color(),
|
||||
_clearAlpha = 1,
|
||||
|
||||
_vector3 = new THREE.Vector3(), // Needed for PointLight
|
||||
_centroid = new THREE.Vector3(),
|
||||
_normal = new THREE.Vector3(),
|
||||
_normalViewMatrix = new THREE.Matrix3(),
|
||||
|
||||
_viewMatrix = new THREE.Matrix4(),
|
||||
_viewProjectionMatrix = new THREE.Matrix4(),
|
||||
|
||||
_svgPathPool = [], _svgLinePool = [], _svgRectPool = [],
|
||||
_svgNode, _pathCount = 0, _lineCount = 0, _rectCount = 0,
|
||||
_quality = 1;
|
||||
|
||||
this.domElement = _svg;
|
||||
|
||||
this.autoClear = true;
|
||||
this.sortObjects = true;
|
||||
this.sortElements = true;
|
||||
|
||||
this.info = {
|
||||
|
||||
render: {
|
||||
|
||||
vertices: 0,
|
||||
faces: 0
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
this.setQuality = function( quality ) {
|
||||
|
||||
switch ( quality ) {
|
||||
|
||||
case "high": _quality = 1; break;
|
||||
case "low": _quality = 0; break;
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// WebGLRenderer compatibility
|
||||
|
||||
this.supportsVertexTextures = function () {};
|
||||
this.setFaceCulling = function () {};
|
||||
|
||||
this.setClearColor = function ( color, alpha ) {
|
||||
|
||||
_clearColor.set( color );
|
||||
_clearAlpha = alpha !== undefined ? alpha : 1;
|
||||
|
||||
};
|
||||
|
||||
this.setPixelRatio = function () {};
|
||||
|
||||
this.setSize = function( width, height ) {
|
||||
|
||||
_svgWidth = width; _svgHeight = height;
|
||||
_svgWidthHalf = _svgWidth / 2; _svgHeightHalf = _svgHeight / 2;
|
||||
|
||||
_svg.setAttribute( 'viewBox', ( - _svgWidthHalf ) + ' ' + ( - _svgHeightHalf ) + ' ' + _svgWidth + ' ' + _svgHeight );
|
||||
_svg.setAttribute( 'width', _svgWidth );
|
||||
_svg.setAttribute( 'height', _svgHeight );
|
||||
|
||||
_clipBox.min.set( - _svgWidthHalf, - _svgHeightHalf );
|
||||
_clipBox.max.set( _svgWidthHalf, _svgHeightHalf );
|
||||
|
||||
};
|
||||
|
||||
function removeChildNodes() {
|
||||
|
||||
_pathCount = 0;
|
||||
_lineCount = 0;
|
||||
_rectCount = 0;
|
||||
|
||||
while ( _svg.childNodes.length > 0 ) {
|
||||
|
||||
_svg.removeChild( _svg.childNodes[ 0 ] );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
this.clear = function () {
|
||||
|
||||
removeChildNodes();
|
||||
_svg.style.backgroundColor = 'rgba(' + Math.floor( _clearColor.r * 255 ) + ',' + Math.floor( _clearColor.g * 255 ) + ',' + Math.floor( _clearColor.b * 255 ) + ',' + _clearAlpha + ')';
|
||||
|
||||
};
|
||||
|
||||
this.render = function ( scene, camera ) {
|
||||
|
||||
if ( camera instanceof THREE.Camera === false ) {
|
||||
|
||||
console.error( 'THREE.SVGRenderer.render: camera is not an instance of THREE.Camera.' );
|
||||
return;
|
||||
|
||||
}
|
||||
|
||||
var background = scene.background;
|
||||
|
||||
if ( background && background.isColor ) {
|
||||
|
||||
removeChildNodes();
|
||||
_svg.style.backgroundColor = 'rgb(' + Math.floor( background.r * 255 ) + ',' + Math.floor( background.g * 255 ) + ',' + Math.floor( background.b * 255 ) + ')';
|
||||
|
||||
} else if ( this.autoClear === true ) {
|
||||
|
||||
this.clear();
|
||||
|
||||
}
|
||||
|
||||
_this.info.render.vertices = 0;
|
||||
_this.info.render.faces = 0;
|
||||
|
||||
_viewMatrix.copy( camera.matrixWorldInverse.getInverse( camera.matrixWorld ) );
|
||||
_viewProjectionMatrix.multiplyMatrices( camera.projectionMatrix, _viewMatrix );
|
||||
|
||||
_renderData = _projector.projectScene( scene, camera, this.sortObjects, this.sortElements );
|
||||
_elements = _renderData.elements;
|
||||
_lights = _renderData.lights;
|
||||
|
||||
_normalViewMatrix.getNormalMatrix( camera.matrixWorldInverse );
|
||||
|
||||
calculateLights( _lights );
|
||||
|
||||
for ( var e = 0, el = _elements.length; e < el; e ++ ) {
|
||||
|
||||
var element = _elements[ e ];
|
||||
var material = element.material;
|
||||
|
||||
if ( material === undefined || material.opacity === 0 ) continue;
|
||||
|
||||
_elemBox.makeEmpty();
|
||||
|
||||
if ( element instanceof THREE.RenderableSprite ) {
|
||||
|
||||
_v1 = element;
|
||||
_v1.x *= _svgWidthHalf; _v1.y *= - _svgHeightHalf;
|
||||
|
||||
renderSprite( _v1, element, material );
|
||||
|
||||
} else if ( element instanceof THREE.RenderableLine ) {
|
||||
|
||||
_v1 = element.v1; _v2 = element.v2;
|
||||
|
||||
_v1.positionScreen.x *= _svgWidthHalf; _v1.positionScreen.y *= - _svgHeightHalf;
|
||||
_v2.positionScreen.x *= _svgWidthHalf; _v2.positionScreen.y *= - _svgHeightHalf;
|
||||
|
||||
_elemBox.setFromPoints( [ _v1.positionScreen, _v2.positionScreen ] );
|
||||
|
||||
if ( _clipBox.intersectsBox( _elemBox ) === true ) {
|
||||
|
||||
renderLine( _v1, _v2, element, material );
|
||||
|
||||
}
|
||||
|
||||
} else if ( element instanceof THREE.RenderableFace ) {
|
||||
|
||||
_v1 = element.v1; _v2 = element.v2; _v3 = element.v3;
|
||||
|
||||
if ( _v1.positionScreen.z < - 1 || _v1.positionScreen.z > 1 ) continue;
|
||||
if ( _v2.positionScreen.z < - 1 || _v2.positionScreen.z > 1 ) continue;
|
||||
if ( _v3.positionScreen.z < - 1 || _v3.positionScreen.z > 1 ) continue;
|
||||
|
||||
_v1.positionScreen.x *= _svgWidthHalf; _v1.positionScreen.y *= - _svgHeightHalf;
|
||||
_v2.positionScreen.x *= _svgWidthHalf; _v2.positionScreen.y *= - _svgHeightHalf;
|
||||
_v3.positionScreen.x *= _svgWidthHalf; _v3.positionScreen.y *= - _svgHeightHalf;
|
||||
|
||||
_elemBox.setFromPoints( [
|
||||
_v1.positionScreen,
|
||||
_v2.positionScreen,
|
||||
_v3.positionScreen
|
||||
] );
|
||||
|
||||
if ( _clipBox.intersectsBox( _elemBox ) === true ) {
|
||||
|
||||
renderFace3( _v1, _v2, _v3, element, material );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
scene.traverseVisible( function ( object ) {
|
||||
|
||||
if ( object instanceof THREE.SVGObject ) {
|
||||
|
||||
_vector3.setFromMatrixPosition( object.matrixWorld );
|
||||
_vector3.applyMatrix4( _viewProjectionMatrix );
|
||||
|
||||
var x = _vector3.x * _svgWidthHalf;
|
||||
var y = - _vector3.y * _svgHeightHalf;
|
||||
|
||||
var node = object.node;
|
||||
node.setAttribute( 'transform', 'translate(' + x + ',' + y + ')' );
|
||||
|
||||
_svg.appendChild( node );
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
function calculateLights( lights ) {
|
||||
|
||||
_ambientLight.setRGB( 0, 0, 0 );
|
||||
_directionalLights.setRGB( 0, 0, 0 );
|
||||
_pointLights.setRGB( 0, 0, 0 );
|
||||
|
||||
for ( var l = 0, ll = lights.length; l < ll; l ++ ) {
|
||||
|
||||
var light = lights[ l ];
|
||||
var lightColor = light.color;
|
||||
|
||||
if ( light instanceof THREE.AmbientLight ) {
|
||||
|
||||
_ambientLight.r += lightColor.r;
|
||||
_ambientLight.g += lightColor.g;
|
||||
_ambientLight.b += lightColor.b;
|
||||
|
||||
} else if ( light instanceof THREE.DirectionalLight ) {
|
||||
|
||||
_directionalLights.r += lightColor.r;
|
||||
_directionalLights.g += lightColor.g;
|
||||
_directionalLights.b += lightColor.b;
|
||||
|
||||
} else if ( light instanceof THREE.PointLight ) {
|
||||
|
||||
_pointLights.r += lightColor.r;
|
||||
_pointLights.g += lightColor.g;
|
||||
_pointLights.b += lightColor.b;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function calculateLight( lights, position, normal, color ) {
|
||||
|
||||
for ( var l = 0, ll = lights.length; l < ll; l ++ ) {
|
||||
|
||||
var light = lights[ l ];
|
||||
var lightColor = light.color;
|
||||
|
||||
if ( light instanceof THREE.DirectionalLight ) {
|
||||
|
||||
var lightPosition = _vector3.setFromMatrixPosition( light.matrixWorld ).normalize();
|
||||
|
||||
var amount = normal.dot( lightPosition );
|
||||
|
||||
if ( amount <= 0 ) continue;
|
||||
|
||||
amount *= light.intensity;
|
||||
|
||||
color.r += lightColor.r * amount;
|
||||
color.g += lightColor.g * amount;
|
||||
color.b += lightColor.b * amount;
|
||||
|
||||
} else if ( light instanceof THREE.PointLight ) {
|
||||
|
||||
var lightPosition = _vector3.setFromMatrixPosition( light.matrixWorld );
|
||||
|
||||
var amount = normal.dot( _vector3.subVectors( lightPosition, position ).normalize() );
|
||||
|
||||
if ( amount <= 0 ) continue;
|
||||
|
||||
amount *= light.distance == 0 ? 1 : 1 - Math.min( position.distanceTo( lightPosition ) / light.distance, 1 );
|
||||
|
||||
if ( amount == 0 ) continue;
|
||||
|
||||
amount *= light.intensity;
|
||||
|
||||
color.r += lightColor.r * amount;
|
||||
color.g += lightColor.g * amount;
|
||||
color.b += lightColor.b * amount;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function renderSprite( v1, element, material ) {
|
||||
|
||||
var scaleX = element.scale.x * _svgWidthHalf;
|
||||
var scaleY = element.scale.y * _svgHeightHalf;
|
||||
|
||||
_svgNode = getRectNode( _rectCount ++ );
|
||||
|
||||
_svgNode.setAttribute( 'x', v1.x - ( scaleX * 0.5 ) );
|
||||
_svgNode.setAttribute( 'y', v1.y - ( scaleY * 0.5 ) );
|
||||
_svgNode.setAttribute( 'width', scaleX );
|
||||
_svgNode.setAttribute( 'height', scaleY );
|
||||
|
||||
if ( material instanceof THREE.SpriteMaterial ) {
|
||||
|
||||
_svgNode.setAttribute( 'style', 'fill: ' + material.color.getStyle() );
|
||||
|
||||
}
|
||||
|
||||
_svg.appendChild( _svgNode );
|
||||
|
||||
}
|
||||
|
||||
function renderLine( v1, v2, element, material ) {
|
||||
|
||||
_svgNode = getLineNode( _lineCount ++ );
|
||||
|
||||
_svgNode.setAttribute( 'x1', v1.positionScreen.x );
|
||||
_svgNode.setAttribute( 'y1', v1.positionScreen.y );
|
||||
_svgNode.setAttribute( 'x2', v2.positionScreen.x );
|
||||
_svgNode.setAttribute( 'y2', v2.positionScreen.y );
|
||||
|
||||
if ( material instanceof THREE.LineBasicMaterial ) {
|
||||
|
||||
_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + material.color.getStyle() + '; stroke-width: ' + material.linewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + material.linecap + '; stroke-linejoin: ' + material.linejoin );
|
||||
|
||||
_svg.appendChild( _svgNode );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function renderFace3( v1, v2, v3, element, material ) {
|
||||
|
||||
_this.info.render.vertices += 3;
|
||||
_this.info.render.faces ++;
|
||||
|
||||
_svgNode = getPathNode( _pathCount ++ );
|
||||
_svgNode.setAttribute( 'd', 'M ' + v1.positionScreen.x + ' ' + v1.positionScreen.y + ' L ' + v2.positionScreen.x + ' ' + v2.positionScreen.y + ' L ' + v3.positionScreen.x + ',' + v3.positionScreen.y + 'z' );
|
||||
|
||||
if ( material instanceof THREE.MeshBasicMaterial ) {
|
||||
|
||||
_color.copy( material.color );
|
||||
|
||||
if ( material.vertexColors === THREE.FaceColors ) {
|
||||
|
||||
_color.multiply( element.color );
|
||||
|
||||
}
|
||||
|
||||
} else if ( material instanceof THREE.MeshLambertMaterial || material instanceof THREE.MeshPhongMaterial ) {
|
||||
|
||||
_diffuseColor.copy( material.color );
|
||||
|
||||
if ( material.vertexColors === THREE.FaceColors ) {
|
||||
|
||||
_diffuseColor.multiply( element.color );
|
||||
|
||||
}
|
||||
|
||||
_color.copy( _ambientLight );
|
||||
|
||||
_centroid.copy( v1.positionWorld ).add( v2.positionWorld ).add( v3.positionWorld ).divideScalar( 3 );
|
||||
|
||||
calculateLight( _lights, _centroid, element.normalModel, _color );
|
||||
|
||||
_color.multiply( _diffuseColor ).add( material.emissive );
|
||||
|
||||
} else if ( material instanceof THREE.MeshNormalMaterial ) {
|
||||
|
||||
_normal.copy( element.normalModel ).applyMatrix3( _normalViewMatrix );
|
||||
|
||||
_color.setRGB( _normal.x, _normal.y, _normal.z ).multiplyScalar( 0.5 ).addScalar( 0.5 );
|
||||
|
||||
}
|
||||
|
||||
if ( material.wireframe ) {
|
||||
|
||||
_svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.getStyle() + '; stroke-width: ' + material.wireframeLinewidth + '; stroke-opacity: ' + material.opacity + '; stroke-linecap: ' + material.wireframeLinecap + '; stroke-linejoin: ' + material.wireframeLinejoin );
|
||||
|
||||
} else {
|
||||
|
||||
_svgNode.setAttribute( 'style', 'fill: ' + _color.getStyle() + '; fill-opacity: ' + material.opacity );
|
||||
|
||||
}
|
||||
|
||||
_svg.appendChild( _svgNode );
|
||||
|
||||
}
|
||||
|
||||
function getLineNode( id ) {
|
||||
|
||||
if ( _svgLinePool[ id ] == null ) {
|
||||
|
||||
_svgLinePool[ id ] = document.createElementNS( 'http://www.w3.org/2000/svg', 'line' );
|
||||
|
||||
if ( _quality == 0 ) {
|
||||
|
||||
_svgLinePool[ id ].setAttribute( 'shape-rendering', 'crispEdges' ); //optimizeSpeed
|
||||
|
||||
}
|
||||
|
||||
return _svgLinePool[ id ];
|
||||
|
||||
}
|
||||
|
||||
return _svgLinePool[ id ];
|
||||
|
||||
}
|
||||
|
||||
function getPathNode( id ) {
|
||||
|
||||
if ( _svgPathPool[ id ] == null ) {
|
||||
|
||||
_svgPathPool[ id ] = document.createElementNS( 'http://www.w3.org/2000/svg', 'path' );
|
||||
|
||||
if ( _quality == 0 ) {
|
||||
|
||||
_svgPathPool[ id ].setAttribute( 'shape-rendering', 'crispEdges' ); //optimizeSpeed
|
||||
|
||||
}
|
||||
|
||||
return _svgPathPool[ id ];
|
||||
|
||||
}
|
||||
|
||||
return _svgPathPool[ id ];
|
||||
|
||||
}
|
||||
|
||||
function getRectNode( id ) {
|
||||
|
||||
if ( _svgRectPool[ id ] == null ) {
|
||||
|
||||
_svgRectPool[ id ] = document.createElementNS( 'http://www.w3.org/2000/svg', 'rect' );
|
||||
|
||||
if ( _quality == 0 ) {
|
||||
|
||||
_svgRectPool[ id ].setAttribute( 'shape-rendering', 'crispEdges' ); //optimizeSpeed
|
||||
|
||||
}
|
||||
|
||||
return _svgRectPool[ id ];
|
||||
|
||||
}
|
||||
|
||||
return _svgRectPool[ id ];
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
1567
node_modules/three/examples/js/renderers/SoftwareRenderer.js
generated
vendored
Normal file
1567
node_modules/three/examples/js/renderers/SoftwareRenderer.js
generated
vendored
Normal file
File diff suppressed because it is too large
Load Diff
2537
node_modules/three/examples/js/renderers/WebGLDeferredRenderer.js
generated
vendored
Normal file
2537
node_modules/three/examples/js/renderers/WebGLDeferredRenderer.js
generated
vendored
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user