olsibob

Members
  • Content Count

    35
  • Joined

  • Last visited

Everything posted by olsibob

  1. Oh wow, moving to TS 3 and BabylonJS 3.3.0 made it work! I had been on TS 2.9.2 before.
  2. I don't have a GearVR to hand, so I don't have a sense of how similar they are (GearVR is described as "powered by Oculus" and it's also 3DoF). I'm very happy so far with how the Oculus Go controller works in babylonjs 3.3.0b4, it feels very close to the native controller UX on the device.
  3. Wow that was fast! Do you know if it's possible to try this out using npm? I thought I'd be able to do repo#commit: "dependencies": { "babylonjs": "git+https://github.com/BabylonJS/Babylon.js.git#685b8f0f4babca6fa1fef13f24991f5cafa107d8" But the new method doesn't seem to be included
  4. I'm able to pick sprites with Scene.pickSprite, but is there a way to pick them with scene.pickWithRay? PickWithRay only seems to return meshes (I've set isPickable to true on the sprites and confirmed that they're pickable with Scene.pickSprite). The use-case is, I'm trying to pick sprites with a 3DoF VR Controller, so I don't have a 2d pointerX and pointerY to work with, only the controller's forward ray. I'm thinking that my options are: a. Use Vector3.Project to try to unproject the pickedPoint of pickWithRay (I'm using a skybox, so the ray will always hit something), then put that point into Scene.pickSprite. I tried this quickly, but I think the unprojected point might be off b. replace the sprites with billboarded mesh instances that can directly be hit with pickWithRay. I suspect this might be the easiest option? Or is there some easier way to pick a sprite with a ray?
  5. Definitely learning a lot! Thanks for your help with this
  6. Latest update: All my issues with the Oculus Go controller have been fixed by moving from babylonjs 3.2.0 to the latest beta 3.3.0b4. I no longer need to supply my own GLTF controller model, or mess around with the pivot point to reposition it. While googling, I found this PR which addresses the issue I was having above with the controller not being down by your right hand side and so on https://github.com/BabylonJS/Babylon.js/pull/4289/files , then realised it was merged in July, after the 3.2.0 release.
  7. Findings so far: 1. PickingInfo Sadly, pointerObservables don't work on the Oculus Go when in full VR mode (apparently other headsets do map the controllers to pointer events). However, you can get pickingInfo using the controller's forward ray, eg: vrHelper.onControllerMeshLoadedObservable.add(controller => { controller.onButtonStateChange((controlIndex, buttonIndex, button) => { const ray = controller.getForwardRay(48); const pickInfo = scene.pickWithRay(ray, mesh => { return !mesh.name.includes("laserPointer"); }); If you're showing the laser beam, you'll need to exclude it from the ray's mesh predicate. If you're using a gazeTrackerMesh though, you could just use the position of the tracker mesh, and save yourself an extra raycast. 2. customizing the controller mesh Babylon attempts to load a controller model from a .babylon file. This fails for me, possibly because of a mimetype issue with .babylon files. As a fallback, a long thin cylinder is shown. This is quite ugly though, as the origin of the cylinder is your head, so it pokes you right in the eye. controller.AttachToMesh has no effect in this case, the cylinder remains visible (unless I've misunderstood the API this doesn't seem like the desired behaviour, I think I'd like to raise this as a bug). To get round this, I converted the controller.babylon file to gltf using a playground https://playground.babylonjs.com/ts.html#D1N0MZ#4 put the GLTF files in my project, and override them as the default controller the method suggested by @brianzinn: BABYLON.GearVRController.MODEL_BASE_URL = "assets/geometries/vrController/"; BABYLON.GearVRController.MODEL_FILENAME = "controller.gltf"; It feels like I should be able to use controller.AttachToMesh to use the gltf model rather than overriding these static values. The next thing I need to work out is: 3. how to offset the position of the controller Oculus Go is a 3DoF system, meaning that the position of the controller is somewhat arbitrary. Throughout the rest of the Oculus UX, the controller appears in the lower-right corner of your field-of-vision, as if you're holding it in your righthand at around waist height. In WebVR mode though, it's position is right in front of your face. So far I've just been manipulating the pivot matrix of the controller mesh to move it down to the corner. This isn't the correct way to do this though, because if I rotate the controller in my hands around its forward axis, the onscreen controller will loop around to the top of the screen, because of the large pivot offset I've given it. I'm sure there must be some attribute somewhere that I need to set (I thought I might be able to set controller.devicePosition but it doesn't appear to have an effect), I'll continue digging. Massive thanks to @brianzinn for all his help so far!
  8. Oh wait a minute I think I know what it is. Logging those MODEL_FILENAME that you posted, they all point to .babylon files. Maybe its the same issue I'm having on the .env thread of not being able to serve certain file types, and that long thin cylinder is a fallback.
  9. Yeah, scene.onPointerObservable definitely doesn't fire on the Oculus Go when you're in full VR mode (but does fire in browser mode). That annoying cylinder I see poking me in the eye can be turned off with controller.mesh.setEnabled(false) What's weird, is that when I go to the Fruit Ninja playground, that same controller mesh is an actual model of the controller (looks a bit different, maybe its a model of the GearVR), kind of like what you see elsewhere in the Oculus Go UX. How come the controller.mesh I see is just a long thin cylinder, but the one in the playground is an actual model of the controller? I'm running on the npm version of BabylonJS 3.2.0, could it be that the playground uses a slightly different version, with different bundled assets?
  10. @brianzinn thanks for that, loads of things for me to try out there. On your first point, I do have scene.onPointerObservable set up, and it doesn't seem to be firing when in full VR mode (though it does when in "browser" mode, when you're looking at a virtual screen showing the web browser), I'll need to double-check that it isn't firing.
  11. I borrowed an Oculus Go from work, here are some first impressions/ questions. Overall I'm really impressed with the hardware. It's comfortable to wear, resolution and FPS seem fine to me. My only other VR headset experiences have been cardboard and a Samsung one (forget which it was), Oculus Go is better than either of those. As a dev device, I've not downloaded any SDK or looked at any dev doc, I just point the device's browser at http://<my laptop's IP address>:8080 and off I go (no JS console tho!) It's amazing how much the following one line of code gets you: const vrHelper = scene.createDefaultVRExperience({ createDeviceOrientationCamera: false }); it gives you a VR icon on the screen. When you tap it, Oculus Go launches into fullscreen VR. Looking around looks great, works seamlessly out the box. Worth noting that Oculus Go is a 3 DOF system, rather than 6 DoF. Meaning that it only tracks orientation of the headset (and the controller too? Need to double-check this), not its position. Where I have run into some difficulties is with the controller. I'm currently trying to implement so that the user can point at a mesh with the controller, and pull the trigger to select a point on that mesh. I'm going to list some of these in this thread. Bearing in mind I've only had the device for a few hours. If anyone has suggestions for these issues, would be great to hear. 1. getting PickingInfo So far I've only been able to get PickingInfo with vrHelper.onNewMeshPicked this only fires when the pointer first moves over the mesh, regardless of whether the user is pressing one of the buttons or not. The callback for picking up button changes controller.onButtonStateChange returns info about the button, but no pickInfo. I guess I need to call scene.Pick inside the button state change callback, haven't had time to try this yet. 2. customizing the controller mesh When you enable interactivity with vrHelper.enableInteractions(); The default mesh for the controller is a long, thin cylinder that stretches from where you're pointing, right up to your eyes. It's really in-your-face, and I haven't found a way to modify or disable it yet. This doesn't have any effect: vrHelper.displayGaze = false; And neither did trying to apply a custom mesh with controller[0].attachToMesh(mesh) I've got to be offline for a few hours now, but I'll keep experimenting. If anyone has questions, tips, please do post.
  12. @Deltakosh sorry about that. I'm struggling actually to get npm/webpack to send babylon-max instead of the minified one. I upload the source and then the build happens on the server, so I can't just manually copy the max file across. edit: I think I've thought of a way to do this, I'll try again tomorrow.
  13. @Deltakosh sure, here's a version that falls down right away with the "cannot load cubemap" issue https://sky-explorer-birfeajogq.now.sh/ You can view the source here https://sky-explorer-birfeajogq.now.sh/_src
  14. If it is a mimetype issue though, how come I get a 200 network response for the .env file when I try loading it with assetManager.addBinaryFileTask?
  15. Yeah, I've got this in there, express.static.mime.define({'application/octet-stream': ['env']}); doesn't make a difference though. I'll try it without the static
  16. @brianzinn I think you're suggesting something like res.send(new Buffer(texData, 'binary')) though the problem is that the get path doesn't seem to get called for .env
  17. In the node server, I try intercepting the request for the file, like this: app.get('/assets/textures/:file(*)', (req, res, next) => { console.log(req.url, req.params.file); const staticPath = path.join(__dirname, "..", "..", "client", "dist", req.path); fs.readFile(staticPath, (err, data) => { if (err) { console.log(err) res.send({ message: "oh no!", error: err }); } else { const file = path.basename(req.path); res.contentType(file); console.log("sending"); res.send(data); } res.end(); }); }); This gets called and the logging works for png files etc, but it doesn't get called at all for the .env file (this is when the console for the client errors with "Cannot load cubemap because files were not defined"). It's as if the request for the .env file isn't being made at all
  18. But, when I use the CubeTexture.CreateFromPrefilteredData code, I don't see the file at all in the network conditioner. Could you explain a little more how I would do this?
  19. I disabled the cache in developer mode, so now it's a 200
  20. Checking the network conditioner, when I run the "binaryFileTask" operation, these are the headers in for the .env file: Request URL: http://0.0.0.0:2657/assets/textures/mono_lake.env Request Method: GET Status Code: 200 OK Remote Address: 0.0.0.0:2657 Referrer Policy: no-referrer-when-downgrade Response Headersview source Connection: keep-alive Content-Length: 1067838 Content-Type: application/octet-stream Date: Thu, 23 Aug 2018 20:13:49 GMT ETag: W/"104b3e-UkXMdunGN93+cNYg5Su/4I5pzrg" X-Powered-By: Express Request Headersview source Accept: */* Accept-Encoding: gzip, deflate Accept-Language: en-GB,en-US;q=0.9,en;q=0.8 Cache-Control: no-cache Connection: keep-alive Host: 0.0.0.0:2657 Pragma: no-cache Referer: http://0.0.0.0:2657/ User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36
  21. I'm using express.js to serve a BabylonJS app statically. The dev server is ts-node running on localhost. Everything is going great except that it won't load .env files. If I try loading the .env file: const envTexture = BABYLON.CubeTexture.CreateFromPrefilteredData("assets/textures/mono_lake.env", scene); const skyBox = scene.createDefaultSkybox(envTexture, true, 128); I get the error "Cannot load cubemap because files were not defined" in the console. Elsewhere on the forum, I see that people using IIS servers need to explicitly allow .env file mimetypes in a web.config file, but I'm wondering if this is necessary in express running on locahost? What makes me think it is not a mime issue, is that I do seem to be able to load the .env as a binary file if I use the code below: Someone must be serving Babylon files over node, does anyone know how to get this working? const assetManager = new BABYLON.AssetsManager(scene); const skyboxTask = assetManager.addBinaryFileTask("skybox", "assets/textures/mono_lake.env"); skyboxTask.onError = (task, message, exception) => { console.log(message); } skyboxTask.onSuccess = task => { console.log("success, length: ", task.data.byteLength);// returns the correct length of the .env file } assetManager.load();
  22. What would the mimetype be for .env files? 'application/octet-stream' or 'application/env'?
  23. The skybox looks a lot better in safari with that second playground you posted. When you said Does this mean I need to supply a mimeMap for .env? Currently I'm building my babylonJS app as a static site using webpack. I'll experiment with using a package like https://www.npmjs.com/package/mime to add a mapping for .env. Any pointers you could give me on this would be very much appreciated.
  24. Oh, maybe not. My dev environment is webpack-dev-server --> localhost. Is the authorizing process documented anywhere? Thanks for the playground link, looks good in Chrome, but the gamma seems to be off in Safari.