I've been developing a VR world where the camera can be turned and tilted in the center but not moved around freely.
Within this virtual reality environment, you have the ability to attach a video to the background. Users can either play it by clicking on it or hovering the crosshair over the element.
The video has two states: a "normal" state and a "zoomed" state, each with their own unique appearance as seen here: Example normal and Example zoom
In the zoomed state, I want to ensure that the video does not extend beyond the current viewport size. I already know the width and height of the video. How can I calculate the correct sizing or depth to make sure it fits within the viewport?
I'm exploring both options of scaling the object on its current position or moving it closer to the camera. Any advice or suggestions are welcome.
I've attempted using the approach mentioned in this discussion thread: Link
let vFOV = this._engine.getCurrentCamera().fov * Math.PI / 180;
let ratio = 2 * Math.tan(vFOV / 2);
let screen = ratio * (window.innerWidth / window.innerHeight);
let size = this._contentMesh.geometry.boundingBox.max.y;
return (size/screen) / 4;
However, the result from the example above places the object too close to the camera. Is there something I might be missing or overlooking?
Thank you for any assistance you can provide!