Editor.js 9.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. var Editor = function () {
  5. this.DEFAULT_CAMERA = new THREE.PerspectiveCamera( 50, 1, 0.01, 1000 );
  6. this.DEFAULT_CAMERA.name = 'Camera';
  7. this.DEFAULT_CAMERA.position.set( 0, 5, 10 );
  8. this.DEFAULT_CAMERA.lookAt( new THREE.Vector3() );
  9. var Signal = signals.Signal;
  10. this.signals = {
  11. // script
  12. editScript: new Signal(),
  13. // player
  14. startPlayer: new Signal(),
  15. stopPlayer: new Signal(),
  16. // actions
  17. showModal: new Signal(),
  18. // notifications
  19. editorCleared: new Signal(),
  20. savingStarted: new Signal(),
  21. savingFinished: new Signal(),
  22. themeChanged: new Signal(),
  23. transformModeChanged: new Signal(),
  24. snapChanged: new Signal(),
  25. spaceChanged: new Signal(),
  26. rendererChanged: new Signal(),
  27. sceneBackgroundChanged: new Signal(),
  28. sceneFogChanged: new Signal(),
  29. sceneGraphChanged: new Signal(),
  30. cameraChanged: new Signal(),
  31. geometryChanged: new Signal(),
  32. objectSelected: new Signal(),
  33. objectFocused: new Signal(),
  34. objectAdded: new Signal(),
  35. objectChanged: new Signal(),
  36. objectRemoved: new Signal(),
  37. helperAdded: new Signal(),
  38. helperRemoved: new Signal(),
  39. materialChanged: new Signal(),
  40. scriptAdded: new Signal(),
  41. scriptChanged: new Signal(),
  42. scriptRemoved: new Signal(),
  43. windowResize: new Signal(),
  44. showGridChanged: new Signal(),
  45. refreshSidebarObject3D: new Signal(),
  46. historyChanged: new Signal()
  47. };
  48. this.config = new Config();
  49. this.history = new History( this );
  50. this.storage = new Storage();
  51. this.strings = new Strings( this.config );
  52. this.loader = new Loader( this );
  53. this.camera = this.DEFAULT_CAMERA.clone();
  54. this.scene = new THREE.Scene();
  55. this.scene.name = 'Scene';
  56. this.scene.background = new THREE.Color( 0xaaaaaa );
  57. this.sceneHelpers = new THREE.Scene();
  58. this.object = {};
  59. this.geometries = {};
  60. this.materials = {};
  61. this.textures = {};
  62. this.scripts = {};
  63. this.animations = {};
  64. this.selected = null;
  65. this.helpers = {};
  66. };
  67. Editor.prototype = {
  68. setTheme: function ( value ) {
  69. document.getElementById( 'theme' ).href = value;
  70. this.signals.themeChanged.dispatch( value );
  71. },
  72. //
  73. setScene: function ( scene ) {
  74. this.scene.uuid = scene.uuid;
  75. this.scene.name = scene.name;
  76. if ( scene.background !== null ) this.scene.background = scene.background.clone();
  77. if ( scene.fog !== null ) this.scene.fog = scene.fog.clone();
  78. this.scene.userData = JSON.parse( JSON.stringify( scene.userData ) );
  79. // avoid render per object
  80. this.signals.sceneGraphChanged.active = false;
  81. while ( scene.children.length > 0 ) {
  82. this.addObject( scene.children[ 0 ] );
  83. }
  84. this.signals.sceneGraphChanged.active = true;
  85. this.signals.sceneGraphChanged.dispatch();
  86. },
  87. //
  88. addObject: function ( object ) {
  89. var scope = this;
  90. object.traverse( function ( child ) {
  91. if ( child.geometry !== undefined ) scope.addGeometry( child.geometry );
  92. if ( child.material !== undefined ) scope.addMaterial( child.material );
  93. scope.addHelper( child );
  94. } );
  95. this.scene.add( object );
  96. this.signals.objectAdded.dispatch( object );
  97. this.signals.sceneGraphChanged.dispatch();
  98. },
  99. moveObject: function ( object, parent, before ) {
  100. if ( parent === undefined ) {
  101. parent = this.scene;
  102. }
  103. parent.add( object );
  104. // sort children array
  105. if ( before !== undefined ) {
  106. var index = parent.children.indexOf( before );
  107. parent.children.splice( index, 0, object );
  108. parent.children.pop();
  109. }
  110. this.signals.sceneGraphChanged.dispatch();
  111. },
  112. nameObject: function ( object, name ) {
  113. object.name = name;
  114. this.signals.sceneGraphChanged.dispatch();
  115. },
  116. removeObject: function ( object ) {
  117. if ( object.parent === null ) return; // avoid deleting the camera or scene
  118. var scope = this;
  119. object.traverse( function ( child ) {
  120. scope.removeHelper( child );
  121. } );
  122. object.parent.remove( object );
  123. this.signals.objectRemoved.dispatch( object );
  124. this.signals.sceneGraphChanged.dispatch();
  125. },
  126. addGeometry: function ( geometry ) {
  127. this.geometries[ geometry.uuid ] = geometry;
  128. },
  129. setGeometryName: function ( geometry, name ) {
  130. geometry.name = name;
  131. this.signals.sceneGraphChanged.dispatch();
  132. },
  133. addMaterial: function ( material ) {
  134. this.materials[ material.uuid ] = material;
  135. },
  136. setMaterialName: function ( material, name ) {
  137. material.name = name;
  138. this.signals.sceneGraphChanged.dispatch();
  139. },
  140. addTexture: function ( texture ) {
  141. this.textures[ texture.uuid ] = texture;
  142. },
  143. addAnimation: function ( result ) {
  144. this.animations[ result.scene.uuid ] = result.animations;
  145. },
  146. //
  147. addHelper: function () {
  148. var geometry = new THREE.SphereBufferGeometry( 2, 4, 2 );
  149. var material = new THREE.MeshBasicMaterial( { color: 0xff0000, visible: false } );
  150. return function ( object ) {
  151. var helper;
  152. if ( object instanceof THREE.Camera ) {
  153. helper = new THREE.CameraHelper( object, 1 );
  154. } else if ( object instanceof THREE.PointLight ) {
  155. helper = new THREE.PointLightHelper( object, 1 );
  156. } else if ( object instanceof THREE.DirectionalLight ) {
  157. helper = new THREE.DirectionalLightHelper( object, 1 );
  158. } else if ( object instanceof THREE.SpotLight ) {
  159. helper = new THREE.SpotLightHelper( object, 1 );
  160. } else if ( object instanceof THREE.HemisphereLight ) {
  161. helper = new THREE.HemisphereLightHelper( object, 1 );
  162. } else if ( object instanceof THREE.SkinnedMesh ) {
  163. helper = new THREE.SkeletonHelper( object );
  164. } else {
  165. // no helper for this object type
  166. return;
  167. }
  168. var picker = new THREE.Mesh( geometry, material );
  169. picker.name = 'picker';
  170. picker.userData.object = object;
  171. helper.add( picker );
  172. this.sceneHelpers.add( helper );
  173. this.helpers[ object.id ] = helper;
  174. this.signals.helperAdded.dispatch( helper );
  175. };
  176. }(),
  177. removeHelper: function ( object ) {
  178. if ( this.helpers[ object.id ] !== undefined ) {
  179. var helper = this.helpers[ object.id ];
  180. helper.parent.remove( helper );
  181. delete this.helpers[ object.id ];
  182. this.signals.helperRemoved.dispatch( helper );
  183. }
  184. },
  185. //
  186. addScript: function ( object, script ) {
  187. if ( this.scripts[ object.uuid ] === undefined ) {
  188. this.scripts[ object.uuid ] = [];
  189. }
  190. this.scripts[ object.uuid ].push( script );
  191. this.signals.scriptAdded.dispatch( script );
  192. },
  193. removeScript: function ( object, script ) {
  194. if ( this.scripts[ object.uuid ] === undefined ) return;
  195. var index = this.scripts[ object.uuid ].indexOf( script );
  196. if ( index !== - 1 ) {
  197. this.scripts[ object.uuid ].splice( index, 1 );
  198. }
  199. this.signals.scriptRemoved.dispatch( script );
  200. },
  201. getObjectMaterial: function ( object, slot ) {
  202. var material = object.material;
  203. if ( Array.isArray( material ) ) {
  204. material = material[ slot ];
  205. }
  206. return material;
  207. },
  208. setObjectMaterial: function ( object, slot, newMaterial ) {
  209. if ( Array.isArray( object.material ) ) {
  210. object.material[ slot ] = newMaterial;
  211. } else {
  212. object.material = newMaterial;
  213. }
  214. },
  215. //
  216. select: function ( object ) {
  217. if ( this.selected === object ) return;
  218. var uuid = null;
  219. if ( object !== null ) {
  220. uuid = object.uuid;
  221. }
  222. this.selected = object;
  223. this.config.setKey( 'selected', uuid );
  224. this.signals.objectSelected.dispatch( object );
  225. },
  226. selectById: function ( id ) {
  227. if ( id === this.camera.id ) {
  228. this.select( this.camera );
  229. return;
  230. }
  231. this.select( this.scene.getObjectById( id, true ) );
  232. },
  233. selectByUuid: function ( uuid ) {
  234. var scope = this;
  235. this.scene.traverse( function ( child ) {
  236. if ( child.uuid === uuid ) {
  237. scope.select( child );
  238. }
  239. } );
  240. },
  241. deselect: function () {
  242. this.select( null );
  243. },
  244. focus: function ( object ) {
  245. this.signals.objectFocused.dispatch( object );
  246. },
  247. focusById: function ( id ) {
  248. this.focus( this.scene.getObjectById( id, true ) );
  249. },
  250. clear: function () {
  251. this.history.clear();
  252. this.storage.clear();
  253. this.camera.copy( this.DEFAULT_CAMERA );
  254. this.scene.background.setHex( 0xaaaaaa );
  255. this.scene.fog = null;
  256. var objects = this.scene.children;
  257. while ( objects.length > 0 ) {
  258. this.removeObject( objects[ 0 ] );
  259. }
  260. this.geometries = {};
  261. this.materials = {};
  262. this.textures = {};
  263. this.scripts = {};
  264. this.deselect();
  265. this.signals.editorCleared.dispatch();
  266. },
  267. //
  268. fromJSON: function ( json ) {
  269. var loader = new THREE.ObjectLoader();
  270. // backwards
  271. if ( json.scene === undefined ) {
  272. this.setScene( loader.parse( json ) );
  273. return;
  274. }
  275. var camera = loader.parse( json.camera );
  276. this.camera.copy( camera );
  277. this.camera.aspect = this.DEFAULT_CAMERA.aspect;
  278. this.camera.updateProjectionMatrix();
  279. this.history.fromJSON( json.history );
  280. this.scripts = json.scripts;
  281. this.setScene( loader.parse( json.scene ) );
  282. },
  283. toJSON: function () {
  284. // scripts clean up
  285. var scene = this.scene;
  286. var scripts = this.scripts;
  287. for ( var key in scripts ) {
  288. var script = scripts[ key ];
  289. if ( script.length === 0 || scene.getObjectByProperty( 'uuid', key ) === undefined ) {
  290. delete scripts[ key ];
  291. }
  292. }
  293. //
  294. return {
  295. metadata: {},
  296. project: {
  297. gammaInput: this.config.getKey( 'project/renderer/gammaInput' ),
  298. gammaOutput: this.config.getKey( 'project/renderer/gammaOutput' ),
  299. shadows: this.config.getKey( 'project/renderer/shadows' ),
  300. vr: this.config.getKey( 'project/vr' )
  301. },
  302. camera: this.camera.toJSON(),
  303. scene: this.scene.toJSON(),
  304. scripts: this.scripts,
  305. history: this.history.toJSON()
  306. };
  307. },
  308. objectByUuid: function ( uuid ) {
  309. return this.scene.getObjectByProperty( 'uuid', uuid, true );
  310. },
  311. execute: function ( cmd, optionalName ) {
  312. this.history.execute( cmd, optionalName );
  313. },
  314. undo: function () {
  315. this.history.undo();
  316. },
  317. redo: function () {
  318. this.history.redo();
  319. }
  320. };