diff --git a/src/assets/stylesheets/profile.scss b/src/assets/stylesheets/profile.scss index 5ebac8182d8ef8d71b7430849ebb0231eea781c8..8763dce5e2a89b864c87a73110b49358342530e5 100644 --- a/src/assets/stylesheets/profile.scss +++ b/src/assets/stylesheets/profile.scss @@ -11,7 +11,7 @@ display: flex; pointer-events: auto; z-index: 2; - background-color: rgba(255, 255, 255, 0.9); + background-color: rgba(255, 255, 255, 0.95); :local(.logo) { width: 150px; diff --git a/src/hub.js b/src/hub.js index f05c4d99519c53e42095004d6ad0cae9f15ba5ca..692213b2575560e520e3a42c1974fdb9a9da6764 100644 --- a/src/hub.js +++ b/src/hub.js @@ -197,7 +197,6 @@ function mountUI(props = {}) { const disableAutoExitOnConcurrentLoad = qsTruthy("allow_multi"); const forcedVREntryType = qs.get("vr_entry_type"); const enableScreenSharing = qsTruthy("enable_screen_sharing"); - const showProfileEntry = !store.state.activity.hasChangedName; ReactDOM.render( <UIRoot @@ -209,7 +208,6 @@ function mountUI(props = {}) { forcedVREntryType, enableScreenSharing, store, - showProfileEntry, ...props }} />, @@ -260,10 +258,6 @@ async function handleHubChannelJoined(entryManager, hubChannel, data) { debug: !!isDebug }); - if (isBotMode) { - entryManager.enterSceneWhenLoaded(new MediaStream(), false); - } - while (!scene.components["networked-scene"] || !scene.components["networked-scene"].data) await nextTick(); scene.components["networked-scene"] @@ -278,6 +272,10 @@ async function handleHubChannelJoined(entryManager, hubChannel, data) { hubChannel.channel.push("naf", payload); }; + + if (isBotMode) { + entryManager.enterSceneWhenLoaded(new MediaStream(), false); + } }) .catch(connectError => { // hacky until we get return codes @@ -301,7 +299,6 @@ document.addEventListener("DOMContentLoaded", () => { window.APP.scene = scene; registerNetworkSchemas(); - mountUI({}); remountUI({ hubChannel, linkChannel, enterScene: entryManager.enterScene, exitScene: entryManager.exitScene }); pollForSupportAvailability(isSupportAvailable => remountUI({ isSupportAvailable })); diff --git a/src/react-components/ui-root.js b/src/react-components/ui-root.js index b9689dd02dd2f36640e1bc6f0990f3fd79e39c3c..faf1dcd4d12f535070059297eb86a7b599347888 100644 --- a/src/react-components/ui-root.js +++ b/src/react-components/ui-root.js @@ -76,7 +76,6 @@ class UIRoot extends Component { hubChannel: PropTypes.object, linkChannel: PropTypes.object, hubEntryCode: PropTypes.number, - showProfileEntry: PropTypes.bool, availableVREntryTypes: PropTypes.object, environmentSceneLoaded: PropTypes.bool, roomUnavailableReason: PropTypes.string, @@ -125,11 +124,6 @@ class UIRoot extends Component { showProfileEntry: false }; - constructor(props) { - super(props); - this.state.showProfileEntry = this.props.showProfileEntry; - } - componentDidMount() { this.props.concurrentLoadDetector.addEventListener("concurrentload", this.onConcurrentLoad); this.micLevelMovingAverage = MovingAverage(100); @@ -173,6 +167,12 @@ class UIRoot extends Component { }; handleStartEntry = () => { + const promptForNameAndAvatarBeforeEntry = !this.props.store.state.activity.hasChangedName; + + if (promptForNameAndAvatarBeforeEntry) { + this.setState({ showProfileEntry: true }); + } + if (!this.props.forcedVREntryType) { this.setState({ entryStep: ENTRY_STEPS.device }); } else if (this.props.forcedVREntryType.startsWith("daydream")) { diff --git a/src/scene-entry-manager.js b/src/scene-entry-manager.js index adbc63e1449a57216c556b726d31945b4283899c..f5b65c1fdb3234391cae1220c34a574293c0a742 100644 --- a/src/scene-entry-manager.js +++ b/src/scene-entry-manager.js @@ -56,11 +56,11 @@ export default class SceneEntryManager { this.playerRig.setAttribute("virtual-gamepad-controls", {}); } - this.setupPlayerRig(); - this.setupScreensharing(mediaStream); - this.setupBlocking(); - this.setupMedia(); - this.setupCamera(); + this._setupPlayerRig(); + this._setupScreensharing(mediaStream); + this._setupBlocking(); + this._setupMedia(); + this._setupCamera(); if (qsTruthy("offline")) return; @@ -68,10 +68,10 @@ export default class SceneEntryManager { NAF.connection.adapter.setLocalMediaStream(mediaStream); } - this.spawnAvatar(); + this._spawnAvatar(); if (isBotMode) { - this.runBot(mediaStream); + this._runBot(mediaStream); return; } @@ -113,9 +113,9 @@ export default class SceneEntryManager { document.body.removeEventListener("touchend", requestFullscreen); }; - setupPlayerRig = () => { - this.updatePlayerRigWithProfile(); - this.store.addEventListener("statechanged", this.updatePlayerRigWithProfile); + _setupPlayerRig = () => { + this._updatePlayerRigWithProfile(); + this.store.addEventListener("statechanged", this._updatePlayerRigWithProfile); const avatarScale = parseInt(qs.get("avatar_scale"), 10); @@ -124,7 +124,7 @@ export default class SceneEntryManager { } }; - updatePlayerRigWithProfile = () => { + _updatePlayerRigWithProfile = () => { const displayName = this.store.state.profile.displayName; this.playerRig.setAttribute("player-info", { displayName, @@ -132,10 +132,10 @@ export default class SceneEntryManager { }); const hudController = this.playerRig.querySelector("[hud-controller]"); hudController.setAttribute("hud-controller", { showTip: !this.store.state.activity.hasFoundFreeze }); - document.querySelector("a-scene").emit("username-changed", { username: displayName }); + this.scene.emit("username-changed", { username: displayName }); }; - setupScreensharing = mediaStream => { + _setupScreensharing = mediaStream => { const videoTracks = mediaStream ? mediaStream.getVideoTracks() : []; let sharingScreen = videoTracks.length > 0; @@ -145,7 +145,6 @@ export default class SceneEntryManager { if (screenEntity) { screenEntity.setAttribute("visible", sharingScreen); } else if (sharingScreen) { - const sceneEl = document.querySelector("a-scene"); screenEntity = document.createElement("a-entity"); screenEntity.id = screenEntityId; screenEntity.setAttribute("offset-relative-to", { @@ -154,7 +153,7 @@ export default class SceneEntryManager { on: "action_share_screen" }); screenEntity.setAttribute("networked", { template: "#video-template" }); - sceneEl.appendChild(screenEntity); + this.scene.appendChild(screenEntity); } this.scene.addEventListener("action_share_screen", () => { @@ -173,7 +172,7 @@ export default class SceneEntryManager { }); }; - setupBlocking = () => { + _setupBlocking = () => { document.body.addEventListener("blocked", ev => { NAF.connection.entities.removeEntitiesOfClient(ev.detail.clientId); }); @@ -183,7 +182,7 @@ export default class SceneEntryManager { }); }; - setupMedia = () => { + _setupMedia = () => { const offset = { x: 0, y: 0, z: -1.5 }; const spawnMediaInfrontOfPlayer = (src, contentOrigin) => { const { entity, orientation } = addMedia(src, "#interactable-media", contentOrigin, true); @@ -237,7 +236,7 @@ export default class SceneEntryManager { }); }; - setupCamera = () => { + _setupCamera = () => { this.scene.addEventListener("action_spawn_camera", () => { const entity = document.createElement("a-entity"); entity.setAttribute("networked", { template: "#interactable-camera" }); @@ -249,13 +248,13 @@ export default class SceneEntryManager { }); }; - spawnAvatar = () => { + _spawnAvatar = () => { this.playerRig.setAttribute("networked", "template: #remote-avatar-template; attachTemplateToLocal: false;"); this.playerRig.setAttribute("networked-avatar", ""); this.playerRig.emit("entered"); }; - runBot = async mediaStream => { + _runBot = async mediaStream => { this.playerRig.setAttribute("avatar-replay", { camera: "#player-camera", leftController: "#player-left-controller",