Editor.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437
  1. var Editor = function () {
  2. var SIGNALS = signals;
  3. this.signals = {
  4. // actions
  5. playAnimations: new SIGNALS.Signal(),
  6. // notifications
  7. themeChanged: new SIGNALS.Signal(),
  8. transformModeChanged: new SIGNALS.Signal(),
  9. snapChanged: new SIGNALS.Signal(),
  10. spaceChanged: new SIGNALS.Signal(),
  11. rendererChanged: new SIGNALS.Signal(),
  12. sceneGraphChanged: new SIGNALS.Signal(),
  13. cameraChanged: new SIGNALS.Signal(),
  14. objectSelected: new SIGNALS.Signal(),
  15. objectAdded: new SIGNALS.Signal(),
  16. objectChanged: new SIGNALS.Signal(),
  17. objectRemoved: new SIGNALS.Signal(),
  18. helperAdded: new SIGNALS.Signal(),
  19. helperRemoved: new SIGNALS.Signal(),
  20. materialChanged: new SIGNALS.Signal(),
  21. fogTypeChanged: new SIGNALS.Signal(),
  22. fogColorChanged: new SIGNALS.Signal(),
  23. fogParametersChanged: new SIGNALS.Signal(),
  24. windowResize: new SIGNALS.Signal()
  25. };
  26. this.config = new Config();
  27. this.storage = new Storage();
  28. this.loader = new Loader( this );
  29. this.scene = new THREE.Scene();
  30. this.sceneHelpers = new THREE.Scene();
  31. this.object = {};
  32. this.geometries = {};
  33. this.materials = {};
  34. this.textures = {};
  35. this.selected = null;
  36. this.helpers = {};
  37. };
  38. Editor.prototype = {
  39. setTheme: function ( value ) {
  40. document.getElementById( 'theme' ).href = value;
  41. this.signals.themeChanged.dispatch( value );
  42. },
  43. setScene: function ( scene ) {
  44. this.scene.name = scene.name;
  45. this.scene.userData = JSON.parse( JSON.stringify( scene.userData ) );
  46. // avoid render per object
  47. this.signals.sceneGraphChanged.active = false;
  48. while ( scene.children.length > 0 ) {
  49. this.addObject( scene.children[ 0 ] );
  50. }
  51. this.signals.sceneGraphChanged.active = true;
  52. this.signals.sceneGraphChanged.dispatch();
  53. },
  54. //
  55. addObject: function ( object ) {
  56. var scope = this;
  57. object.traverse( function ( child ) {
  58. if ( child.geometry !== undefined ) scope.addGeometry( child.geometry );
  59. if ( child.material !== undefined ) scope.addMaterial( child.material );
  60. scope.addHelper( child );
  61. } );
  62. this.scene.add( object );
  63. this.signals.objectAdded.dispatch( object );
  64. this.signals.sceneGraphChanged.dispatch();
  65. },
  66. setObjectName: function ( object, name ) {
  67. object.name = name;
  68. this.signals.sceneGraphChanged.dispatch();
  69. },
  70. removeObject: function ( object ) {
  71. if ( object.parent === undefined ) return; // avoid deleting the camera or scene
  72. if ( confirm( 'Delete ' + object.name + '?' ) === false ) return;
  73. var scope = this;
  74. object.traverse( function ( child ) {
  75. scope.removeHelper( child );
  76. } );
  77. object.parent.remove( object );
  78. this.signals.objectRemoved.dispatch( object );
  79. this.signals.sceneGraphChanged.dispatch();
  80. },
  81. addGeometry: function ( geometry ) {
  82. this.geometries[ geometry.uuid ] = geometry;
  83. },
  84. setGeometryName: function ( geometry, name ) {
  85. geometry.name = name;
  86. this.signals.sceneGraphChanged.dispatch();
  87. },
  88. addMaterial: function ( material ) {
  89. this.materials[ material.uuid ] = material;
  90. },
  91. setMaterialName: function ( material, name ) {
  92. material.name = name;
  93. this.signals.sceneGraphChanged.dispatch();
  94. },
  95. addTexture: function ( texture ) {
  96. this.textures[ texture.uuid ] = texture;
  97. },
  98. //
  99. addHelper: function () {
  100. var geometry = new THREE.SphereGeometry( 20, 4, 2 );
  101. var material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
  102. return function ( object ) {
  103. if ( object instanceof THREE.Camera ) {
  104. var picker = new THREE.Mesh( geometry, material );
  105. picker.name = 'picker';
  106. picker.userData.object = object;
  107. picker.visible = false;
  108. var helper = new THREE.CameraHelper( object, 10 );
  109. helper.add( picker );
  110. this.sceneHelpers.add( helper );
  111. this.helpers[ object.id ] = helper;
  112. this.signals.helperAdded.dispatch( helper );
  113. } else if ( object instanceof THREE.PointLight ) {
  114. var picker = new THREE.Mesh( geometry, material );
  115. picker.name = 'picker';
  116. picker.userData.object = object;
  117. picker.visible = false;
  118. var helper = new THREE.PointLightHelper( object, 10 );
  119. helper.add( picker );
  120. this.sceneHelpers.add( helper );
  121. this.helpers[ object.id ] = helper;
  122. this.signals.helperAdded.dispatch( helper );
  123. } else if ( object instanceof THREE.DirectionalLight ) {
  124. var picker = new THREE.Mesh( geometry, material );
  125. picker.name = 'picker';
  126. picker.userData.object = object;
  127. picker.visible = false;
  128. var helper = new THREE.DirectionalLightHelper( object, 20 );
  129. helper.add( picker );
  130. this.sceneHelpers.add( helper );
  131. this.helpers[ object.id ] = helper;
  132. this.signals.helperAdded.dispatch( helper );
  133. } else if ( object instanceof THREE.SpotLight ) {
  134. var picker = new THREE.Mesh( geometry, material );
  135. picker.name = 'picker';
  136. picker.userData.object = object;
  137. picker.visible = false;
  138. var helper = new THREE.SpotLightHelper( object, 10 );
  139. helper.add( picker );
  140. this.sceneHelpers.add( helper );
  141. this.helpers[ object.id ] = helper;
  142. this.signals.helperAdded.dispatch( helper );
  143. } else if ( object instanceof THREE.HemisphereLight ) {
  144. var picker = new THREE.Mesh( geometry, material );
  145. picker.name = 'picker';
  146. picker.userData.object = object;
  147. picker.visible = false;
  148. var helper = new THREE.HemisphereLightHelper( object, 10 );
  149. helper.add( picker );
  150. this.sceneHelpers.add( helper );
  151. this.helpers[ object.id ] = helper;
  152. this.signals.helperAdded.dispatch( helper );
  153. }
  154. };
  155. }(),
  156. removeHelper: function ( object ) {
  157. if ( this.helpers[ object.id ] !== undefined ) {
  158. var helper = this.helpers[ object.id ];
  159. helper.parent.remove( helper );
  160. delete this.helpers[ object.id ];
  161. this.signals.helperRemoved.dispatch( helper );
  162. }
  163. },
  164. //
  165. parent: function ( object, parent ) {
  166. if ( parent === undefined ) {
  167. parent = this.scene;
  168. }
  169. parent.add( object );
  170. this.signals.sceneGraphChanged.dispatch();
  171. },
  172. //
  173. select: function ( object ) {
  174. this.selected = object;
  175. if ( object !== null ) {
  176. this.config.setKey( 'selected', object.uuid );
  177. } else {
  178. this.config.setKey( 'selected', null );
  179. }
  180. this.signals.objectSelected.dispatch( object );
  181. },
  182. selectById: function ( id ) {
  183. var scope = this;
  184. this.scene.traverse( function ( child ) {
  185. if ( child.id === id ) {
  186. scope.select( child );
  187. }
  188. } );
  189. },
  190. selectByUuid: function ( uuid ) {
  191. var scope = this;
  192. this.scene.traverse( function ( child ) {
  193. if ( child.uuid === uuid ) {
  194. scope.select( child );
  195. }
  196. } );
  197. },
  198. deselect: function () {
  199. this.select( null );
  200. },
  201. // utils
  202. getObjectType: function ( object ) {
  203. var types = {
  204. 'Scene': THREE.Scene,
  205. 'PerspectiveCamera': THREE.PerspectiveCamera,
  206. 'AmbientLight': THREE.AmbientLight,
  207. 'DirectionalLight': THREE.DirectionalLight,
  208. 'HemisphereLight': THREE.HemisphereLight,
  209. 'PointLight': THREE.PointLight,
  210. 'SpotLight': THREE.SpotLight,
  211. 'Mesh': THREE.Mesh,
  212. 'Sprite': THREE.Sprite,
  213. 'Object3D': THREE.Object3D
  214. };
  215. for ( var type in types ) {
  216. if ( object instanceof types[ type ] ) return type;
  217. }
  218. },
  219. getGeometryType: function ( geometry ) {
  220. var types = {
  221. 'CircleGeometry': THREE.CircleGeometry,
  222. 'CubeGeometry': THREE.CubeGeometry,
  223. 'CylinderGeometry': THREE.CylinderGeometry,
  224. 'ExtrudeGeometry': THREE.ExtrudeGeometry,
  225. 'IcosahedronGeometry': THREE.IcosahedronGeometry,
  226. 'LatheGeometry': THREE.LatheGeometry,
  227. 'OctahedronGeometry': THREE.OctahedronGeometry,
  228. 'ParametricGeometry': THREE.ParametricGeometry,
  229. 'PlaneGeometry': THREE.PlaneGeometry,
  230. 'PolyhedronGeometry': THREE.PolyhedronGeometry,
  231. 'ShapeGeometry': THREE.ShapeGeometry,
  232. 'SphereGeometry': THREE.SphereGeometry,
  233. 'TetrahedronGeometry': THREE.TetrahedronGeometry,
  234. 'TextGeometry': THREE.TextGeometry,
  235. 'TorusGeometry': THREE.TorusGeometry,
  236. 'TorusKnotGeometry': THREE.TorusKnotGeometry,
  237. 'TubeGeometry': THREE.TubeGeometry,
  238. 'Geometry': THREE.Geometry,
  239. 'BufferGeometry': THREE.BufferGeometry
  240. };
  241. for ( var type in types ) {
  242. if ( geometry instanceof types[ type ] ) return type;
  243. }
  244. },
  245. getMaterialType: function ( material ) {
  246. var types = {
  247. 'LineBasicMaterial': THREE.LineBasicMaterial,
  248. 'LineDashedMaterial': THREE.LineDashedMaterial,
  249. 'MeshBasicMaterial': THREE.MeshBasicMaterial,
  250. 'MeshDepthMaterial': THREE.MeshDepthMaterial,
  251. 'MeshFaceMaterial': THREE.MeshFaceMaterial,
  252. 'MeshLambertMaterial': THREE.MeshLambertMaterial,
  253. 'MeshNormalMaterial': THREE.MeshNormalMaterial,
  254. 'MeshPhongMaterial': THREE.MeshPhongMaterial,
  255. 'ParticleSystemMaterial': THREE.ParticleSystemMaterial,
  256. 'ShaderMaterial': THREE.ShaderMaterial,
  257. 'SpriteCanvasMaterial': THREE.SpriteCanvasMaterial,
  258. 'SpriteMaterial': THREE.SpriteMaterial,
  259. 'Material': THREE.Material
  260. };
  261. for ( var type in types ) {
  262. if ( material instanceof types[ type ] ) return type;
  263. }
  264. }
  265. }