topical media & game development
mobile-query-three-plugins-iimdesignparam-examples-index.htm / htm
<!doctype html><title>Minimal tQuery Page</title>
<script src="../../../build/tquery-bundle-require.js"></script>
<body><script>
require(['tquery.text', 'tquery.linkify', 'tquery.checkerboard', 'tquery.videos', 'tquery.fog'], function(){
var world = tQuery.createWorld().boilerplate().start();
var object = tQuery.createTorus().addTo(world);
// no camera controls is needed
world.removeCameraControls();
world.tCamera().position.z += 10;
world.tCamera().position.y += 2;
world.tCamera().position.normalize().setLength(4)
world.tCamera().lookAt(tQuery.createVector3(0,0.5,0));
// add a fog
world.addFogExp2({density : 0.05});
// add some lights
tQuery.createAmbientLight().addTo(world).color(0x444444);
tQuery.createDirectionalLight().addTo(world).position(1,1,-1).color(0xFFFFFF);
tQuery.createDirectionalLight().addTo(world).position(-1,1,1).color(0xffffff).intensity(1);
// add a text
var text = tQuery.createText("tQuery").addTo(world)
.scaleBy(1/3)
.setLambertMaterial().ambient(0x444444).color(0xEE1289).back()
.rotateY(-Math.PI/3)
.translateX(1.3).translateY(0.5)
// enable dom events
world.enableDomEvent()
// make it a link
text.linkify('github.com/jeromeetienne/tquery/');
// add a checkerboard on the ground
tQuery.createCheckerboard({
segmentsW : 100, // number of segment in width
segmentsH : 100 // number of segment in Height
}).addTo(world).scaleBy(100);
var fish = tQuery.createCube().addTo(world)
.setLambertMaterial()
.map("../../assets/images/water.jpg")
//.map(tQuery.createVideoTexture('../../videos/examples/sintel.ogv'))
.color(0xFFFFFF)
//.opacity(0.5)
.back()
.translateY(1).translateZ(-1.5)
.id('fish')
var turning = true;
fish.on('click', function(){
turning = !turning;
})
tQuery.world.loop().hook(function(delta, now){
if( turning === false ) return;
var angleDiff = 90 * delta * Math.PI / 180;
tQuery('#fish').rotateX(angleDiff*2).rotateY(angleDiff).rotateZ(angleDiff*2);
});
var texture = tQuery.createWebcamTexture();
//var texture = tQuery.createTVSnowTexture();
//var texture = tQuery.createVideoTexture('../../videos/examples/sintel.ogv');
tQuery.createCube(1.6,0.9,0.2).addTo(world)
.setBasicMaterial().map(texture).back()
.translateX(-1.3).translateY(0.5).translateZ(-0.4)
.rotateY(Math.PI/4)
.on('click', function(event){
var tObject3D = event.target;
var videoElem = tObject3D.material.map.image;
//console.log("click on cube", event, tObject.material.map)
var notPlaying = videoElem.paused || videoElem.ended;
if(notPlaying) videoElem.play();
else videoElem.pause();
});
});
</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.