3d-interface/js/three/threex.transparency.js

var THREEx = THREEx || {}

/**
 * namespace for the extension
 * @type {Object}
 */
THREEx.Transparency	= {};
THREEx.Transparency.objects = [];

/**
 * init transparency of a object recursivly
 * @param  {THREE.Object3D[]} objects the object which are transparent
 */
THREEx.Transparency.init	= function(objects){
	objects.forEach(function(object){
        THREEx.Transparency.objects.push(object);
		object.material.transparent	= true;
		object.material.depthWrite	= false;
        object.raycastable = false;
	});
}

THREEx.Transparency.push = function() {
    for (var i = 0; i < arguments.length; i++) {
        THREEx.Transparency.objects.push(arguments[i]);
        arguments[i].material.transparent = true;
        arguments[i].material.depthWrite = false;
        arguments[i].raycastable = false;
    }
}

/**
 * update the object for transparency rendering
 * @param  {THREE.Object3D[]} objects the objects which are transparent
 * @param  {THREE.Camera} camera the camera used for rendering
 */
THREEx.Transparency.update	= function(camera){
	// update camera matrices
	camera.updateMatrixWorld()
	camera.matrixWorldInverse.getInverse( camera.matrixWorld )

	var screenMatrix= new THREE.Matrix4().multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse)
	var position	= new THREE.Vector3()

	// traverse the object
	THREEx.Transparency.objects.forEach(function(object){
		// update the matrixWorld of the object and its children
		object.updateMatrixWorld()
		// compute its position in screen space
		position.setFromMatrixPosition( object.matrixWorld );
        // object.matrixWorld.setMatrixFromPosition(position);
		position.applyProjection( screenMatrix );
		// use the position.x as renderDepth
		object.renderDepth	= position.z;
	})
}