Editor: Moved grid and helpers settings to Viewport.Controls.

editor/js/Sidebar.Settings.Viewport.js

@@ -1,48 +0,0 @@
-import { UIPanel, UIText, UIRow } from './libs/ui.js';
-import { UIBoolean } from './libs/ui.three.js';
-
-
-function SidebarSettingsViewport( editor ) {
-
-	const signals = editor.signals;
-	const strings = editor.strings;
-
-	const container = new UIPanel();
-
-	const headerRow = new UIRow();
-	headerRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport' ).toUpperCase() ) );
-	container.add( headerRow );
-
-	// grid
-
-	const showGridRow = new UIRow();
-
-	showGridRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport/grid' ) ).setWidth( '90px' ) );
-
-	const showGrid = new UIBoolean( true ).onChange( function () {
-
-		signals.showGridChanged.dispatch( showGrid.getValue() );
-
-	} );
-	showGridRow.add( showGrid );
-	container.add( showGridRow );
-
-	// helpers
-
-	const showHelpersRow = new UIRow();
-
-	showHelpersRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport/helpers' ) ).setWidth( '90px' ) );
-
-	const showHelpers = new UIBoolean( true ).onChange( function () {
-
-		signals.showHelpersChanged.dispatch( showHelpers.getValue() );
-
-	} );
-	showHelpersRow.add( showHelpers );
-	container.add( showHelpersRow );
-
-	return container;
-
-}
-
-export { SidebarSettingsViewport };

editor/js/Sidebar.Settings.js

@@ -1,6 +1,5 @@
 import { UIPanel, UIRow, UISelect, UISpan, UIText } from './libs/ui.js';
 
-import { SidebarSettingsViewport } from './Sidebar.Settings.Viewport.js';
 import { SidebarSettingsShortcuts } from './Sidebar.Settings.Shortcuts.js';
 import { SidebarSettingsHistory } from './Sidebar.Settings.History.js';
 
@@ -49,7 +48,6 @@ function SidebarSettings( editor ) {
 
 	//
 
-	container.add( new SidebarSettingsViewport( editor ) );
 	container.add( new SidebarSettingsShortcuts( editor ) );
 	container.add( new SidebarSettingsHistory( editor ) );
 

editor/js/Strings.js

@@ -336,10 +336,6 @@ function Strings( config ) {
 			'sidebar/settings/shortcuts/undo': 'Undo',
 			'sidebar/settings/shortcuts/focus': 'Focus',
 
-			'sidebar/settings/viewport': 'Viewport',
-			'sidebar/settings/viewport/grid': 'Grid',
-			'sidebar/settings/viewport/helpers': 'Helpers',
-
 			'sidebar/history': 'History',
 			'sidebar/history/persistent': 'persistent',
 
@@ -348,6 +344,9 @@ function Strings( config ) {
 			'toolbar/scale': 'Scale',
 			'toolbar/local': 'Local',
 
+			'viewport/controls/grid': 'Grid',
+			'viewport/controls/helpers': 'Helpers',
+
 			'viewport/info/objects': 'Objects',
 			'viewport/info/vertices': 'Vertices',
 			'viewport/info/triangles': 'Triangles',
@@ -685,10 +684,6 @@ function Strings( config ) {
 			'sidebar/settings/shortcuts/undo': 'Annuler',
 			'sidebar/settings/shortcuts/focus': 'Focus',
 
-			'sidebar/settings/viewport': 'Viewport',
-			'sidebar/settings/viewport/grid': 'Grille',
-			'sidebar/settings/viewport/helpers': 'Helpers',
-
 			'sidebar/history': 'Historique',
 			'sidebar/history/persistent': 'permanent',
 
@@ -697,6 +692,9 @@ function Strings( config ) {
 			'toolbar/scale': 'Échelle',
 			'toolbar/local': 'Local',
 
+			'viewport/controls/grid': 'Grille',
+			'viewport/controls/helpers': 'Helpers',
+
 			'viewport/info/objects': 'Objets',
 			'viewport/info/vertices': 'Sommets',
 			'viewport/info/triangles': 'Triangles',
@@ -1034,10 +1032,6 @@ function Strings( config ) {
 			'sidebar/settings/shortcuts/undo': '撤销',
 			'sidebar/settings/shortcuts/focus': '聚焦',
 
-			'sidebar/settings/viewport': '视窗',
-			'sidebar/settings/viewport/grid': '网格',
-			'sidebar/settings/viewport/helpers': '辅助',
-
 			'sidebar/history': '历史记录',
 			'sidebar/history/persistent': '本地存储',
 
@@ -1046,6 +1040,9 @@ function Strings( config ) {
 			'toolbar/scale': '缩放',
 			'toolbar/local': '本地',
 
+			'viewport/controls/grid': '网格',
+			'viewport/controls/helpers': '辅助',
+
 			'viewport/info/objects': '物体',
 			'viewport/info/vertices': '顶点',
 			'viewport/info/triangles': '三角形',

editor/js/Viewport.Controls.js

@@ -1,17 +1,41 @@
 import { UIPanel, UISelect } from './libs/ui.js';
+import { UIBoolean } from './libs/ui.three.js';
 
 function ViewportControls( editor ) {
 
 	const signals = editor.signals;
+	const strings = editor.strings;
 
 	const container = new UIPanel();
 	container.setPosition( 'absolute' );
 	container.setRight( '10px' );
 	container.setTop( '10px' );
+	container.setColor( '#ffffff' );
+
+	// grid
+
+	const gridCheckbox = new UIBoolean( true, strings.getKey( 'viewport/controls/grid' ) );
+	gridCheckbox.onChange( function () {
+
+		signals.showGridChanged.dispatch( this.getValue() );
+
+	} );
+	container.add( gridCheckbox );
+
+	// helpers
+
+	const helpersCheckbox = new UIBoolean( true, strings.getKey( 'viewport/controls/helpers' ) );
+	helpersCheckbox.onChange( function () {
+
+		signals.showHelpersChanged.dispatch( this.getValue() );
+
+	} );
+	container.add( helpersCheckbox );
 
 	// camera
 
 	const cameraSelect = new UISelect();
+	cameraSelect.setMarginLeft( '10px' );
 	cameraSelect.setMarginRight( '10px' );
 	cameraSelect.onChange( function () {
 

editor/js/libs/ui.js

@@ -429,6 +429,14 @@ class UICheckbox extends UIElement {
 		this.dom.className = 'Checkbox';
 		this.dom.type = 'checkbox';
 
+		this.dom.addEventListener( 'pointerdown', function ( event ) {
+
+			// Workaround for TransformControls blocking events in Viewport.Controls checkboxes
+
+			event.stopPropagation();
+		
+		} );
+
 		this.setValue( boolean );
 
 	}

editor/sw.js

@@ -149,7 +149,6 @@ const assets = [
 	'./js/Sidebar.Settings.js',
 	'./js/Sidebar.Settings.History.js',
 	'./js/Sidebar.Settings.Shortcuts.js',
-	'./js/Sidebar.Settings.Viewport.js',
 	'./js/Sidebar.Properties.js',
 	'./js/Sidebar.Object.js',
 	'./js/Sidebar.Geometry.js',