Loader.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382
  1. var Loader = function ( editor ) {
  2. var scope = this;
  3. var signals = editor.signals;
  4. document.addEventListener( 'dragover', function ( event ) {
  5. event.preventDefault();
  6. event.dataTransfer.dropEffect = 'copy';
  7. }, false );
  8. document.addEventListener( 'drop', function ( event ) {
  9. event.preventDefault();
  10. var file = event.dataTransfer.files[ 0 ];
  11. var chunks = file.name.split( '.' );
  12. var extension = chunks.pop().toLowerCase();
  13. var filename = chunks.join( '.' );
  14. scope.parseFile( file, filename, extension );
  15. }, false );
  16. this.loadLocalStorage = function () {
  17. if ( localStorage.threejsEditor !== undefined ) {
  18. var loader = new THREE.ObjectLoader();
  19. var scene = loader.parse( JSON.parse( localStorage.threejsEditor ) );
  20. editor.setScene( scene );
  21. }
  22. };
  23. var timeout;
  24. this.saveLocalStorage = function ( scene ) {
  25. clearTimeout( timeout );
  26. timeout = setTimeout( function () {
  27. var exporter = new THREE.ObjectExporter();
  28. localStorage.threejsEditor = JSON.stringify( exporter.parse( editor.scene ) );
  29. console.log( 'Saved state to Local Storage' );
  30. }, 3000 );
  31. };
  32. signals.objectAdded.add( this.saveLocalStorage );
  33. signals.objectChanged.add( this.saveLocalStorage );
  34. signals.objectRemoved.add( this.saveLocalStorage );
  35. this.parseFile = function ( file, filename, extension ) {
  36. switch ( extension ) {
  37. case 'ctm':
  38. var reader = new FileReader();
  39. reader.addEventListener( 'load', function ( event ) {
  40. var contents = event.target.result;
  41. var stream = new CTM.Stream( contents );
  42. stream.offset = 0;
  43. var loader = new THREE.CTMLoader();
  44. loader.createModelClassic( new CTM.File( stream ), function( geometry ) {
  45. geometry.sourceType = "ctm";
  46. geometry.sourceFile = file.name;
  47. var material = new THREE.MeshPhongMaterial();
  48. var mesh = new THREE.Mesh( geometry, material );
  49. mesh.name = filename;
  50. editor.addObject( mesh );
  51. } );
  52. }, false );
  53. reader.readAsBinaryString( file );
  54. break;
  55. case 'dae':
  56. var reader = new FileReader();
  57. reader.addEventListener( 'load', function ( event ) {
  58. var contents = event.target.result;
  59. var parser = new DOMParser();
  60. var xml = parser.parseFromString( contents, 'text/xml' );
  61. var loader = new THREE.ColladaLoader();
  62. loader.parse( xml, function ( collada ) {
  63. collada.scene.name = filename;
  64. editor.addObject( collada.scene );
  65. } );
  66. }, false );
  67. reader.readAsText( file );
  68. break;
  69. case 'js':
  70. case 'json':
  71. case '3geo':
  72. case '3mat':
  73. case '3obj':
  74. case '3scn':
  75. var reader = new FileReader();
  76. reader.addEventListener( 'load', function ( event ) {
  77. var contents = event.target.result;
  78. // 2.0
  79. if ( contents.indexOf( 'postMessage' ) !== -1 ) {
  80. var blob = new Blob( [ contents ], { type: 'text/javascript' } );
  81. var url = URL.createObjectURL( blob );
  82. var worker = new Worker( url );
  83. worker.onmessage = function ( event ) {
  84. event.data.metadata = { version: 2 };
  85. handleJSON( event.data, file, filename );
  86. };
  87. worker.postMessage( Date.now() );
  88. return;
  89. }
  90. // >= 3.0
  91. var data;
  92. try {
  93. data = JSON.parse( contents );
  94. } catch ( error ) {
  95. alert( error );
  96. return;
  97. }
  98. handleJSON( data, file, filename );
  99. }, false );
  100. reader.readAsText( file );
  101. break;
  102. case 'obj':
  103. var reader = new FileReader();
  104. reader.addEventListener( 'load', function ( event ) {
  105. var contents = event.target.result;
  106. var object = new THREE.OBJLoader().parse( contents );
  107. object.name = filename;
  108. editor.addObject( object );
  109. }, false );
  110. reader.readAsText( file );
  111. break;
  112. case 'ply':
  113. var reader = new FileReader();
  114. reader.addEventListener( 'load', function ( event ) {
  115. var contents = event.target.result;
  116. console.log( contents );
  117. var geometry = new THREE.PLYLoader().parse( contents );
  118. geometry.sourceType = "ply";
  119. geometry.sourceFile = file.name;
  120. var material = new THREE.MeshPhongMaterial();
  121. var mesh = new THREE.Mesh( geometry, material );
  122. mesh.name = filename;
  123. editor.addObject( mesh );
  124. }, false );
  125. reader.readAsText( file );
  126. break;
  127. case 'stl':
  128. var reader = new FileReader();
  129. reader.addEventListener( 'load', function ( event ) {
  130. var contents = event.target.result;
  131. var geometry = new THREE.STLLoader().parse( contents );
  132. geometry.sourceType = "stl";
  133. geometry.sourceFile = file.name;
  134. var material = new THREE.MeshPhongMaterial();
  135. var mesh = new THREE.Mesh( geometry, material );
  136. mesh.name = filename;
  137. editor.addObject( mesh );
  138. }, false );
  139. if ( reader.readAsBinaryString !== undefined ) {
  140. reader.readAsBinaryString( file );
  141. } else {
  142. reader.readAsArrayBuffer( file );
  143. }
  144. break;
  145. /*
  146. case 'utf8':
  147. var reader = new FileReader();
  148. reader.addEventListener( 'load', function ( event ) {
  149. var contents = event.target.result;
  150. var geometry = new THREE.UTF8Loader().parse( contents );
  151. var material = new THREE.MeshLambertMaterial();
  152. var mesh = new THREE.Mesh( geometry, material );
  153. editor.addObject( mesh );
  154. }, false );
  155. reader.readAsBinaryString( file );
  156. break;
  157. */
  158. case 'vtk':
  159. var reader = new FileReader();
  160. reader.addEventListener( 'load', function ( event ) {
  161. var contents = event.target.result;
  162. var geometry = new THREE.VTKLoader().parse( contents );
  163. geometry.sourceType = "vtk";
  164. geometry.sourceFile = file.name;
  165. var material = new THREE.MeshPhongMaterial();
  166. var mesh = new THREE.Mesh( geometry, material );
  167. mesh.name = filename;
  168. editor.addObject( mesh );
  169. }, false );
  170. reader.readAsText( file );
  171. break;
  172. case 'wrl':
  173. var reader = new FileReader();
  174. reader.addEventListener( 'load', function ( event ) {
  175. var contents = event.target.result;
  176. var result = new THREE.VRMLLoader().parse( contents );
  177. editor.setScene( result );
  178. }, false );
  179. reader.readAsText( file );
  180. break;
  181. }
  182. }
  183. var handleJSON = function ( data, file, filename ) {
  184. if ( data.metadata === undefined ) { // 2.0
  185. data.metadata = { type: 'geometry' };
  186. }
  187. if ( data.metadata.type === undefined ) { // 3.0
  188. data.metadata.type = 'geometry';
  189. }
  190. if ( data.metadata.version === undefined ) {
  191. data.metadata.version = data.metadata.formatVersion;
  192. }
  193. if ( data.metadata.type === 'geometry' ) {
  194. var loader = new THREE.JSONLoader();
  195. var result = loader.parse( data );
  196. var geometry = result.geometry;
  197. var material = result.materials !== undefined
  198. ? new THREE.MeshFaceMaterial( result.materials )
  199. : new THREE.MeshPhongMaterial();
  200. geometry.sourceType = "ascii";
  201. geometry.sourceFile = file.name;
  202. var mesh = new THREE.Mesh( geometry, material );
  203. mesh.name = filename;
  204. editor.addObject( mesh );
  205. } else if ( data.metadata.type === 'object' ) {
  206. var loader = new THREE.ObjectLoader();
  207. var result = loader.parse( data );
  208. if ( result instanceof THREE.Scene ) {
  209. editor.setScene( result );
  210. } else {
  211. editor.addObject( result );
  212. }
  213. } else if ( data.metadata.type === 'scene' ) {
  214. // DEPRECATED
  215. var loader = new THREE.SceneLoader();
  216. loader.parse( data, function ( result ) {
  217. editor.setScene( result.scene );
  218. }, '' );
  219. }
  220. };
  221. }