Menubar.Add.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. Menubar.Add = function ( editor ) {
  5. var strings = editor.strings;
  6. var container = new UI.Panel();
  7. container.setClass( 'menu' );
  8. var title = new UI.Panel();
  9. title.setClass( 'title' );
  10. title.setTextContent( strings.getKey( 'menubar/add' ) );
  11. container.add( title );
  12. var options = new UI.Panel();
  13. options.setClass( 'options' );
  14. container.add( options );
  15. // Group
  16. var option = new UI.Row();
  17. option.setClass( 'option' );
  18. option.setTextContent( strings.getKey( 'menubar/add/group' ) );
  19. option.onClick( function () {
  20. var mesh = new THREE.Group();
  21. mesh.name = 'Group';
  22. editor.execute( new AddObjectCommand( mesh ) );
  23. } );
  24. options.add( option );
  25. //
  26. options.add( new UI.HorizontalRule() );
  27. // Plane
  28. var option = new UI.Row();
  29. option.setClass( 'option' );
  30. option.setTextContent( strings.getKey( 'menubar/add/plane' ) );
  31. option.onClick( function () {
  32. var geometry = new THREE.PlaneBufferGeometry( 1, 1, 1, 1 );
  33. var material = new THREE.MeshStandardMaterial();
  34. var mesh = new THREE.Mesh( geometry, material );
  35. mesh.name = 'Plane';
  36. editor.execute( new AddObjectCommand( mesh ) );
  37. } );
  38. options.add( option );
  39. // Box
  40. var option = new UI.Row();
  41. option.setClass( 'option' );
  42. option.setTextContent( strings.getKey( 'menubar/add/box' ) );
  43. option.onClick( function () {
  44. var geometry = new THREE.BoxBufferGeometry( 1, 1, 1, 1, 1, 1 );
  45. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  46. mesh.name = 'Box';
  47. editor.execute( new AddObjectCommand( mesh ) );
  48. } );
  49. options.add( option );
  50. // Circle
  51. var option = new UI.Row();
  52. option.setClass( 'option' );
  53. option.setTextContent( strings.getKey( 'menubar/add/circle' ) );
  54. option.onClick( function () {
  55. var geometry = new THREE.CircleBufferGeometry( 1, 8, 0, Math.PI * 2 );
  56. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  57. mesh.name = 'Circle';
  58. editor.execute( new AddObjectCommand( mesh ) );
  59. } );
  60. options.add( option );
  61. // Cylinder
  62. var option = new UI.Row();
  63. option.setClass( 'option' );
  64. option.setTextContent( strings.getKey( 'menubar/add/cylinder' ) );
  65. option.onClick( function () {
  66. var geometry = new THREE.CylinderBufferGeometry( 1, 1, 1, 8, 1, false, 0, Math.PI * 2 );
  67. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  68. mesh.name = 'Cylinder';
  69. editor.execute( new AddObjectCommand( mesh ) );
  70. } );
  71. options.add( option );
  72. // Sphere
  73. var option = new UI.Row();
  74. option.setClass( 'option' );
  75. option.setTextContent( strings.getKey( 'menubar/add/sphere' ) );
  76. option.onClick( function () {
  77. var geometry = new THREE.SphereBufferGeometry( 1, 8, 6, 0, Math.PI * 2, 0, Math.PI );
  78. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  79. mesh.name = 'Sphere';
  80. editor.execute( new AddObjectCommand( mesh ) );
  81. } );
  82. options.add( option );
  83. // Icosahedron
  84. var option = new UI.Row();
  85. option.setClass( 'option' );
  86. option.setTextContent( strings.getKey( 'menubar/add/icosahedron' ) );
  87. option.onClick( function () {
  88. var geometry = new THREE.IcosahedronBufferGeometry( 1, 0 );
  89. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  90. mesh.name = 'Icosahedron';
  91. editor.execute( new AddObjectCommand( mesh ) );
  92. } );
  93. options.add( option );
  94. // Octahedron
  95. var option = new UI.Row();
  96. option.setClass( 'option' );
  97. option.setTextContent( strings.getKey( 'menubar/add/octahedron' ) );
  98. option.onClick( function () {
  99. var geometry = new THREE.OctahedronBufferGeometry( 1, 0 );
  100. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  101. mesh.name = 'Octahedron';
  102. editor.execute( new AddObjectCommand( mesh ) );
  103. } );
  104. options.add( option );
  105. // Tetrahedron
  106. var option = new UI.Row();
  107. option.setClass( 'option' );
  108. option.setTextContent( strings.getKey( 'menubar/add/tetrahedron' ) );
  109. option.onClick( function () {
  110. var geometry = new THREE.TetrahedronBufferGeometry( 1, 0 );
  111. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  112. mesh.name = 'Tetrahedron';
  113. editor.execute( new AddObjectCommand( mesh ) );
  114. } );
  115. options.add( option );
  116. // Torus
  117. var option = new UI.Row();
  118. option.setClass( 'option' );
  119. option.setTextContent( strings.getKey( 'menubar/add/torus' ) );
  120. option.onClick( function () {
  121. var geometry = new THREE.TorusBufferGeometry( 1, 0.4, 8, 6, Math.PI * 2 );
  122. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  123. mesh.name = 'Torus';
  124. editor.execute( new AddObjectCommand( mesh ) );
  125. } );
  126. options.add( option );
  127. // TorusKnot
  128. var option = new UI.Row();
  129. option.setClass( 'option' );
  130. option.setTextContent( strings.getKey( 'menubar/add/torusknot' ) );
  131. option.onClick( function () {
  132. var geometry = new THREE.TorusKnotBufferGeometry( 1, 0.4, 64, 8, 2, 3 );
  133. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  134. mesh.name = 'TorusKnot';
  135. editor.execute( new AddObjectCommand( mesh ) );
  136. } );
  137. options.add( option );
  138. // Tube
  139. var option = new UI.Row();
  140. option.setClass( 'option' );
  141. option.setTextContent( strings.getKey( 'menubar/add/tube' ) );
  142. option.onClick( function () {
  143. var path = new THREE.CatmullRomCurve3( [
  144. new THREE.Vector3( 2, 2, - 2 ),
  145. new THREE.Vector3( 2, - 2, - 0.6666666666666667 ),
  146. new THREE.Vector3( - 2, - 2, 0.6666666666666667 ),
  147. new THREE.Vector3( - 2, 2, 2 )
  148. ] );
  149. var geometry = new THREE.TubeBufferGeometry( path, 64, 1, 8, false );
  150. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
  151. mesh.name = 'Tube';
  152. editor.execute( new AddObjectCommand( mesh ) );
  153. } );
  154. options.add( option );
  155. /*
  156. // Teapot
  157. var option = new UI.Row();
  158. option.setClass( 'option' );
  159. option.setTextContent( 'Teapot' );
  160. option.onClick( function () {
  161. var size = 50;
  162. var segments = 10;
  163. var bottom = true;
  164. var lid = true;
  165. var body = true;
  166. var fitLid = false;
  167. var blinnScale = true;
  168. var material = new THREE.MeshStandardMaterial();
  169. var geometry = new THREE.TeapotBufferGeometry( size, segments, bottom, lid, body, fitLid, blinnScale );
  170. var mesh = new THREE.Mesh( geometry, material );
  171. mesh.name = 'Teapot';
  172. editor.addObject( mesh );
  173. editor.select( mesh );
  174. } );
  175. options.add( option );
  176. */
  177. // Lathe
  178. var option = new UI.Row();
  179. option.setClass( 'option' );
  180. option.setTextContent( strings.getKey( 'menubar/add/lathe' ) );
  181. option.onClick( function () {
  182. var points = [
  183. new THREE.Vector2( 0, 0 ),
  184. new THREE.Vector2( 0.4, 0 ),
  185. new THREE.Vector2( 0.35, 0.05 ),
  186. new THREE.Vector2( 0.1, 0.075 ),
  187. new THREE.Vector2( 0.08, 0.1 ),
  188. new THREE.Vector2( 0.08, 0.4 ),
  189. new THREE.Vector2( 0.1, 0.42 ),
  190. new THREE.Vector2( 0.14, 0.48 ),
  191. new THREE.Vector2( 0.2, 0.5 ),
  192. new THREE.Vector2( 0.25, 0.54 ),
  193. new THREE.Vector2( 0.3, 1.2 )
  194. ];
  195. var geometry = new THREE.LatheBufferGeometry( points, 12, 0, Math.PI * 2 );
  196. var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
  197. mesh.name = 'Lathe';
  198. editor.execute( new AddObjectCommand( mesh ) );
  199. } );
  200. options.add( option );
  201. // Sprite
  202. var option = new UI.Row();
  203. option.setClass( 'option' );
  204. option.setTextContent( strings.getKey( 'menubar/add/sprite' ) );
  205. option.onClick( function () {
  206. var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
  207. sprite.name = 'Sprite';
  208. editor.execute( new AddObjectCommand( sprite ) );
  209. } );
  210. options.add( option );
  211. //
  212. options.add( new UI.HorizontalRule() );
  213. // PointLight
  214. var option = new UI.Row();
  215. option.setClass( 'option' );
  216. option.setTextContent( strings.getKey( 'menubar/add/pointlight' ) );
  217. option.onClick( function () {
  218. var color = 0xffffff;
  219. var intensity = 1;
  220. var distance = 0;
  221. var light = new THREE.PointLight( color, intensity, distance );
  222. light.name = 'PointLight';
  223. editor.execute( new AddObjectCommand( light ) );
  224. } );
  225. options.add( option );
  226. // SpotLight
  227. var option = new UI.Row();
  228. option.setClass( 'option' );
  229. option.setTextContent( strings.getKey( 'menubar/add/spotlight' ) );
  230. option.onClick( function () {
  231. var color = 0xffffff;
  232. var intensity = 1;
  233. var distance = 0;
  234. var angle = Math.PI * 0.1;
  235. var penumbra = 0;
  236. var light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
  237. light.name = 'SpotLight';
  238. light.target.name = 'SpotLight Target';
  239. light.position.set( 5, 10, 7.5 );
  240. editor.execute( new AddObjectCommand( light ) );
  241. } );
  242. options.add( option );
  243. // DirectionalLight
  244. var option = new UI.Row();
  245. option.setClass( 'option' );
  246. option.setTextContent( strings.getKey( 'menubar/add/directionallight' ) );
  247. option.onClick( function () {
  248. var color = 0xffffff;
  249. var intensity = 1;
  250. var light = new THREE.DirectionalLight( color, intensity );
  251. light.name = 'DirectionalLight';
  252. light.target.name = 'DirectionalLight Target';
  253. light.position.set( 5, 10, 7.5 );
  254. editor.execute( new AddObjectCommand( light ) );
  255. } );
  256. options.add( option );
  257. // HemisphereLight
  258. var option = new UI.Row();
  259. option.setClass( 'option' );
  260. option.setTextContent( strings.getKey( 'menubar/add/hemispherelight' ) );
  261. option.onClick( function () {
  262. var skyColor = 0x00aaff;
  263. var groundColor = 0xffaa00;
  264. var intensity = 1;
  265. var light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
  266. light.name = 'HemisphereLight';
  267. light.position.set( 0, 10, 0 );
  268. editor.execute( new AddObjectCommand( light ) );
  269. } );
  270. options.add( option );
  271. // AmbientLight
  272. var option = new UI.Row();
  273. option.setClass( 'option' );
  274. option.setTextContent( strings.getKey( 'menubar/add/ambientlight' ) );
  275. option.onClick( function () {
  276. var color = 0x222222;
  277. var light = new THREE.AmbientLight( color );
  278. light.name = 'AmbientLight';
  279. editor.execute( new AddObjectCommand( light ) );
  280. } );
  281. options.add( option );
  282. //
  283. options.add( new UI.HorizontalRule() );
  284. // PerspectiveCamera
  285. var option = new UI.Row();
  286. option.setClass( 'option' );
  287. option.setTextContent( strings.getKey( 'menubar/add/perspectivecamera' ) );
  288. option.onClick( function () {
  289. var camera = new THREE.PerspectiveCamera();
  290. camera.name = 'PerspectiveCamera';
  291. editor.execute( new AddObjectCommand( camera ) );
  292. } );
  293. options.add( option );
  294. return container;
  295. };