UI.Toolbar.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. UI.Toolbar = function () {
  2. var _domElement = document.createElement( 'div' );
  3. _domElement.style.position = 'absolute';
  4. _domElement.style.backgroundColor = '#404040';
  5. // CUBE
  6. var _button = document.createElement( 'button' );
  7. _button.innerHTML = 'Cube';
  8. _button.addEventListener( 'click', function ( event ) {
  9. var geometry = new THREE.CubeGeometry( 100, 100, 100, 4, 4, 4 );
  10. var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
  11. var mesh = new THREE.Mesh( geometry, material );
  12. geometry.code = 'new THREE.CubeGeometry( 100, 100, 100, 4, 4, 4 )';
  13. material.code = 'new THREE.MeshBasicMaterial( { color: 0xffffff } )';
  14. signals.added.dispatch( mesh );
  15. }, false );
  16. _domElement.appendChild( _button );
  17. // SPHERE
  18. var _button = document.createElement( 'button' );
  19. _button.innerHTML = 'Sphere';
  20. _button.addEventListener( 'click', function ( event ) {
  21. var geometry = new THREE.SphereGeometry( 75, 20, 10 );
  22. var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
  23. var mesh = new THREE.Mesh( geometry, material );
  24. geometry.code = 'new THREE.SphereGeometry( 75, 20, 10 )';
  25. material.code = 'new THREE.MeshBasicMaterial( { color: 0xffffff } )';
  26. signals.added.dispatch( mesh );
  27. }, false );
  28. _domElement.appendChild( _button );
  29. // TORUS
  30. var _button = document.createElement( 'button' );
  31. _button.innerHTML = 'Torus';
  32. _button.addEventListener( 'click', function ( event ) {
  33. var geometry = new THREE.TorusGeometry( 50, 20, 20, 20 );
  34. var material = new THREE.MeshBasicMaterial( { color: 0xffffff } );
  35. var mesh = new THREE.Mesh( geometry, material );
  36. geometry.code = 'new THREE.TorusGeometry( 50, 20, 20, 20 )';
  37. material.code = 'new THREE.MeshBasicMaterial( { color: 0xffffff } )';
  38. signals.added.dispatch( mesh );
  39. }, false );
  40. _domElement.appendChild( _button );
  41. this.getDOMElement = function () {
  42. return _domElement;
  43. };
  44. this.setPosition = function ( x, y ) {
  45. _domElement.style.left = x + 'px';
  46. _domElement.style.top = y + 'px';
  47. };
  48. this.setSize = function ( width, height ) {
  49. _domElement.style.width = width + 'px';
  50. _domElement.style.height = height + 'px';
  51. };
  52. };