engine_components icon indicating copy to clipboard operation
engine_components copied to clipboard

Support for non-fullscreen canvas apps

Open NiklasPor opened this issue 1 year ago • 2 comments

Description 📝

I'm using openbim-components in a non-full-screen application (with HTML elements to the side) and many components break from this usage, because they refer to the window size for rendering, not to the canvas size.

Suggested solution 💡

The fix for this is quite simple, in most cases replacing window.innerHeight with canvas.clientHeight and window.innerWidth with canvas.innerHeight does the trick. I'd be very happy to contribute these changes, if they're wanted.

Example fix for the simple camera. Current code: https://github.com/IFCjs/components/blob/1e2695e38b07885d7168f83382e027189c5f6e56/src/core/SimpleCamera/index.ts#L103

Updated:

    const aspect = window.innerWidth / window.innerHeight;

Alternative ⛕

No response

Additional context ☝️

FYI This is not a problem inside the documentation, because every viewer is a fullscreen iFrame there.

I already copy pasted many components into our project and edited them, to fix the issues. I'd be very happy to contribute back 👋

Validations ✅

  • [X] Read the docs.
  • [X] Check that there isn't already an issue that requests the same feature to avoid creating a duplicate.

NiklasPor avatar Dec 21 '23 09:12 NiklasPor