topical media & game development

talk show tell print

mobile-query-three-plugins-ogsworkshop-examples-game050.htm / htm



  <!--
          little clean up before actual multi player
  	* functions to create/destroy player
  -->
  
  <!doctype html><title>Minimal tQuery Page</title>
  <script src="../../../build/tquery-bundle-require.js"></script>
  
  <!-- all network scripts -->
  <script src="http://localhost:4000/socket.io/socket.io.js"></script>
  <script src="http://localhost:4000/examples/client.js"></script>
  
  <body><script>
  require(['tquery.minecraft', 'tquery.skymap', 'tquery.grassground', 'tquery.keyboard'
          , 'tquery.shadowmap'], function(){
          // create world
          var world        = tQuery.createWorld().boilerplate().start();
  
          // enable shaddow in the renderer
          world.tRenderer().shadowMapEnabled        = true;
          world.tRenderer().shadowMapSoft                = true;
  
          // add a skybox
          tQuery.createSkymap('skybox').addTo(world);
  
          // add a ground        
          var ground  = tQuery.createGrassGround({
                  textureRepeatX  : 20,
                  textureRepeatY  : 20,
          }).addTo(world)
                  .scale(80)
                  .receiveShadow(true)
          
          ground.get(0).material.map.anisotropy = 16;
  
  

/////////////////////////////////////////////////////////////////

// lights //

/////////////////////////////////////////////////////////////////

var light = tQuery.createDirectionalLight().addTo(world) .position(-1, 2, 3) .color(0xffffff).intensity(4) .castShadow(true) .shadowDarkness(0.4) .shadowMap(512*2,512*2) .shadowCamera(8, -8, 8, -8, 0.1, 10) .shadowCameraVisible(true) // for light to follow character world.loop().hook(function(){ if( !players[mySourceId] ) return; var player = players[mySourceId]; var character = player.character; var model = character.object3D('root'); light.get(0).target.position.copy(model.position()); var delta = tQuery.createVector3(-1,2,3); var position = model.position().clone().addSelf(delta); light.position(position) });

/////////////////////////////////////////////////////////////////

// network //

/////////////////////////////////////////////////////////////////

// init the gameServer var mySourceId = null; var players = {}; // initiate connect with server var serverUrl = 'http://localhost:4000'; var userInfo = { nickName : 'Player-'+Math.floor(Math.random()*10000).toString(16), skinBasename : 'char.png', }; var gameServer = new SimpleMMOServer('public', userInfo, serverUrl); // handle event gameServer.addEventListener('connected', function(sourceId, usersInfo){ console.log('connected', arguments) createMyPlayer(sourceId, gameServer.userInfo()) }); gameServer.addEventListener('userJoin', function(data){ console.log('userJoin', arguments) }); gameServer.addEventListener('userLeft', function(data){ console.log('userLeft', data) });
////////////////////////////////////////////////////////////////////////////

// //
////////////////////////////////////////////////////////////////////////////

function createMyPlayer(sourceId, userInfo){ console.assert(mySourceId === null) mySourceId = sourceId; createPlayer(mySourceId, userInfo) var character = players[mySourceId].character; // to enable a tracking camera var cameraControls = tQuery.createCameraFpsControls({ trackedObject : character.object3D('root').get(0), tCamera : world.tCamera() }); world.setCameraControls(cameraControls) //cameraControls.deltaCamera().position(0, 0.7, -0.07)

//////////////////////////////////////////////////////////////////

// user controls on keyboard //

//////////////////////////////////////////////////////////////////

tQuery.createMinecraftCharKeyboard2({ object3D : character.object3D('root').get(0), lateralMove : 'rotationY', //lateralMove : 'strafe' }); // periodically send the position of the character // - NOTE: not done on requestAnimationFrame as it has to be done even if page isnt visible setInterval(function(){ var mesh = character.object3D('root'); var position = mesh.position(); var rotation = mesh.rotation(); gameServer.clientEcho({ type : 'positionChange', position: { x : position.x, y : position.y, z : position.z }, rotation: { x : rotation.x, y : rotation.y, z : rotation.z }, }); }, 1000/60); } function createPlayer(sourceId, userInfo){ console.assert(players[sourceId] === undefined); players[sourceId] = {} // create the minecraft character var skinUrl = '../../minecraft/examples/images/'+userInfo.skinBasename; var character = tQuery.createMinecraftChar({ skinUrl : skinUrl }).addTo(world); tQuery('mesh', character.object3D('root')).castShadow(true) // store it players[sourceId].character = character; // init bodyAnims var bodyAnims = new tQuery.MinecraftCharAnimations(character); bodyAnims.start('run'); players[sourceId].bodyAnims = bodyAnims; // init prevPosition/prevRotation to estimate velocity later players[sourceId].prevPosition = tQuery.createVector3() players[sourceId].prevRotation = tQuery.createVector3() } function destroyPlayer(sourceId){ var player = players[sourceId]; player.character.removeFrom(world) player.bodyAnims.stop() delete players[sourceId] } }) </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.