janusweb 1.5.30 → 1.5.34

package/scripts/janusplayer.js

@@ -2,7 +2,18 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
   elation.requireCSS('janusweb.janusplayer');
 
   elation.component.add('engine.things.janusplayer', function() {
-    this.defaultavatar = '<FireBoxRoom>\n  <Assets>\n    <AssetObject id="screen" src="https://web.janusxr.org/media/assets/hoverscreen.obj" mtl="https://web.janusxr.org/media/assets/hoverscreen.mtl" />\n  </Assets>\n  <Room>\n    <Ghost id="januswebuser" col="#ffffff" lighting="true" head_pos="0 1.4 0" body_id="" eye_pos="0 1.6 0" userid_pos="0 0.5 0" cull_face="back" screen_name="screen_Cube.004">\n      <Object id="screen" js_id="head" />\n    </Ghost>\n  </Room>\n</FireBoxRoom>'
+    //this.defaultavatar = '<FireBoxRoom>\n  <Assets>\n    <AssetObject id="screen" src="https://web.janusxr.org/media/assets/hoverscreen.obj" mtl="https://web.janusxr.org/media/assets/hoverscreen.mtl" />\n  </Assets>\n  <Room>\n    <Ghost id="januswebuser" col="#ffffff" lighting="true" head_pos="0 1.4 0" body_id="" eye_pos="0 1.6 0" userid_pos="0 0.5 0" cull_face="back" screen_name="screen_Cube.004">\n      <Object id="screen" js_id="head" />\n    </Ghost>\n  </Room>\n</FireBoxRoom>'
+    this.defaultavatar = `
+    <FireBoxRoom>
+      <assets>
+        <assetobject id="body" src="http://www.baicoianu.com/~bai/janusweb/test/janus-avatar-base.glb" />
+        <assetobject id="avatar_animations" src="http://www.baicoianu.com/~bai/janusweb/test/janus-avatar-animations.glb" />
+      </assets>
+      <room>
+        <ghost scale=".01 .01 .01" col="#e0d5a1" body_id="body" bone_head="head" />
+      </room>
+    </FireBoxRoom>
+    `;
 
     this.postinit = function() {
       elation.engine.things.janusplayer.extendclass.postinit.call(this);
@@ -15,9 +26,12 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
         cursor_visible: {type: 'boolean', default: true, set: this.toggleCursorVisibility},
         cursor_opacity: {type: 'float', default: 1.0, set: this.toggleCursorVisibility},
         usevoip: {type: 'boolean', default: false },
+        defaultanimation: {type: 'string', default: 'idle' },
         collision_radius: {type: 'float', default: .25, set: this.updateCollider},
         party_mode: { type: 'boolean', set: this.updatePartyMode },
         avatarsrc: { type: 'string' },
+        cameraview: { type: 'string', default: 'firstperson' },
+        decouplehead: { type: 'boolean', default: false },
       });
 
       var controllerconfig = this.getSetting('controls.settings');
@@ -32,7 +46,9 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       elation.events.add(this.engine.client.view.container, 'touchend', elation.bind(this, this.handleTouchEnd));
 
       this.controlstate2 = this.engine.systems.controls.addContext('janusplayer', {
-        'voip_active': ['keyboard_v,keyboard_shift_v', elation.bind(this, this.activateVOIP)],
+        'toggle_view': ['keyboard_v,keyboard_shift_v', elation.bind(this, this.toggleCamera)],
+        'zoom_out': ['mouse_wheel_down', ev => this.zoomView(-1)],
+        'zoom_in': ['mouse_wheel_up', ev => this.zoomView(1)],
         //'browse_back': ['gamepad_any_button_4', elation.bind(this, this.browseBack)],
         //'browse_forward': ['gamepad_any_button_5', elation.bind(this, this.browseForward)],
       });
@@ -100,7 +116,7 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       elation.events.add(this.engine.client.container, 'mousedown', elation.bind(this, this.updateMouseStatus));
       elation.events.add(this.engine.client.container, 'mouseup', elation.bind(this, this.updateMouseStatus));
 
-      elation.events.add(this.room, 'mouseover,mouseout', elation.bind(this, this.updateCursorStyle));
+      this.updateCursorStyle = elation.bind(this, this.updateCursorStyle);
 
       this.touchcache = {
         positions: []
@@ -122,11 +138,13 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
 
       this.getAvatarData().then(avatar => {;
         if (avatar && false) { // FIXME - self avatar is buggy so it's disabled
+/*
           this.ghost = this.createObject('ghost', {
             ghost_id: this.getUsername(),
             avatar_src: 'data:text/plain,' + encodeURIComponent(avatar),
             showlabel: false
           });
+*/
         }
       });
 
@@ -264,14 +282,11 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
             }
           }
         }
