diff --git a/.eslintrc.js b/.eslintrc.js index 1cadfd103fd1910f79fb0e7928b0663b9e6a248a..fcd01630f75612e9262f216b79101005e14e7d5d 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -14,6 +14,7 @@ module.exports = { rules: { "prettier/prettier": "error", "prefer-const": "error", + "no-use-before-define": "error", "no-var": "error", "no-throw-literal": "error", // Light console usage is useful but remove debug logs before merging to master. diff --git a/src/components/super-cursor.js b/src/components/super-cursor.js index 28589171658f9d06ed57b4e604d91a73032ea583..b8daee493abcbfb543db553538c5b968748da381 100644 --- a/src/components/super-cursor.js +++ b/src/components/super-cursor.js @@ -106,7 +106,7 @@ AFRAME.registerComponent("super-cursor", { _handleMouseDown: function() { if (this.isInteractable) { const lookControls = this.data.camera.components["look-controls"]; - lookControls.pause(); + if (lookControls) lookControls.pause(); } this.data.cursor.emit("action_grab", {}); }, @@ -117,7 +117,7 @@ AFRAME.registerComponent("super-cursor", { _handleMouseUp: function() { const lookControls = this.data.camera.components["look-controls"]; - lookControls.play(); + if (lookControls) lookControls.play(); this.data.cursor.emit("action_release", {}); }, diff --git a/src/hub.html b/src/hub.html index 6f083ae829217e1f4d9ff12960dbe59bf2b38687..e9e21da290e89e942cf19f5758ec2e4561ac1bf0 100644 --- a/src/hub.html +++ b/src/hub.html @@ -15,6 +15,7 @@ </head> <body data-html-prefix="<%= HTML_PREFIX %>"> + <script>(function(){var script=document.createElement('script');script.onload=function(){var stats=new Stats();document.body.appendChild(stats.dom);requestAnimationFrame(function loop(){stats.update();requestAnimationFrame(loop)});};script.src='//rawgit.com/mrdoob/stats.js/master/build/stats.min.js';document.head.appendChild(script);})()</script> <audio id="test-tone" src="./assets/sfx/tone.ogg"></audio> <a-scene @@ -187,7 +188,6 @@ camera position="0 1.6 0" personal-space-bubble="radius: 0.4" - look-controls ></a-entity> <a-entity diff --git a/src/hub.js b/src/hub.js index 9df7c45a4476b0f69f51264864415308f076c8ad..ac746fd9f9ff70d59ffec8517a25b7f46bdba359 100644 --- a/src/hub.js +++ b/src/hub.js @@ -1,5 +1,6 @@ import "./assets/stylesheets/hub.scss"; import queryString from "query-string"; +import { debounce } from "lodash"; import { patchWebGLRenderingContext } from "./utils/webgl"; patchWebGLRenderingContext(); @@ -126,6 +127,7 @@ async function enterScene(mediaStream, enterInVR, janusRoomId) { const scene = document.querySelector("a-scene"); const playerRig = document.querySelector("#player-rig"); document.querySelector("a-scene canvas").classList.remove("blurred"); + scene.render(); if (enterInVR) { scene.enterVR(); @@ -179,11 +181,7 @@ async function enterScene(mediaStream, enterInVR, janusRoomId) { screenEntity.setAttribute("visible", sharingScreen); }); - if (qsTruthy("offline")) { - onConnect(); - } else { - document.body.addEventListener("connected", onConnect); - + if (!qsTruthy("offline")) { scene.components["networked-scene"].connect(); if (mediaStream) { @@ -207,8 +205,6 @@ async function enterScene(mediaStream, enterInVR, janusRoomId) { } } -function onConnect() {} - function mountUI(scene) { const disableAutoExitOnConcurrentLoad = qsTruthy("allow_multi"); const forcedVREntryType = qs.vr_entry_type || null; @@ -255,7 +251,10 @@ const onReady = async () => { const environmentRoot = document.querySelector("#environment-root"); const initialEnvironmentEl = document.createElement("a-entity"); - initialEnvironmentEl.addEventListener("bundleloaded", () => uiRoot.setState({ initialEnvironmentLoaded: true })); + initialEnvironmentEl.addEventListener("bundleloaded", () => { + uiRoot.setState({ initialEnvironmentLoaded: true }); + setTimeout(() => scene.renderer.animate(null), 100); + }); environmentRoot.appendChild(initialEnvironmentEl); if (qs.room) { diff --git a/src/react-components/ui-root.js b/src/react-components/ui-root.js index 946784e9e1f6e18aa6a412a86d350f39a1772a24..3970a2305c4439900b4936f8e465d2d0039a8de0 100644 --- a/src/react-components/ui-root.js +++ b/src/react-components/ui-root.js @@ -60,7 +60,7 @@ class UIRoot extends Component { enableScreenSharing: PropTypes.bool, store: PropTypes.object, scene: PropTypes.object, - htmlPrefix: PropTypes.object + htmlPrefix: PropTypes.string }; state = { diff --git a/src/vendor/GLTFLoader.js b/src/vendor/GLTFLoader.js index 25e397ce98c7ebc2be929195c6863338154c01bc..f6a4a9595eb220648d2c2b317f816f3d81fe5dd1 100644 --- a/src/vendor/GLTFLoader.js +++ b/src/vendor/GLTFLoader.js @@ -39,7 +39,7 @@ THREE.GLTFLoader = ( function () { try { - scope.parse( data, path, onLoad, onError ); + scope.parse( url, data, path, onLoad, onError ); } catch ( e ) { @@ -80,7 +80,7 @@ THREE.GLTFLoader = ( function () { }, - parse: function ( data, path, onLoad, onError ) { + parse: function ( url, data, path, onLoad, onError ) { var content; var extensions = {}; @@ -159,7 +159,7 @@ THREE.GLTFLoader = ( function () { } - console.time( 'GLTFLoader' ); + console.time( `GLTFLoader - ${url}` ); var parser = new GLTFParser( json, extensions, { @@ -171,7 +171,7 @@ THREE.GLTFLoader = ( function () { parser.parse( function ( scene, scenes, cameras, animations, asset ) { - console.timeEnd( 'GLTFLoader' ); + console.timeEnd( `GLTFLoader - ${url}` ); var glTF = { scene: scene,