three.js/gui/js/UI.Toolbar.js

UI.Toolbar = function () {

	var _domElement = document.createElement( 'div' );
	_domElement.style.position = 'absolute';
	_domElement.style.backgroundColor = '#404040';

	// CUBE

	var _button = document.createElement( 'button' );
	_button.innerHTML = 'Cube';
	_button.addEventListener( 'click', function ( event ) {

		var geometry = new THREE.CubeGeometry( 100, 100, 100, 4, 4, 4 );
		var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
		var mesh = new THREE.Mesh( geometry, material );

		signals.added.dispatch( mesh );

	}, false );
	_domElement.appendChild( _button );

	// SPHERE

	var _button = document.createElement( 'button' );
	_button.innerHTML = 'Sphere';
	_button.addEventListener( 'click', function ( event ) {

		var geometry = new THREE.SphereGeometry( 75, 20, 10 );
		var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
		var mesh = new THREE.Mesh( geometry, material );

		signals.added.dispatch( mesh );

	}, false );
	_domElement.appendChild( _button );

	// TORUS

	var _button = document.createElement( 'button' );
	_button.innerHTML = 'Torus';
	_button.addEventListener( 'click', function ( event ) {

		var geometry = new THREE.TorusGeometry( 50, 20, 20, 20 );
		var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
		var mesh = new THREE.Mesh( geometry, material );

		signals.added.dispatch( mesh );

	}, false );
	_domElement.appendChild( _button );

	this.getDOMElement = function () {

		return _domElement;

	};

	this.setPosition = function ( x, y ) {

		_domElement.style.left = x + 'px';
		_domElement.style.top = y + 'px';

	};

	this.setSize = function ( width, height ) {

		_domElement.style.width = width + 'px';
		_domElement.style.height = height + 'px';

	};

};