-        if (this.ghost) {
+        if (this.ghost && !this.decouplehead) {
+          this.ghost.setHeadOrientation(this.head.orientation, true);
           if (this.ghost._target.head) {
             //this.ghost._target.face.position.copy(this.head.position);
-            this.ghost.head.orientation.copy(this.head.orientation);
-          }
-          if (this.ghost._target.body) {
-            //this.ghost._target.body.position.copy(this.body.position);
-            //this.ghost._target.body.orientation.copy(this.body.orientation);
+            this.ghost.head.orientation.copy(this.head.orientation).invert();
           }
         }
       }
@@ -280,6 +295,10 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       if (this.lookAtLERPtime) {
         this.updateLookAtLERP();
       }
+      if (this.ghost && this.ghost.body) {
+        let animid = this.getAnimationID();
+        this.ghost.body.anim_id = animid;
+      }
     }
     this.updateCursor = (function() {
       var _tmpvec = new THREE.Vector3();
@@ -349,10 +368,10 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
         if (typeof playerpos.z == 'undefined' || isNaN(playerpos.z)) playerpos.z = 0;
         this.objects['3d'].updateMatrix();
         this.objects['3d'].updateMatrixWorld();
-        this.objects['3d'].matrixWorld.extractBasis(v.xdir, v.ydir, v.zdir)
+        this.objects['3d'].matrixWorld.extractBasis(v.xdir, v.ydir, v.zdir);
       }
       if (this.head) {
-        this.head.objects['3d'].matrixWorld.extractBasis(v.view_xdir, v.view_ydir, v.view_zdir)
+        this.head.objects['3d'].matrixWorld.extractBasis(v.view_xdir, v.view_ydir, v.view_zdir);
         v.head_pos.setFromMatrixPosition(this.head.objects['3d'].matrixWorld);
         v.view_zdir.negate();
       }
@@ -375,6 +394,21 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
           this.gaze.fired = true;
         }
       }
