Menubar.Add.js 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. Menubar.Add = function ( editor ) {
  5. var container = new UI.Panel();
  6. container.setClass( 'menu' );
  7. var title = new UI.Panel();
  8. title.setClass( 'title' );
  9. title.setTextContent( 'Add' );
  10. container.add( title );
  11. var options = new UI.Panel();
  12. options.setClass( 'options' );
  13. container.add( options );
  14. //
  15. var meshCount = 0;
  16. var lightCount = 0;
  17. var cameraCount = 0;
  18. editor.signals.editorCleared.add( function () {
  19. meshCount = 0;
  20. lightCount = 0;
  21. cameraCount = 0;
  22. } );
  23. // Group
  24. var option = new UI.Row();
  25. option.setClass( 'option' );
  26. option.setTextContent( 'Group' );
  27. option.onClick( function () {
  28. var mesh = new THREE.Group();
  29. mesh.name = 'Group ' + ( ++ meshCount );
  30. editor.execute( new AddObjectCommand( mesh ) );
  31. } );
  32. options.add( option );
  33. //
  34. options.add( new UI.HorizontalRule() );
  35. // Plane
  36. var option = new UI.Row();
  37. option.setClass( 'option' );
  38. option.setTextContent( 'Plane' );
  39. option.onClick( function () {
  40. var geometry = new THREE.PlaneBufferGeometry( 1, 1, 1, 1 );
  41. var material = new THREE.MeshStandardMaterial();
  42. var mesh = new THREE.Mesh( geometry, material );
  43. mesh.name = 'Plane ' + ( ++ meshCount );
  44. editor.execute( new AddObjectCommand( mesh ) );
  45. } );
  46. options.add( option );
  47. // Box
  48. var option = new UI.Row();
  49. option.setClass( 'option' );
  50. option.setTextContent( 'Box' );
  51. option.onClick( function () {
  52. var geometry = new THREE.BoxBufferGeometry( 1, 1, 1, 1, 1, 1 );
  53. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  54. mesh.name = 'Box ' + ( ++ meshCount );
  55. editor.execute( new AddObjectCommand( mesh ) );
  56. } );
  57. options.add( option );
  58. // Circle
  59. var option = new UI.Row();
  60. option.setClass( 'option' );
  61. option.setTextContent( 'Circle' );
  62. option.onClick( function () {
  63. var geometry = new THREE.CircleBufferGeometry( 1, 8, 0, Math.PI * 2 );
  64. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  65. mesh.name = 'Circle ' + ( ++ meshCount );
  66. editor.execute( new AddObjectCommand( mesh ) );
  67. } );
  68. options.add( option );
  69. // Cylinder
  70. var option = new UI.Row();
  71. option.setClass( 'option' );
  72. option.setTextContent( 'Cylinder' );
  73. option.onClick( function () {
  74. var geometry = new THREE.CylinderBufferGeometry( 1, 1, 1, 8, 1, false, 0, Math.PI * 2 );
  75. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  76. mesh.name = 'Cylinder ' + ( ++ meshCount );
  77. editor.execute( new AddObjectCommand( mesh ) );
  78. } );
  79. options.add( option );
  80. // Sphere
  81. var option = new UI.Row();
  82. option.setClass( 'option' );
  83. option.setTextContent( 'Sphere' );
  84. option.onClick( function () {
  85. var geometry = new THREE.SphereBufferGeometry( 1, 8, 6, 0, Math.PI * 2, 0, Math.PI );
  86. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  87. mesh.name = 'Sphere ' + ( ++ meshCount );
  88. editor.execute( new AddObjectCommand( mesh ) );
  89. } );
  90. options.add( option );
  91. // Icosahedron
  92. var option = new UI.Row();
  93. option.setClass( 'option' );
  94. option.setTextContent( 'Icosahedron' );
  95. option.onClick( function () {
  96. var geometry = new THREE.IcosahedronGeometry( 1, 0 );
  97. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  98. mesh.name = 'Icosahedron ' + ( ++ meshCount );
  99. editor.execute( new AddObjectCommand( mesh ) );
  100. } );
  101. options.add( option );
  102. // Torus
  103. var option = new UI.Row();
  104. option.setClass( 'option' );
  105. option.setTextContent( 'Torus' );
  106. option.onClick( function () {
  107. var geometry = new THREE.TorusBufferGeometry( 1, 0.4, 8, 6, Math.PI * 2 );
  108. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  109. mesh.name = 'Torus ' + ( ++ meshCount );
  110. editor.execute( new AddObjectCommand( mesh ) );
  111. } );
  112. options.add( option );
  113. // TorusKnot
  114. var option = new UI.Row();
  115. option.setClass( 'option' );
  116. option.setTextContent( 'TorusKnot' );
  117. option.onClick( function () {
  118. var geometry = new THREE.TorusKnotBufferGeometry( 1, 0.4, 64, 8, 2, 3 );
  119. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  120. mesh.name = 'TorusKnot ' + ( ++ meshCount );
  121. editor.execute( new AddObjectCommand( mesh ) );
  122. } );
  123. options.add( option );
  124. /*
  125. // Teapot
  126. var option = new UI.Row();
  127. option.setClass( 'option' );
  128. option.setTextContent( 'Teapot' );
  129. option.onClick( function () {
  130. var size = 50;
  131. var segments = 10;
  132. var bottom = true;
  133. var lid = true;
  134. var body = true;
  135. var fitLid = false;
  136. var blinnScale = true;
  137. var material = new THREE.MeshStandardMaterial();
  138. var geometry = new THREE.TeapotBufferGeometry( size, segments, bottom, lid, body, fitLid, blinnScale );
  139. var mesh = new THREE.Mesh( geometry, material );
  140. mesh.name = 'Teapot ' + ( ++ meshCount );
  141. editor.addObject( mesh );
  142. editor.select( mesh );
  143. } );
  144. options.add( option );
  145. */
  146. // Lathe
  147. var option = new UI.Row();
  148. option.setClass( 'option' );
  149. option.setTextContent( 'Lathe' );
  150. option.onClick( function() {
  151. var points = [
  152. new THREE.Vector2( 0, 0 ),
  153. new THREE.Vector2( 4, 0 ),
  154. new THREE.Vector2( 3.5, 0.5 ),
  155. new THREE.Vector2( 1, 0.75 ),
  156. new THREE.Vector2( 0.8, 1 ),
  157. new THREE.Vector2( 0.8, 4 ),
  158. new THREE.Vector2( 1, 4.2 ),
  159. new THREE.Vector2( 1.4, 4.8 ),
  160. new THREE.Vector2( 2, 5 ),
  161. new THREE.Vector2( 2.5, 5.4 ),
  162. new THREE.Vector2( 3, 12 )
  163. ];
  164. var segments = 20;
  165. var phiStart = 0;
  166. var phiLength = 2 * Math.PI;
  167. var geometry = new THREE.LatheBufferGeometry( points, segments, phiStart, phiLength );
  168. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
  169. mesh.name = 'Lathe ' + ( ++ meshCount );
  170. editor.execute( new AddObjectCommand( mesh ) );
  171. } );
  172. options.add( option );
  173. // Sprite
  174. var option = new UI.Row();
  175. option.setClass( 'option' );
  176. option.setTextContent( 'Sprite' );
  177. option.onClick( function () {
  178. var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
  179. sprite.name = 'Sprite ' + ( ++ meshCount );
  180. editor.execute( new AddObjectCommand( sprite ) );
  181. } );
  182. options.add( option );
  183. //
  184. options.add( new UI.HorizontalRule() );
  185. // PointLight
  186. var option = new UI.Row();
  187. option.setClass( 'option' );
  188. option.setTextContent( 'PointLight' );
  189. option.onClick( function () {
  190. var color = 0xffffff;
  191. var intensity = 1;
  192. var distance = 0;
  193. var light = new THREE.PointLight( color, intensity, distance );
  194. light.name = 'PointLight ' + ( ++ lightCount );
  195. editor.execute( new AddObjectCommand( light ) );
  196. } );
  197. options.add( option );
  198. // SpotLight
  199. var option = new UI.Row();
  200. option.setClass( 'option' );
  201. option.setTextContent( 'SpotLight' );
  202. option.onClick( function () {
  203. var color = 0xffffff;
  204. var intensity = 1;
  205. var distance = 0;
  206. var angle = Math.PI * 0.1;
  207. var penumbra = 0;
  208. var light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
  209. light.name = 'SpotLight ' + ( ++ lightCount );
  210. light.target.name = 'SpotLight ' + ( lightCount ) + ' Target';
  211. light.position.set( 5, 10, 7.5 );
  212. editor.execute( new AddObjectCommand( light ) );
  213. } );
  214. options.add( option );
  215. // DirectionalLight
  216. var option = new UI.Row();
  217. option.setClass( 'option' );
  218. option.setTextContent( 'DirectionalLight' );
  219. option.onClick( function () {
  220. var color = 0xffffff;
  221. var intensity = 1;
  222. var light = new THREE.DirectionalLight( color, intensity );
  223. light.name = 'DirectionalLight ' + ( ++ lightCount );
  224. light.target.name = 'DirectionalLight ' + ( lightCount ) + ' Target';
  225. light.position.set( 5, 10, 7.5 );
  226. editor.execute( new AddObjectCommand( light ) );
  227. } );
  228. options.add( option );
  229. // HemisphereLight
  230. var option = new UI.Row();
  231. option.setClass( 'option' );
  232. option.setTextContent( 'HemisphereLight' );
  233. option.onClick( function () {
  234. var skyColor = 0x00aaff;
  235. var groundColor = 0xffaa00;
  236. var intensity = 1;
  237. var light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
  238. light.name = 'HemisphereLight ' + ( ++ lightCount );
  239. light.position.set( 0, 10, 0 );
  240. editor.execute( new AddObjectCommand( light ) );
  241. } );
  242. options.add( option );
  243. // AmbientLight
  244. var option = new UI.Row();
  245. option.setClass( 'option' );
  246. option.setTextContent( 'AmbientLight' );
  247. option.onClick( function() {
  248. var color = 0x222222;
  249. var light = new THREE.AmbientLight( color );
  250. light.name = 'AmbientLight ' + ( ++ lightCount );
  251. editor.execute( new AddObjectCommand( light ) );
  252. } );
  253. options.add( option );
  254. //
  255. options.add( new UI.HorizontalRule() );
  256. // PerspectiveCamera
  257. var option = new UI.Row();
  258. option.setClass( 'option' );
  259. option.setTextContent( 'PerspectiveCamera' );
  260. option.onClick( function() {
  261. var camera = new THREE.PerspectiveCamera( 50, 1, 1, 10000 );
  262. camera.name = 'PerspectiveCamera ' + ( ++ cameraCount );
  263. editor.execute( new AddObjectCommand( camera ) );
  264. } );
  265. options.add( option );
  266. return container;
  267. };
粤ICP备19079148号