Editor: Using checkbox for boolean stuff.

As suggested by @sole.

editor/js/UI.js

@@ -344,30 +344,49 @@ UI.Select.prototype.onChange = function ( callback ) {
 
 };
 
+// Checkbox
 
-// Boolean
+UI.Checkbox = function ( position ) {
 
-UI.Boolean = function ( position ) {
+	UI.Element.call( this );
+
+	var scope = this;
+
+	this.dom = document.createElement( 'input' );
+	this.dom.type = 'checkbox';
+	this.dom.style.position = position || 'relative';
 
-	UI.Select.call( this, position );
+	this.onChangeCallback = null;
 
-	this.setOptions( { 'true': 'true', 'false': 'false' } );
+	this.dom.addEventListener( 'change', function ( event ) {
+
+		if ( scope.onChangeCallback ) scope.onChangeCallback();
+
+	}, false );
 
 	return this;
 
 };
 
-UI.Boolean.prototype = Object.create( UI.Select.prototype );
+UI.Checkbox.prototype = Object.create( UI.Element.prototype );
 
-UI.Boolean.prototype.getValue = function () {
+UI.Checkbox.prototype.getValue = function () {
 
-	return this.dom.value === 'true';
+	return this.dom.checked;
 
 };
 
-UI.Boolean.prototype.setValue = function ( value ) {
+UI.Checkbox.prototype.setValue = function ( value ) {
+
+	this.dom.checked = value;
+
+	return this;
 
-	this.dom.value = value.toString();
+};
+
+UI.Checkbox.prototype.onChange = function ( callback ) {
+
+	this.onChangeCallback = callback;
 
 	return this;
 

editor/js/ui/Sidebar.Properties.Material.js

@@ -176,7 +176,7 @@ Sidebar.Properties.Material = function ( signals ) {
 	// transparent
 
 	var materialTransparentRow = new UI.Panel();
-	var materialTransparent = new UI.Boolean( 'absolute' ).setValue( false ).setLeft( '90px' ).onChange( update );
+	var materialTransparent = new UI.Checkbox( 'absolute' ).setValue( false ).setLeft( '90px' ).onChange( update );
 
 	materialTransparentRow.add( new UI.HorizontalRule(), new UI.Text().setValue( 'Transparent' ).setColor( '#666' ) );
 	materialTransparentRow.add( materialTransparent );
@@ -186,7 +186,7 @@ Sidebar.Properties.Material = function ( signals ) {
 	// wireframe
 
 	var materialWireframeRow = new UI.Panel();
-	var materialWireframe = new UI.Boolean( 'absolute' ).setValue( false ).setLeft( '90px' ).onChange( update );
+	var materialWireframe = new UI.Checkbox( 'absolute' ).setValue( false ).setLeft( '90px' ).onChange( update );
 
 	materialWireframeRow.add( new UI.HorizontalRule(), new UI.Text().setValue( 'Wireframe' ).setColor( '#666' ) );
 	materialWireframeRow.add( materialWireframe );

editor/js/ui/Sidebar.Properties.Object3D.js

@@ -66,7 +66,7 @@ Sidebar.Properties.Object3D = function ( signals ) {
 	// visible
 
 	var objectVisibleRow = new UI.Panel();
-	var objectVisible = new UI.Boolean( 'absolute' ).setLeft( '90px' ).setWidth( '50px' ).onChange( update );
+	var objectVisible = new UI.Checkbox( 'absolute' ).setLeft( '90px' ).onChange( update );
 
 	objectVisibleRow.add( new UI.HorizontalRule(), new UI.Text().setValue( 'Visible' ).setColor( '#666' ) );
 	objectVisibleRow.add( objectVisible );