janusweb 1.5.41 → 1.5.42

package/scripts/janusweb.js

@@ -1,6 +1,6 @@
 elation.require([
   'janusweb.config', 'engine.things.generic','janusweb.remoteplayer', 'janusweb.room', 'janusweb.tracking', 'janusweb.multiplayermanager', 'janusweb.external.JanusFireboxParser', 'utils.proxy',
-  'janusweb.elements.raycaster', 'janusweb.elements.teleporter', 'janusweb.elements.linesegments'], function() {
+  'janusweb.elements.raycaster', 'janusweb.elements.teleporter', 'janusweb.elements.linesegments', 'janusweb.elements.outliner'], function() {
 
   elation.requireCSS('janusweb.janusweb');
   elation.component.add('engine.things.janusweb', function() {
@@ -74,7 +74,11 @@ elation.require([
       });
       elation.events.add(window, 'popstate', elation.bind(this, this.handlePopstate));
 
-      this.bookmarks = elation.collection.localindexed({index: 'url', storagekey: 'janusweb.bookmarks'});
+      try {
+        this.bookmarks = elation.collection.localindexed({index: 'url', storagekey: 'janusweb.bookmarks'});
+      } catch (e) {
+        this.bookmarks = elation.collection.indexed({index: 'url', storagekey: 'janusweb.bookmarks'});
+      }
 
       if (this.corsproxy != '') {
         elation.engine.assets.setCORSProxy(this.corsproxy);
@@ -108,7 +112,7 @@ elation.require([
 
       this.assetpack.executeWhenLoaded(() => {
         // TODO - this should be config-driven
-        this.registerAdditionalElements(['raycaster', 'linesegments']);
+        this.registerAdditionalElements(['raycaster', 'linesegments', 'outliner']);
 
         if (this.networking) {
           this.network = elation.janusweb.multiplayermanager({
@@ -620,7 +624,7 @@ elation.require([
     this.registerElement = function(tagname, classobj, extendclass) {
       if (!extendclass || !elation.engine.things[extendclass]) extendclass = 'janusbase';
       tagname = tagname.toLowerCase();
-console.log('Register new SYSTEM tag type:', tagname, classobj, extendclass);
+      //console.log('Register new SYSTEM tag type:', tagname, classobj, extendclass);
       elation.component.add('engine.things.' + tagname, classobj, elation.engine.things[extendclass]);
 /*
       this.typemap[tagname] = tagname;

package/scripts/janusxrplayer.js

@@ -282,7 +282,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
         janus.engine.systems.controls.removeVirtualGamepad(this.device.gamepad);
       },
       async createMotionController(xrInputSource) {
-        let uri = 'https://baicoianu.com/~bai/webxr-input-profiles/packages/assets/dist/profiles';
+        let uri = 'https://cdn.jsdelivr.net/npm/@webxr-input-profiles/assets@latest/dist/profiles';
         const { profile, assetPath } = await elation.janusweb.external.webxrinput.fetchProfile(xrInputSource, uri);
         const motionController = new elation.janusweb.external.webxrinput.MotionController(xrInputSource, profile, assetPath);
         this.motionController = motionController;
@@ -291,6 +291,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
 
         this.controller = this.createObject('object', {
           id: 'blah-' + this.device.handedness,
+          cull_face: 'back',
           visible: true,
         });
         this.controller.addEventListener('load', (ev) => { this.controller.visible = true; });
@@ -375,7 +376,10 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
             if (this.controller) this.controller.visible = false;
             if (this.skeleton) this.skeleton.visible = true;
           } else {
-            if (this.controller) this.controller.visible = true;
+            if (this.controller) {
+              this.controller.visible = true;
+              this.controller.opacity = player.cursor_opacity;
+            }
             if (this.skeleton) {
               this.skeleton.die();
               this.skeleton = false;
@@ -389,6 +393,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
         if (this.pointer && raypose) {
           this.pointer.pos.copy(raypose.transform.position);
           this.pointer.orientation.copy(raypose.transform.orientation);
+          this.pointer.updateCursorOpacity();
         }
       },
       createButtons() {
@@ -541,6 +546,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
           opacity: .8,
           col: this.lasercolor,
           visible: false,
+          transparent: true,
         });
         this.bonk = this.createObject('object', {
           id: 'cylinder',
@@ -563,6 +569,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
           opacity: .5,
           cull_face: 'none',
           billboard: 'y',
+          transparent: true,
         });
         this.raycaster = this.createObject('raycaster', {});
         this.raycaster.addEventListener('raycastenter', (ev) => this.handleRaycastEnter(ev));
@@ -581,6 +588,41 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
         //this.cursor.zdir = normal;
         this.cursor.visible = true;
       },
+      updateCursorOpacity() {
+        if (!this.activeobject) return;
+        let proxyobj = this.activeobject,
+            obj = proxyobj._target;
+        if (obj && proxyobj && (
+              obj.onclick ||
+              elation.events.hasEventListener(obj, 'click') ||
+              elation.events.hasEventListener(proxyobj, 'click') ||
+              obj.onmousedown ||
+              elation.events.hasEventListener(obj, 'mousedown') ||
+              elation.events.hasEventListener(proxyobj, 'mousedown')
+            )) {
+          this.laser.col.setRGB(0,255,0);
+          this.laser.opacity = player.cursor_opacity * .8;
+          this.laser.updateColor();
+          this.cursor.image_id = 'cursor_dot_active';
+          this.cursor.opacity = player.cursor_opacity;
+          //this.laser.visible = false; // FIXME - hack to disable laser without breaking things
+
+/*
+          let gamepad = this.device.gamepad;
+          if ("hapticActuators" in gamepad && gamepad.hapticActuators.length > 0) {
+            gamepad.hapticActuators[0].pulse(1, 100);
+          }
+*/
+
+        } else {
+          this.laser.col.setRGB(255,0,0);
+          this.laser.opacity = player.cursor_opacity * .4;
+          this.laser.updateColor();
+          this.cursor.image_id = 'cursor_dot_inactive';
+          this.cursor.opacity = player.cursor_opacity / 2;
+          //this.laser.visible = false; // FIXME - hack to disable laser without breaking things
+        }
+      },
       handleRaycastEnter(ev) {
         let proxyobj = ev.data.object,
             obj = proxyobj._target;
@@ -607,10 +649,10 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
               elation.events.hasEventListener(proxyobj, 'mousedown')
             )) {
           this.laser.col.setRGB(0,1,0);
-          this.laser.opacity = .8;
+          this.laser.opacity = player.cursor_opacity * .8;
           this.laser.updateColor();
           this.cursor.image_id = 'cursor_dot_active';
-          this.cursor.opacity = 1;
+          this.cursor.opacity = player.cursor_opacity;
           //this.laser.visible = false; // FIXME - hack to disable laser without breaking things
 
 /*
@@ -622,10 +664,10 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
 
         } else {
           this.laser.col.setRGB(1,0,0);
-          this.laser.opacity = .4;
+          this.laser.opacity = player.cursor_opacity * .4;
           this.laser.updateColor();
           this.cursor.image_id = 'cursor_dot_inactive';
-          this.cursor.opacity = .5;
+          this.cursor.opacity = player.cursor_opacity / 2;
           //this.laser.visible = false; // FIXME - hack to disable laser without breaking things
         }
 
@@ -669,7 +711,7 @@ elation.require(['engine.things.generic', 'janusweb.external.webxr-input-profile
       },
       handleRaycastLeave(ev) {
         this.laser.col.setRGB(0,1,1);
-        this.laser.opacity = .2;
+        this.laser.opacity = player.cursor_opacity * .2;
         this.laser.updateColor();
       },
       handleSelectStart(ev) {

package/scripts/multiplayermanager.js

@@ -272,6 +272,10 @@ console.log('[MultiplayerManager] set active room:', room, this.activeroom);
           };
         }
       } 
+      let morphtargetdata = player.getMorphTargetData();
+      if (morphtargetdata) {
+        moveData.morphtargets = morphtargetdata
+      }
 
 //console.log(moveData, server, room);
       server.send({'method': 'move', 'data': moveData});

package/scripts/object.js

@@ -191,6 +191,7 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
           if (this.animations && this.anim_id && this.animations[this.anim_id]) {
             console.log('start animation', this);
             this.animations[this.anim_id].play();
+            this.activeanimation = this.animations[this.anim_id];
           }
         }
         if (this.loadingindicator) {
@@ -843,8 +844,9 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
                 m.emissiveMap = textureEmissive;
                 textureEmissive.encoding = THREE.sRGBEncoding;
                 m.emissive = new THREE.Color(0xffffff);
-              } else {
+              } else if (this.emissive) {
                 //m.emissive = this.emissive.clone();
+                m.emissive.copy(this.emissive)
               }
               m.emissiveIntensity = this.emissive_intensity;
             }
@@ -863,7 +865,7 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
               m.metalness = this.metalness;
             }
 
-            if (this.isUsingPBR()) {
+            if (this.isUsingPBR() && !this.isUsingToonShader()) {
               m.envMap = this.getEnvmap();
             }
 
@@ -881,7 +883,7 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
                 m.transparent = true;
               }
             } else {
-              m.blending = THREE.NormalBlending;
+              //m.blending = THREE.NormalBlending;
             }
             if (this.depth_write !== null) {
               m.depthWrite = this.depth_write;
@@ -973,9 +975,10 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
         var m = materials;
       } else if (oldmat instanceof THREE.PointsMaterial ||
                  oldmat instanceof THREE.LineBasicMaterial ||
-                 oldmat instanceof THREE.LineDashedMaterial
+                 oldmat instanceof THREE.LineDashedMaterial ||
+                 oldmat instanceof THREE.ShaderMaterial
                 ) {
-        var m = oldmat.clone();
+        var m = oldmat;
       } else {
         var m = this.allocateMaterial();
         m.dithering = true;
@@ -1009,7 +1012,7 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
         }
         m.transmission = oldmat.transmission;
         m.transmissionMap = oldmat.transmissionMap;
-        m.transparent = m.opacity < 1;
+        m.transparent = oldmat.transparent || m.opacity < 1;
         m.alphaTest = oldmat.alphaTest;
         m.skinning = oldmat.skinning;
 
@@ -1019,11 +1022,12 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
         if (oldmat.roughnessMap !== undefined) m.roughnessMap = oldmat.roughnessMap;
         if (oldmat.clearcoat !== undefined) m.clearcoat =  oldmat.clearcoat;
         if (oldmat.clearcoatMap !== undefined) m.clearcoatMap = oldmat.clearcoatMap;
-        if (oldmat.clearcoatRoughness !== undefined) m.clearcoatcoughness = oldmat.clearcoatRoughness;
+        if (oldmat.clearcoatRoughness !== undefined) m.clearcoatRoughness = oldmat.clearcoatRoughness;
         if (oldmat.clearcoatRoughnessMap !== undefined) m.clearcoatRoughnessMap = oldmat.clearcoatRoughnessMap;
         if (oldmat.clearcoatNormalMap !== undefined) m.clearcoatNormalMap = oldmat.clearcoatNormalMap;
         if (oldmat.clearcoatNormalScale !== undefined) m.clearcoatNormalScale = oldmat.clearcoatNormalScale;
         if (oldmat.attenuationTint !== undefined) m.attenuationTint = oldmat.attenuationTint;
+        if (oldmat.attenuationColor !== undefined) m.attenuationColor = oldmat.attenuationColor;
         if (oldmat.attenuationDistance !== undefined) m.attenuationDistance = oldmat.attenuationDistance;
         if (oldmat.thickness !== undefined) m.thickness = oldmat.thickness;
         if (oldmat.thicknessMap !== undefined) m.thicknessMap = oldmat.thicknessMap;
@@ -1108,10 +1112,10 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
       if (this.shader_id) {
       } else if (!this.lighting) {
         return new THREE.MeshBasicMaterial();
-      } else if (this.isUsingPBR()) {
-        return new THREE.MeshPhysicalMaterial();
       } else if (this.isUsingToonShader()) {
         return new THREE.MeshToonMaterial();
+      } else if (this.isUsingPBR()) {
+        return new THREE.MeshPhysicalMaterial();
       }
       return new THREE.MeshPhongMaterial();
     }
@@ -1407,6 +1411,14 @@ elation.require(['janusweb.janusbase', 'janusweb.websurface'], function() {
       }
 
     }
+    this.cloneAnimations = function(object) {
+      if (object.animations && this.animationmixer) {
+        for (let k in object.animations) {
+          let action = this.animationmixer.clipAction(object.animations[k]._clip);
+          this.animations[k] = action;
+        }
+      }
+    }
     this.getProxyObject = function(classdef) {
       if (!this._proxyobject) {
         this._proxyobject = elation.engine.things.janusobject.extendclass.getProxyObject.call(this, classdef);

package/scripts/room.js

@@ -53,8 +53,8 @@ elation.require([
         'defaultlights': { type: 'bool', default: true, set: this.updateLights },
         'shadows': { type: 'bool', default: false, set: this.updateShadows },
         'party_mode': { type: 'bool', default: true },
-        'walk_speed': { type: 'float', default: 1.8 },
-        'run_speed': { type: 'float', default:  5.4 },
+        'walk_speed': { type: 'float', default: 1.8, set: this.updatePlayerSpeed },
+        'run_speed': { type: 'float', default:  5.4, set: this.updatePlayerSpeed },
         'jump_velocity': { type: 'float', default: 5.0 },
         'flying': { type: 'boolean', default: true, set: this.updateFlying },
         'gravity': { type: 'float', default: 0, set: this.updateGravity },
@@ -706,9 +706,9 @@ elation.require([
     }
     this.parseSource = function(data) { 
       this.fullsource = data;
-      var titlere = /<title>([\s\S]*?)<\/title>/mi;
-      var re = /<fireboxroom>[\s\S]*?<\/fireboxroom>/mi;
-      var re2 = /<janus-viewer[^>]*>[\s\S]*?<\/janus-viewer>/mi;
+      var titlere = /<title>([\s\S]*?)<\/title>/si;
+      var re = /<fireboxroom>[\s\S]*?<\/fireboxroom>/si;
+      var re2 = /<janus-viewer[^>]*>[\s\S]*?<\/janus-viewer>/si;
       var mtitle = data.match(titlere);
       var parsed = {
         title: 'Untitled Room',
@@ -958,8 +958,12 @@ elation.require([
         this.properties.cursor_opacity = room.cursor_opacity;
 
         let cookieStorageID = 'cookies.' + this.url;
-        if (cookieStorageID in localStorage) {
-          this.cookies = JSON.parse(localStorage['cookies.' + this.url]);
+        try {
+          if (cookieStorageID in localStorage) {
+            this.cookies = JSON.parse(localStorage['cookies.' + this.url]);
+          }
+        } catch (e) {
+          this.cookies = [];
         }
 
         if (room.onload) {
@@ -1633,7 +1637,10 @@ console.log('connect room audio to graph', this.audionodes.gain, this.audionodes
     }
     this.addCookie = function(name, value) {
       this.cookies[name] = value;
-      localStorage['cookies.' + this.url] = JSON.stringify(this.cookies);
+      try {
+        localStorage['cookies.' + this.url] = JSON.stringify(this.cookies);
+      } catch (e) {
+      }
     }
     this.doScriptOnload = function() {
       if (--this.pendingScripts <= 0) {
@@ -1972,11 +1979,17 @@ console.log('connect room audio to graph', this.audionodes.gain, this.audionodes
     this.updateFlying = function() {
       if (typeof player != 'undefined') {
         player.flying = this.flying;
-        console.log('Toggle player flying', this.flying);
+        //console.log('Toggle player flying', this.flying);
+      }
+    }
+    this.updatePlayerSpeed = function() {
+      if (typeof player != 'undefined') {
+        player.properties.movestrength = 80 * this.properties.walk_speed;
+        player.properties.runstrength = 80 * this.properties.run_speed;
       }
     }
     this.updateTeleport = function() {
-      console.log('Toggle player teleport', this.teleport);
+      //console.log('Toggle player teleport', this.teleport);
     }
     this.updateGravity = function() {
       if (this.loaded) {

package/scripts/sound.js

@@ -7,6 +7,7 @@ elation.require(['janusweb.janusbase'], function() {
       this.defineProperties({
         sound_id: { type: 'string', set: this.updateSound },
         singleshot: { type: 'boolean', default: false },
+        positional: { type: 'boolean', default: null },
         loop: { type: 'boolean', default: false },
         auto_play: { type: 'boolean', default: false },
         play_once: { type: 'boolean', default: false },
@@ -54,7 +55,7 @@ elation.require(['janusweb.janusbase'], function() {
         if (!audionodes) {
           audionodes = await this.room.getAudioNodes();
         }
-        if (!this.hasposition) {
+        if (!this.hasposition && this.positional !== true) {
           this.audio = new THREE.Audio(audionodes.listener);
         } else {
           this.audio = new THREE.PositionalAudio(audionodes.listener);
@@ -209,8 +210,11 @@ elation.require(['janusweb.janusbase'], function() {
     }
     this.updatePlaying = function(ev) {
       this.playing = (this.audio ? this.audio.isPlaying : false);
-      if (ev.type == 'ended' && this.singleshot)  {
-        this.die(); 
+      if (ev.type == 'ended') {
+        this.dispatchEvent({type: 'sound_ended'});
+        if (this.singleshot)  {
+          this.die();
+        }
       }
       return this.playing;
     }
@@ -223,6 +227,7 @@ elation.require(['janusweb.janusbase'], function() {
           playing:      [ 'property', 'playing', 'sound.isPlaying'],
           pitch:        [ 'property', 'pitch'],
           auto_play:    [ 'property', 'auto_play'],
+          positional:   [ 'property', 'positional'],
           play:         [ 'function', 'play'],
           pause:        [ 'function', 'pause'],
           stop:         [ 'function', 'stop'],

package/scripts/text.js

@@ -219,6 +219,8 @@ elation.require(['engine.things.label'], function() {
 
         this._proxyobject._proxydefs = {
           text:  [ 'property', 'text'],
+          thickness:  [ 'property', 'thickness'],
+          segments:  [ 'property', 'segments'],
           col:   [ 'property', 'color'],
           emissive:  [ 'property', 'emissive'],
           bevel:  [ 'property', 'bevel'],

package/scripts/tracking.js

@@ -9,7 +9,7 @@ elation.require([], function() {
         })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
         ga('create', elation.config.get('janusweb.tracking.clientid'), 'auto');
-        ga('set', 'page', "/");
+        ga('set', 'page', document.location.pathname || "/");
         //ga('send', 'pageview');
 
         elation.events.add(null, 'room_change', function(ev) {

package/scripts/ui/main.js

@@ -167,8 +167,12 @@ elation.require(['utils.template', 'elements.elements', 'elements.ui.all', 'elem
     create() {
       var datapath = elation.config.get('janusweb.datapath', '/media/janusweb');
       var configurl = this.config || datapath + (datapath[datapath.length - 1] != '/' ? '/' : '') + 'assets/webui/default.json';
-      this.installedapps = elation.elements.create('collection.localindexed', {index: 'name', storagekey: 'janusweb.ui.installedapps'});
-      this.installedapps.load();
+      try {
+        this.installedapps = elation.elements.create('collection.localindexed', {index: 'name', storagekey: 'janusweb.ui.installedapps'});
+        this.installedapps.load();
+      } catch (e) {
+        this.installedapps = elation.elements.create('collection.indexed', {index: 'name', storagekey: 'janusweb.ui.installedapps'});
+      }
       this.container = elation.elements.create('div', {
         append: this,
         class: 'janus-ui-container'