+      if (this.controlstate.jump && !this.jumping) {
+        let jumptime = 1;
+        if (this.ghost && this.ghost.body.animations && this.ghost.body.animations.jump) {
+          let jumpanim = this.ghost.body.animations.jump;
+          let jumpclip = jumpanim.getClip();
+
+          jumpanim.loop = THREE.LoopOnce;
+
+          if (jumpclip) {
+            jumptime = jumpclip.duration;
+          }
+          this.jumping = true;
+          setTimeout(() => this.jumping = false, (jumptime * 1000) * .8);
+        }
+      }
     }
     this.updateMouseStatus = function(ev) {
       if (ev.type == 'mousedown' && ev.button === 0) {
@@ -412,10 +446,15 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
     }
     this.setRoom = function(newroom) {
       if (this.room) {
+        let oldroomproxy = this.room.getProxyObject();
+        oldroomproxy.removeEventListener('mouseover', this.updateCursorStyle);
+        oldroomproxy.removeEventListener('mouseout', this.updateCursorStyle);
         this.room.part();
       }
       this.room = newroom;
       this.room.join();
+
+/*
       if (!this.gazecaster) {
         this.gazecaster = newroom.createObject('raycaster', {persist: false});
         this.head.add(this.gazecaster._target);
@@ -426,6 +465,11 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       } else {
         this.gazecaster.setRoom(newroom);
       }
+*/
+      let newroomproxy = newroom.getProxyObject();
+      newroomproxy.addEventListener('mouseover', this.updateCursorStyle);
+      newroomproxy.addEventListener('mouseout', this.updateCursorStyle);
+
       if (!this.cursors) {
         this.cursors = {
           'default': janus.getAsset('image', 'cursor_crosshair'),
@@ -435,25 +479,27 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
           'dot_active': janus.getAsset('image', 'cursor_dot_active'),
         };
       }
-      if (!this.room.selfavatar && this.ghost) {
-        this.ghost.die();
-        this.ghost = false;
-        this.visible = false;
-      } else if (!this.ghost && this.room.selfavatar) {
+      newroom.appendChild(this.getProxyObject());
+      if (this.ghost) {
+        this.ghost.setRoom(newroom);
+      } else if (!this.ghost) { // && this.room.selfavatar) {
         // FIXME - self avatar is buggy so it's disabled
         this.getAvatarData().then(avatar => {
           if (avatar) {
             this.ghost = this.createObject('ghost', {
               ghost_id: this.getUsername(),
               avatar_src: 'data:text/plain,' + encodeURIComponent(avatar),
-              showlabel: false
+              showlabel: false,
+              //pos: V(0, -this.fatness, 0),
+              rotation: V(0, 180, 0),
+              renderorder: 101,
             });
+            this.ghost.orientation.set(0,1,0,0);
           }
         });
         this.visible = true;
       }
 
-      newroom.appendChild(this.getProxyObject());
       for (let k in this.children) {
         if (this.children[k].setRoom) {
           this.children[k].setRoom(room);
@@ -553,6 +599,9 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
 
         collision_radius: ['property', 'collision_radius'],
 
+        currentavatar: ['property', 'currentavatar'],
+        defaultanimation: ['property', 'defaultanimation'],
+
         localToWorld:  ['function', 'localToWorld'],
         worldToLocal:  ['function', 'worldToLocal'],
         appendChild:   ['function', 'appendChild'],
@@ -601,15 +650,13 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       if (this.ghost) {
         this.ghost.die();
       }
-      this.getAvatarData().then(avatardata => {
-        // FIXME - self avatar is broken and weird right now, so it's disabled
-        if (avatardata && this.room.selfavatar) {
-          this.ghost = this.createObject('ghost', {
-            ghost_id: this.getUsername(),
-            avatar_src: 'data:text/plain,' + encodeURIComponent(avatardata),
-            showlabel: false
-          });
-        }
+      this.ghost = this.createObject('ghost', {
+        ghost_id: this.getUsername(),
+        avatar_src: 'data:text/plain,' + encodeURIComponent(avatar),
+        showlabel: false,
+        //pos: V(0, -this.fatness, 0),
+        rotation: V(0, 180, 0),
+        renderorder: 101,
       });
 
       return setting;
@@ -632,17 +679,19 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       return voipdata;
     }
     this.getAnimationID = function() {
-      var animid = 'idle';
-      if (this.controlstate.run) {
-        animid = 'run';
-      } else if (this.controlstate.move_forward) {
-        animid = 'walk';
+      var animid = this.defaultanimation;
+      let running = this.controlstate.run;
+
+      if (this.jumping) {
+        animid = 'jump';
       } else if (this.controlstate.move_left) {
-        animid = 'walk_left';
+        animid = (running ? 'run' : 'walk_left');
       } else if (this.controlstate.move_right) {
-        animid = 'walk_right';
+        animid = (running ? 'run' : 'walk_right');
+      } else if (this.controlstate.move_forward) {
+        animid = (running ? 'run' : 'walk');
       } else if (this.controlstate.move_backward) {
-        animid = 'walk_back';
+        animid = (running ? 'run' : 'walk_back');
       } else if (document.activeElement && this.properties.janus.chat && document.activeElement === this.properties.janus.chat.input.inputelement) {
         animid = 'type';
       } else if (this.hasVoipData()) {
@@ -737,10 +786,9 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
     }
     this.updateCursorStyle = function(ev) {
       var vrdisplay = this.engine.systems.render.views.main.vrdisplay;
-      var obj = ev.target || ev.element;
+      var obj = ev.element;
       var proxyobj = (obj.getProxyObject ? obj.getProxyObject() : obj);
 
-
       if (obj && proxyobj && (ev.type == 'mouseover' || ev.type == 'mousemove') && (
             obj.onclick ||
             elation.events.hasEventListener(obj, 'click') ||
@@ -793,8 +841,15 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
     this.updateCollider = function() {
       if (this.objects['dynamics']) {
         if (this.collision_radius > 0) {
+/*
           this.setCollider('sphere', {
             radius: this.collision_radius,
+          });
+*/
+          this.pickable = false;
+          this.setCollider('capsule', {
+            radius: this.collision_radius,
+            length: 1,
             offset: V(0, this.collision_radius, 0)
           });
         } else {
@@ -1036,6 +1091,40 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
         round: true,
         shader_id: 'defaultportal',
       });
+
+      // FIXME - should only set this if we have an active portal animation, and we should use the animation's duration for our timeout
+      this.defaultanimation = 'portal';
+      setTimeout(() => this.defaultanimation = 'idle', 3000);
+    }
+    this.toggleCamera = function(ev) {
+      if (ev.value == 1) {
+        if (this.cameraview == 'firstperson') {
+          this.cameraview = 'thirdperson';
+          this.camera.position.z = 2;
+        } else {
+          this.cameraview = 'firstperson';
+          this.camera.position.z = 0;
+        }
+      }
+    }
+    this.zoomView = function(amount) {
+      if (this.cameraview == 'thirdperson') {
+        this.camera.position.z -= amount / 10;
+      }
+    }
+    this.setAnimationSequence = function(sequence) {
+      let t = 0;
+      let currentanimation = this.defaultanimation;
+      let body = this.ghost.body;
+      sequence.forEach(clipname => {
+        let anim = body.animations[clipname];
+        if (anim) {
+          let clip = anim.getClip();
+          setTimeout(() => { this.defaultanimation = clipname; }, t * 1000);
+          t += clip.duration;
+        }
+      });
+      setTimeout(() => { this.defaultanimation = currentanimation; }, t * 1000);
     }
   }, elation.engine.things.player);
 });

package/scripts/janusweb.js

@@ -101,7 +101,7 @@ elation.require([
       if (this.urltemplate) {
         dust.filters.stripunsafe = function(s) {
           return s.replace(/:\//g, '');
-        }
+        };
         elation.template.add('janusweb.url', this.urltemplate);
       }
       this.initScripting();
@@ -157,6 +157,7 @@ elation.require([
         userid:            ['property', 'userId'],
         avatarlighting:    ['property', 'settings.avatarlighting'],
         ui:                ['property', 'engine.client.ui'],
+        currentroom:       ['property', 'currentroom'],
 
         hmd:               ['accessor', 'isVRActive'],
 
@@ -170,6 +171,9 @@ elation.require([
         navback:           ['function', 'navigateBack'],
         navforward:        ['function', 'navigateForward'],
         load:              ['function', 'navigateTo'],
+        setActiveRoom:     ['function', 'setActiveRoom'],
+        preload:           ['function', 'preload'],
+        createRoom:        ['function', 'createRoom'],
         navhome:           ['function', 'navigateHome'],
         chatsend:          ['function', 'sendChatMessage'],
         sync:              ['function', 'currentroom.sync'],
@@ -407,6 +411,26 @@ elation.require([
         this.load(url, true, null, referrer === false);
       }
     }
+    this.preload = function(url, stripreferrer) {
+      return this.load(url, false, null, stripreferrer);
+    }
+    this.createRoom = function(url, makeactive=true) {
+      let newroom = this.spawn('janusroom', url, {
+        url: url,
+        janus: this,
+        corsproxy: this.corsproxy,
+        deferload: true
+      });
+
+      this.rooms[newroom.roomid] = newroom;
+      //console.log('made new room', url, room);
+      this.loading = false;
+      if (newroom && makeactive) {
+        this.setActiveRoom(newroom);
+      }
+      this.initScripting();
+      return newroom.getProxyObject();
+    }
     this.getFixedURL = function(url) {
       // Our 'clean' client URLs don't contain a : because many services have problems parsing them
       var m = url.match(/^(https?)\/\/?(.*)$/i);
@@ -506,7 +530,7 @@ elation.require([
     }
     this.handleRoomEditOther = function(data) {
       var roomId = data.roomId,
-          movedata = data.position;
+          movedata = data.position,
           edit = movedata.room_edit,
           del = movedata.room_delete;
 

package/scripts/janusxrplayer.js

@@ -316,10 +316,9 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
               const minNode = motionControllerRoot.getObjectByName(visualResponse.minNodeName);
               const maxNode = motionControllerRoot.getObjectByName(visualResponse.maxNodeName);
 
-              THREE.Quaternion.slerp(
+              valueNode.quaternion.slerp(
                 minNode.quaternion,
                 maxNode.quaternion,
-                valueNode.quaternion,
                 visualResponse.value
               );
 
@@ -563,6 +562,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
           lighting: false,
           opacity: .5,
           cull_face: 'none',
+          billboard: 'y',
         });
         this.raycaster = this.createObject('raycaster', {});
         this.raycaster.addEventListener('raycastenter', (ev) => this.handleRaycastEnter(ev));
@@ -573,8 +573,10 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
         this.worldToLocal(this.laser.positions[1].copy(endpoint));
         this.laser.updateLine();
         this.cursor.pos.copy(endpoint);
+        let cursorscale = player.head.distanceTo(endpoint) / 12;
+        this.cursor.scale.set(cursorscale, cursorscale, cursorscale);
         //this.cursor.zdir = normal;
-        if (this.cursor.room !== room) room.appendChild(this.cursor);
+        if (this.cursor.room !== room._target) room.appendChild(this.cursor);
         //this.cursor.zdir.copy(player.view_dir).multiplyScalar(-1);
         //this.cursor.zdir = normal;
         this.cursor.visible = true;

package/scripts/multiplayermanager.js

@@ -180,7 +180,7 @@ console.log('[MultiplayerManager] set active room:', room, this.activeroom);
           dir: (-tmpVecZ.x) + ' ' + (-tmpVecZ.y) + ' ' + (-tmpVecZ.z),
           up_dir: '0 1 0',
           //view_dir: this.tmpVecZ.toArray().join(' ')
-        }
+        };
         if (head) {
           //this.tmpMat.makeRotationFromQuaternion(head.properties.orientation);
           tmpMat.copy(head.objects['3d'].matrixWorld);
@@ -230,8 +230,8 @@ console.log('[MultiplayerManager] set active room:', room, this.activeroom);
       //console.log('[MultiplayerManager] player update', moveData);
       if (this.avatarNeedsUpdate || player.avatarNeedsUpdate) {
         moveData.avatar = player.getCurrentAvatarData().replace(/"/g, "^");
-        this.avatarNeedsUpdate = false
-        player.avatarNeedsUpdate = false
+        this.avatarNeedsUpdate = false;
+        player.avatarNeedsUpdate = false;
       } else if (moveData.avatar) {
         delete moveData.avatar;
       }
@@ -319,9 +319,9 @@ console.log('[MultiplayerManager] part', room.url);
       var roomId = data.roomId;
 
       var room = this.rooms[roomId] || this.activeroom;
-console.log('[MultiplayerManager] spawn remote guy', userId, roomId, room);
 
       var spawnpos = (data.position && data.position.pos ? data.position.pos.split(" ").map(parseFloat) : [0,0,0]);
+      //console.log('[MultiplayerManager] spawn remote guy', userId, roomId, room, spawnpos);
       this.remoteplayers[userId] = room.spawn('remoteplayer', userId, { position: spawnpos, player_id: userId, player_name: userId, pickable: false, collidable: false, janus: this.janusweb, room: room});
       var remote = this.remoteplayers[userId];
 
@@ -330,6 +330,7 @@ console.log('[MultiplayerManager] spawn remote guy', userId, roomId, room);
 
       // If a new player spawned, let's send an avatar update ASAP
       this.updateAvatar();
+      remote.start();
       return remote;
     }
     this.updateAvatar = function() {
@@ -390,6 +391,7 @@ console.log('[MultiplayerManager] spawn remote guy', userId, roomId, room);
 
         if (remote.room !== room) {
           remote.setRoom(room);
+          remote.start();
         }
 
         remote.updateData(movedata);