topical media & game development
mobile-query-three-plugins-flamethrower-examples-index-update.htm / htm
<!doctype html><title>Flying to the moon</title>
<script src="../../../build/tquery-bundle-require.js"></script>
<script src="vendor/tquery/ColladaLoader.js"></script>
<script src="../vendor/fireworks-bundle.js"></script>
<script src="../vendor/fireworks-comboemitter.js"></script>
<script src="../vendor/fireworks-comboemitter-flamethrower.js"></script>
<script src="../tquery.textureutils.js"></script>
<body><div id='info' style='color:white'>
Fly Me To The Moon -
<a href='github.com/jeromeetienne/fireworks.js/' target='_blank'>firework.js</a> particles engine
<br/>
<a href='github.com/mrdoob/three.js/' target='_blank'>three.js</a> thru
<a href='http://jeromeetienne.github.com/tquery/' target='_blank'>tQuery API</a>
-
<a href='http://sketchup.google.com/3dwarehouse/details?mid=4d9028688f80fa1ba9ec59f156afb08e' target='_blank'>rocket</a> by
<a href='http://sketchup.google.com/3dwarehouse/search?uq=0799768103760527374326456' target='_blank'>artkadet</a>
</div><script>
require(['tquery.webaudio', 'tquery.lensflare', 'tquery.skymap'], function(){
var world = tQuery.createWorld().boilerplate().pageTitle('#info').start();
world.tCamera().position.z = -30;
// if webaudio is available in your browser
if( WebAudio.isAvailable ){
// enable webaudio
world.enableWebAudio();
// load sound track
var url = 'sounds/flymetothemoon.m4a';
tQuery.createSound().load(url, function(sound){
sound.loop(true).volume(4).play();
});
}
// add lensflare in the sun
tQuery.createLensFlare().addTo(world)
.position(tQuery.createVector3().set(-15, 24, 30).setLength(500) )
// create the container for the comboemitter
var container = tQuery.createObject3D().addTo(world)
var flamethrower= new Fireworks.ComboEmitter.Flamethrower({
webaudio: world.getWebAudio(),
onReady : function(){
flamethrower.start();
}
});
container.add( flamethrower.object3D() )
// make the sound follow this._container
WebAudio.isAvailable && flamethrower.sound().follow(container, world);
// add a skymap
var skymap = tQuery.createSkymap('mars').addTo(world);
// load the rockets
var loader = new THREE.ColladaLoader();
loader.options.convertUpAxis = true;
var url = "./models/TINTINROCKET/models/TIN TIN ROCKET.dae"
loader.load(url, function( collada ){
tQuery(collada.scene).scale(0.2)
.rotateX(Math.PI/2).rotateY(Math.PI/3)
.translateZ(-5)
.addTo(container);
});
// add lights
tQuery.createAmbientLight().addTo(world).color(0x222222);
tQuery.createDirectionalLight().addTo(world)
.color(0xcccccc).position(1, 1, 1)
tQuery.createDirectionalLight().addTo(world)
.color(0xcccccc).position(-1, 1, -1)
world.loop().hook(function(delta, now){
var angle = 0.2 * now * Math.PI/2;
// change the position of the rocket
var objPosition = container.get(0).position;
objPosition.x = Math.cos(angle*2)*Math.cos(angle)*20;
objPosition.z = Math.sin(angle)*10;
// change the camera position
var camPosition = world.tCamera().position;
camPosition.x = 2 * (Math.sin(angle*2.45)*Math.sin(angle*1.3)*2 - 1);
camPosition.y = -10 + Math.sin(angle*2.45)*Math.sin(angle*1.3)*25;
camPosition.z = -40 + 5 + Math.sin(angle*2)*10;
});
});
</script></body>
(C) Æliens
04/09/2009
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.