mirror of
https://github.com/wahyd4/three.js.git
synced 2026-08-09 04:56:01 +10:00
New Canvas & Particles Emitter Example
This commit is contained in:
zz85
@@ -0,0 +1,334 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>three.js canvas/webgl - geometry - text</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
|
||||
<style type="text/css">
|
||||
body {
|
||||
font-family: Monospace;
|
||||
background-color: #f0f0f0;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<script type="text/javascript" src="../build/Three.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
|
||||
<script type="text/javascript" src="js/Stats.js"></script>
|
||||
<script type="text/javascript" src="js/Tween.js"></script>
|
||||
<script type="text/javascript" src="js/Sparks.js"></script>
|
||||
|
||||
|
||||
<!-- load the font file from canvas-text -->
|
||||
|
||||
<script type="text/javascript" src="fonts/helvetiker_regular.typeface.js"></script>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
var container, stats;
|
||||
|
||||
var camera, scene, renderer;
|
||||
|
||||
var text, plane;
|
||||
|
||||
var targetRotation = 0;
|
||||
var targetRotationOnMouseDown = 0;
|
||||
|
||||
var mouseX = 0;
|
||||
var mouseXOnMouseDown = 0;
|
||||
|
||||
var windowHalfX = window.innerWidth / 2;
|
||||
var windowHalfY = window.innerHeight / 2;
|
||||
|
||||
|
||||
var heartShape, particleCloud, sparksEmitter, emitterPos;
|
||||
var _rotation = 0;
|
||||
var timeOnShapePath = 0;
|
||||
|
||||
init();
|
||||
animate();
|
||||
|
||||
function init() {
|
||||
|
||||
container = document.createElement( 'div' );
|
||||
document.body.appendChild( container );
|
||||
|
||||
var info = document.createElement( 'div' );
|
||||
info.style.position = 'absolute';
|
||||
info.style.top = '10px';
|
||||
info.style.width = '100%';
|
||||
info.style.textAlign = 'center';
|
||||
info.innerHTML = 'Three.js with Love. Simple Particle Systems with Shapes by <a href="http://www.lab4games.net/zz85/blog">zz85</a><br/>Move your mouse. Click to pause/resume.';
|
||||
container.appendChild( info );
|
||||
|
||||
camera = new THREE.Camera( 50, window.innerWidth / window.innerHeight, 1, 1000 );
|
||||
camera.position.y = 150;
|
||||
camera.position.z = 700;
|
||||
camera.target.position.y = 150;
|
||||
|
||||
scene = new THREE.Scene();
|
||||
|
||||
// Get text from hash
|
||||
|
||||
var theText = "THREE.JS";
|
||||
|
||||
var hash = document.location.hash.substr( 1 );
|
||||
|
||||
if ( hash.length !== 0 ) {
|
||||
|
||||
theText = hash;
|
||||
|
||||
}
|
||||
|
||||
var text3d = new THREE.TextGeometry( theText, {
|
||||
|
||||
size: 80,
|
||||
height: 20,
|
||||
curveSegments: 2,
|
||||
font: "helvetiker"
|
||||
|
||||
});
|
||||
|
||||
text3d.computeBoundingBox();
|
||||
var centerOffset = -0.5 * ( text3d.boundingBox.x[ 1 ] - text3d.boundingBox.x[ 0 ] );
|
||||
|
||||
var textMaterial = new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, wireframe: false } );
|
||||
|
||||
text = new THREE.Mesh( text3d, textMaterial );
|
||||
// Potentially, we can extract the vertices or faces of the text to generate particles too.
|
||||
// Geo > Vertices > Position
|
||||
|
||||
text.doubleSided = false;
|
||||
|
||||
text.position.x = centerOffset;
|
||||
text.position.y = 100;
|
||||
text.position.z = 0;
|
||||
|
||||
text.rotation.x = 0;
|
||||
text.rotation.y = Math.PI * 2;
|
||||
text.overdraw = true;
|
||||
|
||||
parent = new THREE.Object3D();
|
||||
parent.addChild( text );
|
||||
|
||||
|
||||
particleCloud = new THREE.Object3D(); // Just a group
|
||||
particleCloud.y = 800;
|
||||
parent.addChild( particleCloud );
|
||||
|
||||
scene.addObject( parent );
|
||||
|
||||
|
||||
// Create Particle Systems
|
||||
|
||||
// Heart
|
||||
|
||||
var x = 0, y = 0;
|
||||
|
||||
heartShape = new THREE.Shape();
|
||||
|
||||
heartShape.moveTo( x + 25, y + 25 );
|
||||
heartShape.bezierCurveTo( x + 25, y + 25, x + 20, y, x, y );
|
||||
heartShape.bezierCurveTo( x - 30, y, x - 30, y + 35,x - 30,y + 35 );
|
||||
heartShape.bezierCurveTo( x - 30, y + 55, x - 10, y + 77, x + 25, y + 95 );
|
||||
heartShape.bezierCurveTo( x + 60, y + 77, x + 80, y + 55, x + 80, y + 35 );
|
||||
heartShape.bezierCurveTo( x + 80, y + 35, x + 80, y, x + 50, y );
|
||||
heartShape.bezierCurveTo( x + 35, y, x + 25, y + 25, x + 25, y + 25 );
|
||||
|
||||
var circleLines = function ( context ) {
|
||||
context.lineWidth = 0.05; //0.05
|
||||
context.beginPath();
|
||||
context.arc( 0, 0, 1, 0, Math.PI*2, true );
|
||||
context.closePath();
|
||||
context.stroke();
|
||||
|
||||
context.globalAlpha = 0.2;
|
||||
context.fill();
|
||||
}
|
||||
|
||||
var hue = 0;
|
||||
|
||||
var hearts = function ( context ) {
|
||||
context.globalAlpha = 0.5;
|
||||
var x = -4, y = 0;
|
||||
context.scale(1, -1);
|
||||
context.beginPath();
|
||||
// From http://blog.burlock.org/html5/130-paths
|
||||
context.bezierCurveTo( x + 2.5, y + 2.5, x + 2.0, y, x, y );
|
||||
context.bezierCurveTo( x - 3.0, y, x - 3.0, y + 3.5,x - 3.0,y + 3.5 );
|
||||
context.bezierCurveTo( x - 3.0, y + 5.5, x - 1.0, y + 7.7, x + 2.5, y + 9.5 );
|
||||
context.bezierCurveTo( x + 6.0, y + 7.7, x + 8.0, y + 5.5, x + 8.0, y + 3.5 );
|
||||
context.bezierCurveTo( x + 8.0, y + 3.5, x + 8.0, y, x + 5.0, y );
|
||||
context.bezierCurveTo( x + 3.5, y, x + 2.5, y + 2.5, x + 2.5, y + 2.5 );
|
||||
context.closePath();
|
||||
context.fill();
|
||||
context.lineWidth = 0.5; //0.05
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
var setTargetParticle = function() {
|
||||
|
||||
//hearts circleLines
|
||||
var material = new THREE.ParticleCanvasMaterial( { program: hearts, blending:THREE.AdditiveBlending } );
|
||||
|
||||
material.color.setHSV(hue, 0.5, 1);
|
||||
hue += 0.001;
|
||||
if (hue>1) hue-=1;
|
||||
|
||||
particle = new THREE.Particle( material );
|
||||
|
||||
particle.scale.x = particle.scale.y = Math.random() * 2 +1;
|
||||
particleCloud.addChild( particle );
|
||||
|
||||
return particle;
|
||||
};
|
||||
|
||||
var onParticleCreated = function(p) {
|
||||
var position = p.position;
|
||||
p.target.position = position;
|
||||
};
|
||||
|
||||
var onParticleDead = function(particle) {
|
||||
particle.target.visible = false;
|
||||
particleCloud.removeChild(particle.target);
|
||||
};
|
||||
|
||||
|
||||
sparksEmitter = new SPARKS.Emitter(new SPARKS.SteadyCounter(160));
|
||||
|
||||
emitterpos = new THREE.Vector3(0,0,0);
|
||||
|
||||
sparksEmitter.addInitializer(new SPARKS.Position( new SPARKS.PointZone( emitterpos ) ) );
|
||||
sparksEmitter.addInitializer(new SPARKS.Lifetime(0,2));
|
||||
sparksEmitter.addInitializer(new SPARKS.Target(null, setTargetParticle));
|
||||
|
||||
|
||||
sparksEmitter.addInitializer(new SPARKS.Velocity(new SPARKS.PointZone(new THREE.Vector3(0,-50,10))));
|
||||
// TOTRY Set velocity to move away from centroid
|
||||
|
||||
sparksEmitter.addAction(new SPARKS.Age());
|
||||
//sparksEmitter.addAction(new SPARKS.Accelerate(0.2));
|
||||
sparksEmitter.addAction(new SPARKS.Move());
|
||||
sparksEmitter.addAction(new SPARKS.RandomDrift(50,50,2000));
|
||||
|
||||
|
||||
sparksEmitter.addCallback("created", onParticleCreated);
|
||||
sparksEmitter.addCallback("dead", onParticleDead);
|
||||
sparksEmitter.start();
|
||||
|
||||
// End Particles
|
||||
|
||||
|
||||
renderer = new THREE.CanvasRenderer();
|
||||
renderer.setSize( window.innerWidth, window.innerHeight );
|
||||
|
||||
container.appendChild( renderer.domElement );
|
||||
|
||||
stats = new Stats();
|
||||
stats.domElement.style.position = 'absolute';
|
||||
stats.domElement.style.top = '0px';
|
||||
container.appendChild( stats.domElement );
|
||||
|
||||
document.addEventListener( 'mousedown', onDocumentMouseDown, false );
|
||||
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
|
||||
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
|
||||
|
||||
|
||||
function onDocumentMouseDown( event ) {
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
mouseXOnMouseDown = event.clientX - windowHalfX;
|
||||
targetRotationOnMouseDown = targetRotation;
|
||||
|
||||
if (sparksEmitter.isRunning()) {
|
||||
sparksEmitter.stop();
|
||||
} else {
|
||||
sparksEmitter.start();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onDocumentMouseMove( event ) {
|
||||
|
||||
mouseX = event.clientX - windowHalfX;
|
||||
|
||||
targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.02;
|
||||
|
||||
}
|
||||
|
||||
function onDocumentTouchStart( event ) {
|
||||
|
||||
if ( event.touches.length == 1 ) {
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
mouseXOnMouseDown = event.touches[ 0 ].pageX - windowHalfX;
|
||||
targetRotationOnMouseDown = targetRotation;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function onDocumentTouchMove( event ) {
|
||||
|
||||
if ( event.touches.length == 1 ) {
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
mouseX = event.touches[ 0 ].pageX - windowHalfX;
|
||||
targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.05;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
function animate() {
|
||||
|
||||
requestAnimationFrame( animate );
|
||||
|
||||
render();
|
||||
stats.update();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
function render() {
|
||||
timeOnShapePath += 0.0337;
|
||||
if (timeOnShapePath > 1) timeOnShapePath -= 1;
|
||||
|
||||
// TODO Create a PointOnShape Action/Zone in the particle engine
|
||||
var pointOnShape = heartShape.getPointAt(timeOnShapePath);
|
||||
|
||||
emitterpos.x = pointOnShape.x * 5 - 100;
|
||||
emitterpos.y = -pointOnShape.y * 5 + 400;
|
||||
|
||||
// Pretty cool effect if you enable this
|
||||
//particleCloud.rotation.y += 0.05;
|
||||
|
||||
parent.rotation.y += ( targetRotation - parent.rotation.y ) * 0.05;
|
||||
renderer.render( scene, camera );
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,600 @@
|
||||
/*
|
||||
* @author zz85 (http://github.com/zz85 http://www.lab4games.net/zz85/blog)
|
||||
*
|
||||
* a simple to use javascript 3d particles system inspired by FliNT and Stardust
|
||||
* created with TWEEN.js and THREE.js
|
||||
*
|
||||
* for feature requests or bugs, please visit https://github.com/zz85/sparks.js
|
||||
*
|
||||
* licensed under the MIT license
|
||||
*/
|
||||
|
||||
var SPARKS = {};
|
||||
|
||||
/********************************
|
||||
* Emitter Class
|
||||
*
|
||||
* Creates and Manages Particles
|
||||
*********************************/
|
||||
|
||||
|
||||
SPARKS.Emitter = function (counter) {
|
||||
|
||||
this._counter = counter ? counter : new SPARKS.SteadyCounter(10); // provides number of particles to produce
|
||||
|
||||
this._particles = [];
|
||||
|
||||
|
||||
this._initializers = []; // use for creation of particles
|
||||
this._actions = []; // uses action to update particles
|
||||
this._activities = []; // not supported yet
|
||||
|
||||
this._handlers = [];
|
||||
|
||||
this.callbacks = {};
|
||||
};
|
||||
|
||||
|
||||
SPARKS.Emitter.prototype = {
|
||||
|
||||
_TIMESTEP: 15,
|
||||
_timer: null,
|
||||
_lastTime: null,
|
||||
_timerStep: 10,
|
||||
|
||||
// run its built in timer / stepping
|
||||
start: function() {
|
||||
this._lastTime = Date.now();
|
||||
this._timer = setTimeout(this.step, this._timerStep, this);
|
||||
this._isRunning = true;
|
||||
},
|
||||
|
||||
stop: function() {
|
||||
this._isRunning = false;
|
||||
clearTimeout(this._timer);
|
||||
},
|
||||
|
||||
isRunning: function() {
|
||||
return this._isRunning & true;
|
||||
},
|
||||
|
||||
// Step gets called upon by the engine
|
||||
// but attempts to call update() on a regular basics
|
||||
// This method is also described in http://gameclosure.com/2011/04/11/deterministic-delta-tee-in-js-games/
|
||||
step: function(emitter) {
|
||||
|
||||
var time = Date.now();
|
||||
var elapsed = time - emitter._lastTime;
|
||||
|
||||
while(elapsed >= emitter._TIMESTEP) {
|
||||
emitter.update(emitter._TIMESTEP / 1000);
|
||||
elapsed -= emitter._TIMESTEP;
|
||||
}
|
||||
|
||||
emitter._lastTime = time - elapsed;
|
||||
|
||||
if (emitter._isRunning)
|
||||
setTimeout(emitter.step, emitter._timerStep, emitter);
|
||||
|
||||
},
|
||||
|
||||
|
||||
// Update particle engine in seconds, not milliseconds
|
||||
update: function(time) {
|
||||
|
||||
var len = this._counter.updateEmitter( this, time );
|
||||
|
||||
// Create particles
|
||||
for( i = 0; i < len; i++ ) {
|
||||
this.createParticle();
|
||||
}
|
||||
|
||||
// Update activities
|
||||
len = this._activities.length;
|
||||
for ( i = 0; i < len; i++ )
|
||||
{
|
||||
this_.activities[i].update( this, time );
|
||||
}
|
||||
|
||||
|
||||
len = this._actions.length;
|
||||
var action;
|
||||
var len2 = this._particles.length;
|
||||
|
||||
for( j = 0; j < len; j++ )
|
||||
{
|
||||
action = this._actions[j];
|
||||
for ( i = 0; i < len2; ++i )
|
||||
{
|
||||
particle = this._particles[i];
|
||||
action.update( this, particle, time );
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// remove dead particles
|
||||
for ( i = len2; i--; )
|
||||
{
|
||||
particle = this._particles[i];
|
||||
if ( particle.isDead )
|
||||
{
|
||||
//particle =
|
||||
this._particles.splice( i, 1 );
|
||||
this.dispatchEvent("dead", particle);
|
||||
SPARKS.VectorPool.release(particle.position); //
|
||||
SPARKS.VectorPool.release(particle.velocity);
|
||||
|
||||
} else {
|
||||
this.dispatchEvent("updated", particle);
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
createParticle: function() {
|
||||
var particle = new SPARKS.Particle();
|
||||
// In future, use a Particle Factory
|
||||
var len = this._initializers.length, i;
|
||||
|
||||
for ( i = 0; i < len; i++ ) {
|
||||
this._initializers[i].initialize( this, particle );
|
||||
}
|
||||
|
||||
this._particles.push( particle );
|
||||
|
||||
this.dispatchEvent("created", particle); // ParticleCreated
|
||||
|
||||
return particle;
|
||||
},
|
||||
|
||||
addInitializer: function (initializer) {
|
||||
this._initializers.push(initializer);
|
||||
},
|
||||
|
||||
addAction: function (action) {
|
||||
this._actions.push(action);
|
||||
},
|
||||
|
||||
addCallback: function(name, callback) {
|
||||
this.callbacks[name] = callback;
|
||||
},
|
||||
|
||||
dispatchEvent: function(name, args) {
|
||||
var callback = this.callbacks[name];
|
||||
if (callback) {
|
||||
callback(args);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
|
||||
// Number of particles per seconds
|
||||
SPARKS.SteadyCounter = function(rate) {
|
||||
this.rate = rate;
|
||||
|
||||
};
|
||||
|
||||
SPARKS.SteadyCounter.prototype.updateEmitter = function(emitter, time) {
|
||||
|
||||
return Math.floor(time * this.rate);
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
/********************************
|
||||
* Particle Class
|
||||
*
|
||||
* Represents a single particle
|
||||
*********************************/
|
||||
SPARKS.Particle = function() {
|
||||
|
||||
/**
|
||||
* The lifetime of the particle, in seconds.
|
||||
*/
|
||||
this.lifetime = 0;
|
||||
|
||||
/**
|
||||
* The age of the particle, in seconds.
|
||||
*/
|
||||
this.age = 0;
|
||||
|
||||
/**
|
||||
* The energy of the particle.
|
||||
*/
|
||||
this.energy = 1;
|
||||
|
||||
/**
|
||||
* Whether the particle is dead and should be removed from the stage.
|
||||
*/
|
||||
this.isDead = false;
|
||||
|
||||
this.target = null; // tag
|
||||
|
||||
/**
|
||||
* For 3D
|
||||
*/
|
||||
|
||||
this.position = SPARKS.VectorPool.get().set(0,0,0); //new THREE.Vector3( 0, 0, 0 );
|
||||
this.velocity = SPARKS.VectorPool.get().set(0,0,0); //new THREE.Vector3( 0, 0, 0 );
|
||||
// rotation vec3
|
||||
// angVelocity vec3
|
||||
// faceAxis vec3
|
||||
|
||||
};
|
||||
|
||||
|
||||
/********************************
|
||||
* Action Classes
|
||||
*
|
||||
* An abstract class which have
|
||||
* update function
|
||||
*********************************/
|
||||
SPARKS.Action = function() {
|
||||
this._priority = 0;
|
||||
};
|
||||
|
||||
|
||||
SPARKS.Age = function(easing) {
|
||||
this._easing = (easing == null) ? TWEEN.Easing.Linear.EaseNone : easing;
|
||||
};
|
||||
|
||||
SPARKS.Age.prototype.update = function (emitter, particle, time) {
|
||||
particle.age += time;
|
||||
if( particle.age >= particle.lifetime )
|
||||
{
|
||||
particle.energy = 0;
|
||||
particle.isDead = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
var t = this._easing(particle.age / particle.lifetime);
|
||||
particle.energy = -1 * t + 1;
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
// Mark particle as dead when particle's < 0
|
||||
|
||||
SPARKS.Death = function(easing) {
|
||||
this._easing = (easing == null) ? TWEEN.Linear.EaseNone : easing;
|
||||
};
|
||||
|
||||
SPARKS.Death.prototype.update = function (emitter, particle, time) {
|
||||
if (particle.life <= 0) {
|
||||
particle.isDead = true;
|
||||
}
|
||||
};
|
||||
*/
|
||||
|
||||
|
||||
SPARKS.Move = function() {
|
||||
|
||||
};
|
||||
|
||||
SPARKS.Move.prototype.update = function(emitter, particle, time) {
|
||||
|
||||
var p = particle.position;
|
||||
var v = particle.velocity;
|
||||
|
||||
p.x += v.x * time;
|
||||
p.y += v.y * time;
|
||||
p.z += v.z * time;
|
||||
|
||||
};
|
||||
|
||||
|
||||
SPARKS.Accelerate = function(x,y,z) {
|
||||
|
||||
if (x instanceof THREE.Vector3) {
|
||||
this.acceleration = x;
|
||||
return;
|
||||
}
|
||||
|
||||
this.acceleration = new THREE.Vector3(x,y,z);
|
||||
|
||||
};
|
||||
|
||||
SPARKS.Accelerate.prototype.update = function(emitter, particle, time) {
|
||||
var acc = this.acceleration;
|
||||
|
||||
var v = particle.velocity;
|
||||
|
||||
v.x += acc.x * time;
|
||||
v.y += acc.y * time;
|
||||
v.z += acc.z * time;
|
||||
|
||||
};
|
||||
|
||||
/* Set the max ammount of x,y,z drift movements in a second */
|
||||
SPARKS.RandomDrift = function(x,y,z) {
|
||||
if (x instanceof THREE.Vector3) {
|
||||
this.drift = x;
|
||||
return;
|
||||
}
|
||||
|
||||
this.drift = new THREE.Vector3(x,y,z);
|
||||
}
|
||||
|
||||
|
||||
SPARKS.RandomDrift.prototype.update = function(emitter, particle, time) {
|
||||
var drift = this.drift;
|
||||
|
||||
var v = particle.velocity;
|
||||
|
||||
v.x += ( Math.random() - 0.5 ) * drift.x * time;
|
||||
v.y += ( Math.random() - 0.5 ) * drift.y * time;
|
||||
v.z += ( Math.random() - 0.5 ) * drift.z * time;
|
||||
|
||||
};
|
||||
|
||||
/********************************
|
||||
* Zone Classes
|
||||
*
|
||||
* An abstract classes which have
|
||||
* getLocation() function
|
||||
*********************************/
|
||||
SPARKS.Zone = function() {
|
||||
};
|
||||
|
||||
// TODO, contains() for Zone
|
||||
|
||||
SPARKS.PointZone = function(pos) {
|
||||
this.pos = pos;
|
||||
};
|
||||
|
||||
SPARKS.PointZone.prototype.getLocation = function() {
|
||||
return this.pos;
|
||||
};
|
||||
|
||||
SPARKS.PointZone = function(pos) {
|
||||
this.pos = pos;
|
||||
};
|
||||
|
||||
SPARKS.PointZone.prototype.getLocation = function() {
|
||||
return this.pos;
|
||||
};
|
||||
|
||||
SPARKS.LineZone = function(start, end) {
|
||||
this.start = start;
|
||||
this.end = end;
|
||||
this._length = end.clone().subSelf( start );
|
||||
};
|
||||
|
||||
SPARKS.LineZone.prototype.getLocation = function() {
|
||||
var len = this._length.clone();
|
||||
|
||||
len.multiplyScalar( Math.random() );
|
||||
return len.addSelf( this.start );
|
||||
|
||||
};
|
||||
|
||||
// Basically a RectangleZone
|
||||
|
||||
|
||||
SPARKS.ParallelogramZone = function(corner, side1, side2) {
|
||||
this.corner = corner;
|
||||
this.side1 = side1;
|
||||
this.side2 = side2;
|
||||
};
|
||||
|
||||
SPARKS.ParallelogramZone.prototype.getLocation = function() {
|
||||
|
||||
var d1 = this.side1.clone().multiplyScalar( Math.random() );
|
||||
var d2 = this.side2.clone().multiplyScalar( Math.random() );
|
||||
d1.addSelf(d2);
|
||||
return d1.addSelf( this.corner );
|
||||
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* The constructor creates a DiscZone 3D zone.
|
||||
*
|
||||
* @param centre The point at the center of the disc.
|
||||
* @param normal A vector normal to the disc.
|
||||
* @param outerRadius The outer radius of the disc.
|
||||
* @param innerRadius The inner radius of the disc. This defines the hole
|
||||
* in the center of the disc. If set to zero, there is no hole.
|
||||
*/
|
||||
|
||||
/*
|
||||
// BUGGY!!
|
||||
SPARKS.DiscZone = function(center, radiusNormal, outerRadius, innerRadius) {
|
||||
this.center = center;
|
||||
this.radiusNormal = radiusNormal;
|
||||
this.outerRadius = (outerRadius==undefined) ? 0 : outerRadius;
|
||||
this.innerRadius = (innerRadius==undefined) ? 0 : innerRadius;
|
||||
|
||||
};
|
||||
|
||||
SPARKS.DiscZone.prototype.getLocation = function() {
|
||||
var rand = Math.random();
|
||||
var _innerRadius = this.innerRadius;
|
||||
var _outerRadius = this.outerRadius;
|
||||
var center = this.center;
|
||||
var _normal = this.radiusNormal;
|
||||
|
||||
_distToOrigin = _normal.dot( center );
|
||||
|
||||
var radius = _innerRadius + (1 - rand * rand ) * ( _outerRadius - _innerRadius );
|
||||
var angle = Math.random() * SPARKS.Utils.TWOPI;
|
||||
|
||||
var _distToOrigin = _normal.dot( center );
|
||||
var axes = SPARKS.Utils.getPerpendiculars( _normal.clone() );
|
||||
var _planeAxis1 = axes[0];
|
||||
var _planeAxis2 = axes[1];
|
||||
|
||||
var p = _planeAxis1.clone();
|
||||
p.multiplyScalar( radius * Math.cos( angle ) );
|
||||
var p2 = _planeAxis2.clone();
|
||||
p2.multiplyScalar( radius * Math.sin( angle ) );
|
||||
p.addSelf( p2 );
|
||||
return _center.add( p );
|
||||
|
||||
};
|
||||
*/
|
||||
|
||||
SPARKS.SphereCapZone = function(x, y, z, minr, maxr, angle) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.z = z;
|
||||
this.minr = minr;
|
||||
this.maxr = maxr;
|
||||
this.angle = angle;
|
||||
};
|
||||
|
||||
SPARKS.SphereCapZone.prototype.getLocation = function() {
|
||||
var theta = Math.PI *2 * SPARKS.Utils.random();
|
||||
var r = SPARKS.Utils.random();
|
||||
|
||||
//new THREE.Vector3
|
||||
var v = SPARKS.VectorPool.get().set(r * Math.cos(theta), -1 / Math.tan(this.angle * SPARKS.Utils.DEGREE_TO_RADIAN), r * Math.sin(theta));
|
||||
|
||||
//v.length = StardustMath.interpolate(0, _minRadius, 1, _maxRadius, Math.random());
|
||||
|
||||
var i = this.minr - ((this.minr-this.maxr) * Math.random() );
|
||||
v.multiplyScalar(i);
|
||||
|
||||
v.__markedForReleased = true;
|
||||
|
||||
return v;
|
||||
};
|
||||
|
||||
|
||||
/********************************
|
||||
* Initializer Classes
|
||||
*
|
||||
* Classes which initializes
|
||||
* particles. Implements initialize( emitter:Emitter, particle:Particle )
|
||||
*********************************/
|
||||
|
||||
// Specifies random life between max and min
|
||||
SPARKS.Lifetime = function(min, max) {
|
||||
this._min = min;
|
||||
|
||||
this._max = max ? max : min;
|
||||
|
||||
};
|
||||
|
||||
SPARKS.Lifetime.prototype.initialize = function( emitter/*Emitter*/, particle/*Particle*/ ) {
|
||||
particle.lifetime = this._min + SPARKS.Utils.random() * ( this._max - this._min );
|
||||
};
|
||||
|
||||
|
||||
SPARKS.Position = function(zone) {
|
||||
this.zone = zone;
|
||||
};
|
||||
|
||||
SPARKS.Position.prototype.initialize = function( emitter/*Emitter*/, particle/*Particle*/ ) {
|
||||
var pos = this.zone.getLocation();
|
||||
particle.position.set(pos.x, pos.y, pos.z);
|
||||
};
|
||||
|
||||
SPARKS.Velocity = function(zone) {
|
||||
this.zone = zone;
|
||||
};
|
||||
|
||||
SPARKS.Velocity.prototype.initialize = function( emitter/*Emitter*/, particle/*Particle*/ ) {
|
||||
var pos = this.zone.getLocation();
|
||||
particle.velocity.set(pos.x, pos.y, pos.z);
|
||||
if (pos.__markedForReleased) {
|
||||
//console.log("release");
|
||||
SPARKS.VectorPool.release(pos);
|
||||
pos.__markedForReleased = false;
|
||||
}
|
||||
};
|
||||
|
||||
SPARKS.Target = function(target, callback) {
|
||||
this.target = target;
|
||||
this.callback = callback;
|
||||
};
|
||||
|
||||
SPARKS.Target.prototype.initialize = function( emitter, particle) {
|
||||
|
||||
if (this.callback) {
|
||||
particle.target = this.callback();
|
||||
} else {
|
||||
particle.target = this.target;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/********************************
|
||||
* VectorPool
|
||||
*
|
||||
* Reuse much of Vectors if possible
|
||||
*********************************/
|
||||
|
||||
SPARKS.VectorPool = {
|
||||
__pools: [],
|
||||
|
||||
// Get a new Vector
|
||||
get: function() {
|
||||
if (this.__pools.length>0) {
|
||||
return this.__pools.pop();
|
||||
}
|
||||
|
||||
return this._addToPool();
|
||||
|
||||
},
|
||||
|
||||
// Release a vector back into the pool
|
||||
release: function(v) {
|
||||
this.__pools.push(v);
|
||||
},
|
||||
|
||||
// Create a bunch of vectors and add to the pool
|
||||
_addToPool: function() {
|
||||
//console.log("creating some pools");
|
||||
|
||||
for (var i=0, size = 100; i < size; i++) {
|
||||
this.__pools.push(new THREE.Vector3());
|
||||
}
|
||||
|
||||
return new THREE.Vector3();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
};
|
||||
|
||||
|
||||
/********************************
|
||||
* Util Classes
|
||||
*
|
||||
* Classes which initializes
|
||||
* particles. Implements initialize( emitter:Emitter, particle:Particle )
|
||||
*********************************/
|
||||
SPARKS.Utils = {
|
||||
random: function() {
|
||||
return Math.random();
|
||||
},
|
||||
DEGREE_TO_RADIAN: Math.PI / 180,
|
||||
TWOPI: Math.PI * 2,
|
||||
|
||||
getPerpendiculars: function(normal) {
|
||||
var p1 = this.getPerpendicular( normal );
|
||||
var p2 = normal.cross( p1 );
|
||||
p2.normalize();
|
||||
return [ p1, p2 ];
|
||||
},
|
||||
|
||||
getPerpendicular: function( v )
|
||||
{
|
||||
if( v.x == 0 )
|
||||
{
|
||||
return new THREE.Vector3D( 1, 0, 0 );
|
||||
}
|
||||
else
|
||||
{
|
||||
var temp = new THREE.Vector3( v.y, -v.x, 0 );
|
||||
return temp.normalize();
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
Reference in New Issue
Block a user