janusweb 1.5.56 → 1.7.1

package/scripts/janusparagraph.js

@@ -1,9 +1,43 @@
-elation.require(['janusweb.janusbase'], function() {
+/*
+ * <paragraph> text-to-texture translator. The builtin XMLtranslator allows:
+ *
+ *  1. inline html             : <paragraph><![CDATA[ <b>hello world</b> ]]></paragraph>
+ *  2. inline html (partial)   : <paragraph selector="span"><![CDATA[ <b>hello <span>world</span></b> ]]></paragraph>
+ *  3. external url            : <paragraph url="https://janusxr.org"/>
+ *  4. external url (partials) : <paragraph url="https://janusxr.org" selector=".infoText"/>
+ *  5. janusroom container html: <paragraph selector=".someclass"/>
+ *  6. janusroom container xml : <paragraph selector="tag subtag title"/>
+ *  7. RSS                     : <paragraph url="https://my.org/foo.rss" selector="item description"/>
+ *  8. XML                     : <paragraph url="https://my.org/bar.xml" selector="title"/>
+ *  9. any data- or selector-format via 'paragraph_translator' event
+ *
+ *  EXAMPLE TRANSLATOR:
+ *
+ *     room.addEventListener("paragraph_translator", function(e){
+ *       const {translator,paragraph} = e.detail
+ *       // now you can override the default translator
+ *       translator.fetch     = async (url) => this.text = "a response"    // my custom fetch function
+ *       translator.translate = async (   ) => ["<h1>head</h1>",this.text] // my x2html translator
+ *     }
+ *
+ *  NOTES:
+ *  1. By default, selectors are done via `document.querySelectorAll`
+ *  2. in case of multiple results:
+ *    2.1 clicking the paragraph with cycle through them
+ *    2.2 setting cycle="3000" allows for (2sec per item) slideshows
+ *    2.3 setting `rooms.objects.myparagraph.index++` cycles to next item
+ *  3. width/height-attributes offers finer control of texture size
+ *  4. ttl-attributes allows finer control of webrequest-cache (default 2 mins)
+ *  5. setting `rooms.object.myparagraph.selector = "#section2"' allows for statemanagement
+ *  6. separation of `this.text` (for JML) and `this.html` (for texture) is necessary (to not break JML/glb exports)
+ */
+
+elation.require(['janusweb.janusbase','janusweb.translators.paragraph.html-xml-rss'], function() {
   elation.component.add('engine.things.janusparagraph', function() {
     this.postinit = function() {
       elation.engine.things.janusparagraph.extendclass.postinit.call(this);
       this.defineProperties({
-        text: {type: 'string', default: '', set: this.updateTexture},
+        text: {type: 'string', default: '', set: this.textToHTML },
         font_size: {type: 'integer', default: 16, set: this.updateTexture},
         text_col: {type: 'color', default: 0x000000, set: this.updateTexture},
         back_col: {type: 'color', default: 0xffffff, set: this.updateTexture},
@@ -11,14 +45,40 @@ elation.require(['janusweb.janusbase'], function() {
         cull_face: { type: 'string', default: 'back', set: this.updateMaterial },
         css: {type: 'string', set: this.updateTexture },
         depth_write: { type: 'boolean', default: true },
+        transparent: {type: 'boolean', set: this.updateTexture },
         depth_test: { type: 'boolean', default: true },
         collision_id: { type: 'string', default: 'cube' },
         collision_scale: { type: 'vector3', default: V(.5, .5, .02) },
         shadow: { type: 'boolean', default: true, set: this.updateMaterial },
         shadow_receive: { type: 'boolean', default: true, set: this.updateMaterial, comment: 'Receive shadows from self and other objects' },
         shadow_cast: { type: 'boolean', default: true, set: this.updateMaterial, comment: 'Cast shadows onto self and other objects' },
+        url: { type: 'string', default: '', set: this.fetchSource },
+        selector: { type: 'string', default: '', set: this.fetchSource },
+        index: { type: 'integer', default: 0, set: this.updateHTML },
+        cycle: {type: 'integer', default: 0, set: this.updateHTML },
+        width: { type: 'integer', default: 1024 },  
+        height: { type: 'integer', default: 1024 }, 
+        ttl: { type: 'integer', default: 120000, comment: 'expire texture/html after ms (default:2 mins)' }, 
       });
     }
+
+    this.paragraphs = [] // for cycle / partial purposes
+
+    this.textToHTML = function(){
+      // IMPORTANT: skip infinite loop  
+      if( this.html == this.text ) return 
+      if( this.text ){
+        if( this.html ){ // reset stuff 
+          this.url   = this.selector = '' 
+          this.cycle = this.indexes = 0;
+        }
+        this.fetchSource() // expect 'selector' not being set here 
+      }else{
+        this.html = ''
+        this.updateTexture()
+      } 
+    }
+
     this.createObject3D = function() {
       var material = this.createMaterial();
       var geo = new THREE.PlaneGeometry(2,2);
@@ -26,6 +86,14 @@ elation.require(['janusweb.janusbase'], function() {
       var mesh = new THREE.Mesh(geo, material);
       mesh.castShadow = this.shadow && this.shadow_cast;
       mesh.receiveShadow = this.shadow && this.shadow_receive;
+     
+      elation.events.add(this, 'click', () => {
+        if( this.indexes ){
+          this.index++
+          this.cycle = 0 // disable
+        }
+      })
+
       return mesh;
     }
     this.createForces = function() {
@@ -36,9 +104,9 @@ elation.require(['janusweb.janusbase'], function() {
     this.createMaterial = function() {
       var texture = this.createTexture();
       var sidemap = {
-        'back': THREE.FrontSide,
+        'back':  THREE.FrontSide,
         'front': THREE.BackSide,
-        'none': THREE.DoubleSide
+        'none':  THREE.DoubleSide
       };
       var matargs = {
         color: 0xffffff,
@@ -57,26 +125,28 @@ elation.require(['janusweb.janusbase'], function() {
     }
     this.createTexture = function() {
       this.canvas = document.createElement('canvas');
-      this.canvas.width = 1024;
-      this.canvas.height = 1024;
+      this.canvas.width = this.width;
+      this.canvas.height = this.height;
       this.texture = new THREE.Texture(this.canvas);
       this.texture.encoding = THREE.sRGBEncoding;
-      this.updateTexture();
+      if( this.text ) this.updateTexture();
       return this.texture;
     }
     this.updateTexture = function() {
       if (!this.canvas || !this.texture) return;
       var ctx = this.canvas.getContext('2d'),
           texture = this.texture;
-      this.canvas.width = 1024;
-      this.canvas.height = 1024;
+      this.canvas.width = this.width;
+      this.canvas.height = this.height;
+
       var text_col = '#' + this.text_col.getHexString(),
           back_col = 'rgba(' + (this.back_col.r * 255) + ', ' + (this.back_col.g * 255) + ', ' + (this.back_col.b * 255) + ', ' + this.back_alpha + ')';
       var basestyle = 'font-family: sans-serif;' +
                       'font-size: ' + this.font_size + 'px;' +
+                      'box-sizing: border-box;'  +
                       'color: ' + text_col + ';' +
-                      'background: ' + back_col + ';' +
-                      'max-width: 1014px;' +
+                      'background: ' + (this.transparent ? 'transparent' : back_col) + ';' +
+                      `max-width: ${this.width}px;` +
                       'padding: 5px;';
 
       // We need to sanitize our HTML in case someone provides us with malformed markup.
@@ -85,12 +155,25 @@ elation.require(['janusweb.janusbase'], function() {
       // styled divs instead.
 
       var sanitarydiv = document.createElement('div');
-      sanitarydiv.innerHTML = this.text;
+      sanitarydiv.innerHTML = this.html;
       var content = sanitarydiv.innerHTML.replace(/<br\s*\/?>/g, '<div class="br"></div>');
       content = content.replace(/<hr\s*\/?>/g, '<div class="hr"></div>');
       content = content.replace(/<img(.*?)>/g, "<img$1 />");
 
       var styletag = '<style>.paragraphcontainer { ' + basestyle + '} .br { height: 1em; } .hr { margin: .5em 0; border: 1px inset #ccc; height: 0px; }';
+      styletag    += 'a { color:unset; text-decoration: none; }' // dont confuse users with nonclickable links
+
+
+
+      // hybrid 2D/3D styling: apply styles from container HTML if any
+      styletag += [ ...(new DOMParser)
+                       .parseFromString(room.fullsource,"text/html")
+                       .querySelectorAll("style[type=\"text/css\"]") 
+                  ]
+                  .map( (el) => el.innerText )
+                  .join("\n")
+
+
       if (this.css) {
         styletag += this.css;
       }
@@ -146,9 +229,109 @@ elation.require(['janusweb.janusbase'], function() {
           shadow: [ 'property', 'shadow' ],
           shadow_receive: [ 'property', 'shadow_receive' ],
           shadow_cast: [ 'property', 'shadow_cast' ],
+          url: [ 'property', 'url' ],
+          selector: [ 'property', 'selector' ],
+          index: ['property','index'],
+          cycle: ['property','cycle'],
+          width: ['property','width'],
+          height: ['property','height'],
+          ttl: ['property','ttl'],
         };
       }
       return this._proxyobject;
     }
+
+    this.toInlineHTML = async function(){
+      try{
+        // find all img tags and capture src attributes
+        const imgRegex = /<img[^>]*src=["'](?!data:)([^"']+)["']/gi;
+        const matches = [];
+        let match;
+        while ((match = imgRegex.exec(this.html)) !== null) { // Collect all src values
+          matches.push(match[1]);
+        }
+        // fill array with base64 image-strings
+        const dataURLs = await Promise.all( matches.map(src => this.toDataURL(src)) );
+        // Replace each src in the html with the corresponding data URL
+        let updatedHtml = this.html;
+        matches.forEach((src, i) => {
+          updatedHtml = updatedHtml.replace( `src="${src}"`, `src="${dataURLs[i]}"`)
+        });
+        this.html = updatedHtml
+      }catch(e){ console.error(e) } // continue when inlining failed
+    };
+
+    this.toDataURL = async function(url){
+      const fullUrl  = this.room.getFullRoomURL(url)
+      const finalUrl = this.room.isLocal( fullUrl) ? url : `${elation.engine.assets.corsproxy||''}${url}`
+      return await this.useCache(url, async () => 
+        await fetch(finalUrl)
+        .then(response => response.blob())
+        .then(blob => new Promise((resolve, reject) => {
+          const reader = new FileReader()
+          reader.onloadend = () => resolve(reader.result)
+          reader.onerror = reject
+          reader.readAsDataURL(blob)
+        }))
+      )
+    }
+
+    this.fetchSource = async function(){
+      if( this.url && this.fetchSource.last == this.url ) return // avoid fake updates
+      this.fetchSource.last = this.url || this.fetchSource.last
+
+      let translator = {  // fallback translator for non-url content
+        translate: async ()    => [this.html],
+        fetch:     async (uri) => {
+          if( String(this.text).match(/^data:text/) ){  // support text data-uri's
+            return await window.fetch(this.text).then( (r) => r.text() )
+          }
+          return this.text || room.fullsource
+        }
+      }
+      // allow (via event) other scripts to select different translator based on url 
+      room.dispatchEvent({type:'paragraph_translator', detail:{ paragraph:this, translator }})
+      this.html = await translator.fetch.call(this, this.url || ' ')
+      await this.toInlineHTML()
+      this.paragraphs  = await translator.translate.apply(this)
+      await this.updateHTML()
+    }
+
+    this.useCache = async function(url, myFetch) {
+      const cache = elation.janusweb.urlcache = elation.janusweb.urlcache || {}
+      if (cache[url]) return cache[url];
+      const data = cache[url] = await myFetch();
+      setTimeout(() => delete cache[url], this.ttl); // default 2 mins TTL cleanup
+      return data;
+    },
+
+    this.autoRotateIndex = function(){
+      if( this.paragraphs.length > 1 ){
+        if( this.cycle == 0 ){
+          clearInterval(this.intervalId )
+          this.intervalId = false
+        }
+        if( !this.intervalId && this.cycle ){
+          this.intervalId = setInterval( () => {
+            this.index = (this.index+1) % this.indexes 
+            this.html = this.paragraphs[ this.index ]
+          }, this.cycle )
+        }
+      }
+    }
+
+    this.updateHTML = async function(html){
+      // skip uninited url content
+      if( !this.html && this.url ) return 
+      if( this.html ){ 
+        this.indexes     = this.paragraphs.length > 1 ? this.paragraphs.length : 1
+        this.html        = this.paragraphs[ this.index % this.indexes ]
+        if( !this.html || this.htmlLast == this.html ) return // skip fake updates
+        this.htmlLast = this.html
+        this.autoRotateIndex()
+        this.updateTexture()
+      }
+    }
+
   }, elation.engine.things.janusbase);
 });

package/scripts/janusplayer.js

@@ -56,7 +56,7 @@ elation.require(['engine.things.player', 'janusweb.external.JanusVOIP', 'ui.butt
       elation.events.add(this.engine.client.view.container, 'touchcancel', elation.bind(this, this.handleTouchEnd));
 
       this.controlstate2 = this.engine.systems.controls.addContext('janusplayer', {
-        'toggle_view': ['keyboard_nomod_v,keyboard_shift_v', elation.bind(this, this.toggleCamera)],
+        'toggle_view': ['keyboard_nomod_v,keyboard_shift_v', ev => { if (ev.value == 1) this.toggleCamera() }],
         'zoom_out': ['mouse_wheel_down', ev => this.zoomView(-1, ev)],
         'zoom_in': ['mouse_wheel_up', ev => this.zoomView(1, ev)],
         //'browse_back': ['gamepad_any_button_4', elation.bind(this, this.browseBack)],
@@ -945,9 +945,9 @@ document.body.dispatchEvent(click);
 */
           this.pickable = false;
           this.setCollider('capsule', {
-            radius: this.collision_radius,
-            length: 1,
-            offset: V(0, this.collision_radius, 0)
+            radius: this.fatness,
+            length: this.height - (this.fatness * 2),
+            offset: V(0, this.fatness, 0)
           });
         } else {
           this.removeCollider();
@@ -1230,8 +1230,11 @@ document.body.dispatchEvent(click);
       this.defaultanimation = 'portal';
       setTimeout(() => this.defaultanimation = 'idle', 3000);
     }
-    this.toggleCamera = function(ev) {
-      if (ev.value == 1) {
+    this.toggleCamera = function(arg) {
+      if (typeof arg == 'string') {
+        this.setCameraView(arg);
+      } else if (!arg || arg.value) {
+        // Legacy handling - if arg is a control input event, check to make sure this is a button press, not a release
         if (this.cameraview == 'firstperson') {
           this.setCameraView('thirdperson');
         } else {

package/scripts/room.js

@@ -3,19 +3,25 @@ elation.require([
      'engine.things.generic', 'engine.things.label', 'engine.things.skybox',
     'janusweb.object', 'janusweb.portal', 'janusweb.image', 'janusweb.video', 'janusweb.text', 'janusweb.janusparagraph',
     'janusweb.sound', 'janusweb.januslight', 'janusweb.janusparticle', 'janusweb.janusghost',
-    'janusweb.translators.bookmarks', 'janusweb.translators.reddit', 'janusweb.translators.error', 'janusweb.translators.blank', 'janusweb.translators.default', 'janusweb.translators.dat', 'janusweb.translators.janusvfs'
+    'janusweb.translators.bookmarks', 'janusweb.translators.reddit', 'janusweb.translators.error', 'janusweb.translators.blank', 'janusweb.translators.default', 'janusweb.translators.dat', 'janusweb.translators.janusvfs', 'janusweb.translators.xrfragments', 'janusweb.translators.peertube'
   ], function() {
   let roomTranslators = false;
-  function initRoomTranslators() {
-    roomTranslators = {
+  function initRoomTranslators(room) {
+
+    room.translators = roomTranslators = {
+
+
+      '^peertube$': elation.janusweb.translators.peertube({janus: janus}),
+
       '^janus-vfs:': elation.janusweb.translators.janusvfs({janus: janus}),
       '^about:blank$': elation.janusweb.translators.blank({janus: janus}),
       '^bookmarks$': elation.janusweb.translators.bookmarks({janus: janus}),
       '^dat:': elation.janusweb.translators.dat({janus: janus}),
       '^https?:\/\/(www\.)?reddit.com': elation.janusweb.translators.reddit({janus: janus}),
       '^error$': elation.janusweb.translators.error({janus: janus}),
-      '^default$': elation.janusweb.translators.default({janus: janus})
-    };
+      '.*\.(gltf|glb|dae)$': elation.janusweb.translators.xrfragments({janus: janus}),
+      '^default$': elation.janusweb.translators.default({janus: janus}),
+    }
   }
   elation.component.add('engine.things.janusroom', function() {
     this.postinit = function() {
@@ -100,7 +106,7 @@ elation.require([
       });
 
       if (!roomTranslators) {
-        initRoomTranslators();
+        initRoomTranslators(this);
       }
 
       this.spawnpoint = new THREE.Object3D();
@@ -246,7 +252,8 @@ elation.require([
         orientation = spawnpoint.orientation;
       }
       var player = this.engine.client.player;
-      if (player.parent !== this) {
+      if( pos.equals(player.position) ) return // ignore 
+      if (player.parent.id !== this.id) {
         // Reparent player to the room if necessary
         this.appendChild(player.getProxyObject());
       }
@@ -297,15 +304,25 @@ elation.require([
               spawnpoint.orientation.multiply(node.orientation);
             }
             spawnpoint.orientation.multiply(new THREE.Quaternion().setFromEuler(new THREE.Euler(0, Math.PI, 0))); // Flip 180 degrees from portal orientation
-            break;
+            return spawnpoint;
           }
         }
-      } else if (this.urlhash) {
-        let obj = this.getObjectById(this.urlhash);
-        if (obj) {
-          obj.localToWorld(spawnpoint.position.set(0,0,0));
-          spawnpoint.orientation.setFromRotationMatrix(obj.objects['3d'].matrixWorld.lookAt(spawnpoint.position, obj.localToWorld(V(0,0,-1)), obj.localToWorld(V(0,1,0).sub(spawnpoint.position))));
-        }
+      }
+      if (this.urlhash) {
+        // XR Fragments deeplink spec (Level1: URL) https://xrfragment.org/#teleport%20camera
+        // backwards-compat: pos-names are deprecated
+        let obj
+        new URLSearchParams( this.urlhash.replace(/pos=/,'') ).forEach( (v,name) => {
+          let obj = this.getObjectById(name) || this.getObjectByDeepName(name)
+          if (obj) {
+            obj.localToWorld(spawnpoint.position.set(0,0,0));
+            if( obj.type == 'PerspectiveCamera' ){
+              spawnpoint.position.y -= 1.6 // https://xrfragment.org/#teleport%20camera%20spawnpoint
+            }
+            spawnpoint.orientation.setFromRotationMatrix(obj.objects['3d'].matrixWorld.lookAt(spawnpoint.position, obj.localToWorld(V(0,0,-1)), obj.localToWorld(V(0,1,0).sub(spawnpoint.position))));
+          }
+        })
+        if( obj ) elation.events.fire({element: this, type: 'href', data: {href,opts}});
       }
       return spawnpoint;
     }
@@ -559,23 +576,28 @@ elation.require([
       this.debugwindow.show();
       this.debugwindow.center();
     }
-    this.load = function(url, baseurloverride) {
-      if (!url) {
-        url = this.properties.url;
-      } else {
-        this.properties.url = url;
-      }
-      var baseurl = baseurloverride;
+
+    this.getBaseUrl = function(url, baseurloverride){
+      let baseurl = baseurloverride;
       if (!baseurl) {
-        if (url && !this.baseurl) {
+        if (url && url.match("://") && !this.baseurl) {
           baseurl = url.split('/');
           if (baseurl.length > 3) baseurl.pop();
           baseurl = baseurl.join('/') + '/';
-          this.baseurl = baseurl;
         }
+        return baseurl || document.location.origin + document.location.pathname;
       } else {
-        this.baseurl = baseurl;
+        return baseurl;
       }
+    }
+
+    this.load = function(url, baseurloverride) {
+      if (!url) {
+        url = this.properties.url;
+      } else {
+        this.properties.url = url;
+      }
+      this.baseurl = this.getBaseUrl(url,baseurloverride)
 
       this.jsobjects = {};
       this.cookies = {};
@@ -586,14 +608,7 @@ elation.require([
       this.setTitle('loading...');
 
       var proxyurl = this.corsproxy || '';
-
-      var fullurl = url;
-      if (fullurl[0] == '/' && fullurl[1] != '/') fullurl = this.baseurl + fullurl;
-      if (!fullurl.match(/^https?:/) && !fullurl.match(/^\/\//)) {
-        fullurl = self.location.origin + fullurl;
-      } else if (!fullurl.match(/^https?:\/\/(localhost|127\.0\.0\.1)/) && fullurl.indexOf(document.location.origin) != 0) {
-        fullurl = proxyurl + fullurl;
-      }
+      var fullurl = this.getFullRoomURL(url, proxyurl )
 
       elation.events.fire({element: this, type: 'room_load_queued'});
 
@@ -706,11 +721,22 @@ elation.require([
         }
       }));
     }
-    this.loadFromSource = function(sourcecode, baseurl) {
+    this.loadFromSource = async function(sourcecode, baseurl) {
       if (baseurl) {
         this.baseurl = baseurl;
       }
-      var source = this.parseSource(sourcecode);
+
+      var source
+      // scan sourcecode for non-JML microformats within translators 
+      for( m in roomTranslators ){
+        let rt = roomTranslators[m] 
+        if( rt.parseSource && rt.parseSource.regex ){
+          source = await rt.parseSource(sourcecode,this)
+          if( source ) break;
+        }
+      }
+      if( !source ) source = this.parseSource(sourcecode)
+
       if (source && source.source) {
         this.roomsrc = source.source;
         var datapath = elation.config.get('janusweb.datapath', '/media/janusweb');
@@ -1642,6 +1668,8 @@ elation.require([
         assetlist.push({
           assettype: 'shader',
           name: args.id,
+          shadertype: args.shadertype || 'default',
+          hasalpha: args.hasalpha,
           fragment_src: args.src,
           vertex_src: args.vertex_src,
           uniforms: args.uniforms,
@@ -1955,8 +1983,19 @@ elation.require([
 */
 
     }
-    this.getObjectById = function(js_id) {
-      return this.jsobjects[js_id];
+    this.getObjectByDeepName = function(name) {
+      if( !this.janus.currentroom ) return
+      let obj = this.janus.currentroom.objects['3d'].getObjectByName(name)
+      if( obj ){ // return polyglot THREE/janusweb object for convenience
+        return new Proxy(obj,{
+          set(me,k,v){ obj[k] = v; return true;    },
+          get(me,k){ 
+            if( k == 'objects' ) return { '3d': me }
+            return obj[k]; 
+          }
+        })
+      }
+      return obj
     }
     this.getObjectsByClassName = function(classname) {
       var objects = [];
@@ -2079,7 +2118,7 @@ elation.require([
       }
       var urls = [this.url];
       for (var i = 0; i < assets.length; i++) {
-        var url = assets[i].getFullURL();
+        var url = assets[i].getFullRoomURL();
         urls.push(url);
       }
       return urls;
@@ -2804,14 +2843,22 @@ console.log('dispatch to parent', event, this, event.target);
     this.handleDelayedSound = function(ev) {
       // TODO - implement some visual indicator that this room is trying to play sound but was temporarily blocked
     }
-    this.getFullRoomURL = function(url) {
-      if (!url) url = this.url;
-      if (url[0] == '/') {
-        url = this.baseurl.replace(/^(https?:\/\/[^\/]+)\/.*$/, '$1') + url;
-      } else if (!url.match(/:\/\//i)) {
-        url = this.baseurl + url;
+    this.getFullRoomURL = function(url, proxyurl) {
+      let fullurl = url;
+      if (fullurl[0] == '/' && fullurl[1] != '/'){ 
+        fullurl = this.baseurl.replace(/^(https?:\/\/[^\/]+)\/.*$/, '$1') + fullurl;
+      }else if (!fullurl.match(/^https?:/) && !fullurl.match(/^\/\//)) {
+        fullurl = this.baseurl + (
+                    fullurl.match(/^\.\//) ? fullurl.replace(/^\.\//,'')  // './index.html' e.g.
+                                           : fullurl 
+                  )
+      } else if (proxyurl && !this.isLocal(fullurl) ){
+        fullurl = proxyurl + fullurl;
       }
-      return url;
+      return fullurl
+    }
+    this.isLocal = function(url){
+      return url.match(/^https?:\/\/(localhost|127\.0\.0\.1)/) || url.indexOf(document.location.origin) == 0
     }
     this.dispose = function() {
       if (this.assetpack) {

package/scripts/sound.js

@@ -65,7 +65,7 @@ elation.require(['janusweb.janusbase'], function() {
           }
           //this.audio.panner.maxDistance = this.properties.distance;
           if (this.dist) {
-            this.audio.setRefDistance(this.dist);
+            this.audio.setRefDistance(Math.max(0, this.dist));
           } else {
             //this.audio.panner.distanceModel = 'linear';
           }

package/scripts/text.js

@@ -11,7 +11,7 @@ elation.require(['engine.things.label'], function() {
         'align':           { type: 'string', default: 'center', refreshGeometry: true },
         'verticalalign':   { type: 'string', default: 'bottom', refreshGeometry: true },
         'zalign':          { type: 'string', default: 'back', refreshGeometry: true },
-        'emissive':        { type: 'color', default: 0x000000 },
+        'emissive':        { type: 'color', default: 0x000000, set: this.updateMaterial },
         'opacity':         { type: 'float', default: 1.0 },
         'depth_write':     { type: 'bool', default: true },
         'depth_test':      { type: 'bool', default: true },
@@ -120,6 +120,7 @@ elation.require(['engine.things.label'], function() {
           this.material.metalness = this.metalness;
           this.material.envMap = this.getEnvmap();
         }
+        this.material.emissive = this.emissive;
         this.material.needsUpdate = true;
       }
     }

package/scripts/translators/paragraph/html-xml-rss.js

@@ -0,0 +1,47 @@
+// this translator converts the following url-output to HTML:
+// * HTML
+// * XML
+// * RSS
+//
+// NOTE1: to not bloat the core-codebase please define custom translators 
+//       in assetscripts or webui apps. Thank you.
+//
+// NOTE2: 'this' is basically a paragraph janus object 
+
+(function(){
+
+  let XMLTranslator = {
+    fetch: async function(uri){
+      const uriExFragment = String(uri).replace(/#.*/,'')
+      const finalUrl = `${elation.engine.assets.corsproxy||''}${uriExFragment||''}`
+      return await this.useCache( finalUrl, async () => 
+        await fetch( finalUrl )
+        .then( (res) => res.text() )
+      )
+    },
+    translate: async function(){   // generic XML/RSS/HTML preprocessor [this.text to this.html]
+      if( !this.html ) return [""]
+      if( this.selector && typeof this.index != 'undefined' ){
+        const type      = this.html.match(/<(rss|feed)/) ? "text/xml" : "text/html"
+        const parser    = new DOMParser()
+        const xmlDoc    = parser.parseFromString( this.html, type)
+        let paragraphs  = [ ...xmlDoc.querySelectorAll(this.selector) ] // KiSS JML: CSS selectors level 1
+        if( !paragraphs.length ){
+          console.error(`paragraph: level1 css selector '${this.selector}' not matching anything`)
+        }
+        return paragraphs.map( (p) => type == 'text/xml' ? p.textContent : p.outerHTML )
+      }
+      return [this.html]
+    }
+  }
+
+  elation.events.add(null, 'paragraph_translator', function(e){
+    const {translator,paragraph} = e.detail
+    // now you can override the default translator
+    if( String(paragraph.url).match(/^http/) ){
+      translator.fetch     = XMLTranslator.fetch 
+    }
+    translator.translate = XMLTranslator.translate // boldly always set ourselfs as default
+  })
+
+})();