Fix orbit controls of ui.scene after changing the camera's up vector

[voigta]

This PR solves the problem that scenes need to have their Z-Axis "upwards" in order to have working orbit controls. If one tries to manually move the camera with scene.move_camera(up_z=-1), the orbit controls are not updated and the mouse-interaction gets weird.

PS: Thanks for creating and sharing this awesome library! 💪

[falkoschindler]

Thanks for the pull request, @voigta!

But if I'm not mistaken, you can already change the camera's "up" vector via the move_camera() method:

with ui.scene() as scene:
    scene.move_camera(up_x=1, up_y=0, up_z=0)
    scene.cylinder(0, 1)

Therefore I don't think this PR is necessary.

[voigta]

Yes, you can already change the "up" vector via move_camera but the OrbitControls are not updated accordingly. It looks like OrbitControls doesn't allow for a change in "up" because it only uses the object.up property once here:

nicegui/nicegui/elements/lib/three/modules/OrbitControls.js

Line 170 in 252a111

const quat = new Quaternion().setFromUnitVectors( object.up, new Vector3( 0, 1, 0 ) );

An example to show the problem I want to solve:

from nicegui import ui

ui.label("A regular scene with correct mouse interaction:")
with ui.scene() as scene_regular:
    scene_regular.cylinder(0, 1)

ui.label("An inverted scene with inverted mouse interaction:")
with ui.scene() as scene_inverted:
    scene_inverted.move_camera(up_z=-1)
    scene_inverted.cylinder(0, 1)

ui.run()

Another (maybe cleaner?) solution would be to create a new OrbitControls object in case camera.up is changed here:

nicegui/nicegui/elements/scene.js

Lines 425 to 431 in 252a111

	.onUpdate((p) => {
	this.camera.position.set(p[0], p[1], p[2]);
	this.camera.up.set(p[3], p[4], p[5]); // NOTE: before calling lookAt
	this.look_at.set(p[6], p[7], p[8]);
	this.camera.lookAt(p[6], p[7], p[8]);
	this.controls.target.set(p[6], p[7], p[8]);
	})

[falkoschindler]

Nice! This solution seems reasonable. Let's merge!