Editor: Unified Viewport.Camera and Viewport.Shading,

editor/js/Viewport.Camera.js

@@ -1,48 +0,0 @@
-import { UISelect } from './libs/ui.js';
-
-function ViewportCamera( editor ) {
-
-	const signals = editor.signals;
-
-	//
-
-	const select = new UISelect();
-	select.setPosition( 'absolute' );
-	select.setRight( '120px' );
-	select.setTop( '10px' );
-	select.onChange( function () {
-
-		editor.setViewportCamera( this.getValue() );
-
-	} );
-
-	signals.cameraAdded.add( update );
-	signals.cameraRemoved.add( update );
-
-	update();
-
-	//
-
-	function update() {
-
-		const options = {};
-
-		const cameras = editor.cameras;
-
-		for ( const key in cameras ) {
-
-			const camera = cameras[ key ];
-			options[ camera.uuid ] = camera.name;
-
-		}
-
-		select.setOptions( options );
-		select.setValue( editor.viewportCamera.uuid );
-
-	}
-
-	return select;
-
-}
-
-export { ViewportCamera };

editor/js/Viewport.Controls.js

@@ -0,0 +1,64 @@
+import { UIPanel, UISelect } from './libs/ui.js';
+
+function ViewportControls( editor ) {
+
+	const signals = editor.signals;
+
+	const container = new UIPanel();
+	container.setPosition( 'absolute' );
+	container.setRight( '10px' );
+	container.setTop( '10px' );
+
+	// camera
+
+	const cameraSelect = new UISelect();
+	cameraSelect.setMarginRight( '10px' );
+	cameraSelect.onChange( function () {
+
+		editor.setViewportCamera( this.getValue() );
+
+	} );
+	container.add( cameraSelect );
+
+	signals.cameraAdded.add( update );
+	signals.cameraRemoved.add( update );
+
+	// shading
+
+	const shadingSelect = new UISelect();
+	shadingSelect.setOptions( { 'default': 'default', 'normals': 'normals', 'wireframe': 'wireframe' } );
+	shadingSelect.setValue( 'default' );
+	shadingSelect.onChange( function () {
+
+		editor.setViewportShading( this.getValue() );
+
+	} );
+	container.add( shadingSelect );
+
+	update();
+
+	//
+
+	function update() {
+
+		const options = {};
+
+		const cameras = editor.cameras;
+
+		for ( const key in cameras ) {
+
+			const camera = cameras[ key ];
+			options[ camera.uuid ] = camera.name;
+
+		}
+
+		cameraSelect.setOptions( options );
+		cameraSelect.setValue( editor.viewportCamera.uuid );
+
+	}
+
+	return container;
+
+}
+
+export { ViewportControls };

editor/js/Viewport.Shading.js

@@ -1,21 +0,0 @@
-import { UISelect } from './libs/ui.js';
-
-function ViewportShading( editor ) {
-
-	const select = new UISelect();
-	select.setPosition( 'absolute' );
-	select.setRight( '10px' );
-	select.setTop( '10px' );
-	select.setOptions( { 'default': 'default', 'normals': 'normals', 'wireframe': 'wireframe' } );
-	select.setValue( 'default' );
-	select.onChange( function () {
-
-		editor.setViewportShading( this.getValue() );
-
-	} );
-
-	return select;
-
-}
-
-export { ViewportShading };

editor/js/Viewport.js

@@ -6,8 +6,7 @@ import { UIPanel } from './libs/ui.js';
 
 import { EditorControls } from './EditorControls.js';
 
-import { ViewportCamera } from './Viewport.Camera.js';
-import { ViewportShading } from './Viewport.Shading.js';
+import { ViewportControls } from './Viewport.Controls.js';
 import { ViewportInfo } from './Viewport.Info.js';
 
 import { ViewHelper } from './Viewport.ViewHelper.js';
@@ -27,8 +26,7 @@ function Viewport( editor ) {
 	container.setId( 'viewport' );
 	container.setPosition( 'absolute' );
 
-	container.add( new ViewportCamera( editor ) );
-	container.add( new ViewportShading( editor ) );
+	container.add( new ViewportControls( editor ) );
 	container.add( new ViewportInfo( editor ) );
 
 	//

editor/sw.js

@@ -184,8 +184,7 @@ const assets = [
 	'./js/Strings.js',
 	'./js/Toolbar.js',
 	'./js/Viewport.js',
-	'./js/Viewport.Camera.js',
-	'./js/Viewport.Shading.js',
+	'./js/Viewport.Controls.js',
 	'./js/Viewport.Info.js',
 	'./js/Viewport.Selector.js',
 	'./js/Viewport.ViewHelper.js',