Onload callbacks for Entity and backgroundImage

[kNewbown]

Description

Feature requests I am trying to implement loading screens for a smoother experience, especially when loading large Entity files, but can’t find a way to determine when the elements have loaded and rendered. At the moment I have VrButtons that appear before both the entity and the background image appear, and they look out of place until then.

Rendering Entity:

import * as React from 'react'
import { View } from 'react-360'
import Entity from 'Entity'
render() {
   return (
      <View>
         <Entity
            source={{gltf2: this.props.model}}
         />
      </View>
   )
}

Rendering background image (in a component outside of client.js):

import React from 'react'
import { Environment } from 'react-360'
render() {
   Environment.setBackgroundImage(background)
   return (
      //
   )
}

[IMFIL]

Any news regarding this request ?

[kNewbown]

Nope :(

To get around it for now I've just stuck in some dodgy message posts. Then my react 360 component listens for those messages. It is definitely not ideal and not maintainable, but just a temp thing.

ie.

In _nodemodules/react-360-web/js/Loaders/WavefrontOBJ/OBJGroup.js - Line 104

addMaterial(name: string, lib: string) {
    ...

    // ADDED: Post message on load to inform loading spinner
    window.postMessage({loaded: "object"},'*')

}

In _nodemodules/react-360-web/js/Compositor/Environment/Environment.js - Line 121

_updateTexture(data: TextureMetadata) {
    ...

    // ADDED: Post message on load to inform loading spinner
    window.postMessage({loaded: "background"},'*')

    this._panoMaterial.needsUpdate = true;
}