CTMLoader.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477
  1. /**
  2. * Loader for CTM encoded models generated by OpenCTM tools:
  3. * http://openctm.sourceforge.net/
  4. *
  5. * Uses js-openctm library by Juan Mellado
  6. * http://code.google.com/p/js-openctm/
  7. *
  8. * @author alteredq / http://alteredqualia.com/
  9. */
  10. THREE.CTMLoader = function ( showStatus ) {
  11. THREE.Loader.call( this, showStatus );
  12. };
  13. THREE.CTMLoader.prototype = Object.create( THREE.Loader.prototype );
  14. // Load multiple CTM parts defined in JSON
  15. THREE.CTMLoader.prototype.loadParts = function( url, callback, parameters ) {
  16. parameters = parameters || {};
  17. var scope = this;
  18. var xhr = new XMLHttpRequest();
  19. var basePath = parameters.basePath ? parameters.basePath : this.extractUrlBase( url );
  20. xhr.onreadystatechange = function() {
  21. if ( xhr.readyState === 4 ) {
  22. if ( xhr.status === 200 || xhr.status === 0 ) {
  23. var jsonObject = JSON.parse( xhr.responseText );
  24. var materials = [], geometries = [], counter = 0;
  25. function callbackFinal( geometry ) {
  26. counter += 1;
  27. geometries.push( geometry );
  28. if ( counter === jsonObject.offsets.length ) {
  29. callback( geometries, materials );
  30. }
  31. }
  32. // init materials
  33. for ( var i = 0; i < jsonObject.materials.length; i ++ ) {
  34. materials[ i ] = THREE.Loader.prototype.createMaterial( jsonObject.materials[ i ], basePath );
  35. }
  36. // load joined CTM file
  37. var partUrl = basePath + jsonObject.data;
  38. var parametersPart = { useWorker: parameters.useWorker, useBuffers: parameters.useBuffers, offsets: jsonObject.offsets };
  39. scope.load( partUrl, callbackFinal, parametersPart );
  40. }
  41. }
  42. }
  43. xhr.open( "GET", url, true );
  44. xhr.setRequestHeader( "Content-Type", "text/plain" );
  45. xhr.send( null );
  46. };
  47. // Load CTMLoader compressed models
  48. // - parameters
  49. // - url (required)
  50. // - callback (required)
  51. THREE.CTMLoader.prototype.load = function( url, callback, parameters ) {
  52. parameters = parameters || {};
  53. var scope = this;
  54. var offsets = parameters.offsets !== undefined ? parameters.offsets : [ 0 ];
  55. var useBuffers = parameters.useBuffers !== undefined ? parameters.useBuffers : true;
  56. var xhr = new XMLHttpRequest(),
  57. callbackProgress = null;
  58. var length = 0;
  59. xhr.onreadystatechange = function() {
  60. if ( xhr.readyState === 4 ) {
  61. if ( xhr.status === 200 || xhr.status === 0 ) {
  62. var binaryData = new Uint8Array(xhr.response);
  63. var s = Date.now();
  64. if ( parameters.useWorker ) {
  65. var worker = new Worker( "js/loaders/ctm/CTMWorker.js" );
  66. worker.onmessage = function( event ) {
  67. var files = event.data;
  68. for ( var i = 0; i < files.length; i ++ ) {
  69. var ctmFile = files[ i ];
  70. var e1 = Date.now();
  71. // console.log( "CTM data parse time [worker]: " + (e1-s) + " ms" );
  72. if ( useBuffers ) {
  73. scope.createModelBuffers( ctmFile, callback );
  74. } else {
  75. scope.createModelClassic( ctmFile, callback );
  76. }
  77. var e = Date.now();
  78. console.log( "model load time [worker]: " + (e-e1) + " ms, total: " + (e-s));
  79. }
  80. };
  81. worker.postMessage( { "data": binaryData, "offsets": offsets } );
  82. } else {
  83. for ( var i = 0; i < offsets.length; i ++ ) {
  84. var stream = new CTM.Stream( binaryData );
  85. stream.offset = offsets[ i ];
  86. var ctmFile = new CTM.File( stream );
  87. if ( useBuffers ) {
  88. scope.createModelBuffers( ctmFile, callback );
  89. } else {
  90. scope.createModelClassic( ctmFile, callback );
  91. }
  92. }
  93. //var e = Date.now();
  94. //console.log( "CTM data parse time [inline]: " + (e-s) + " ms" );
  95. }
  96. } else {
  97. console.error( "Couldn't load [" + url + "] [" + xhr.status + "]" );
  98. }
  99. } else if ( xhr.readyState === 3 ) {
  100. if ( callbackProgress ) {
  101. if ( length === 0 ) {
  102. length = xhr.getResponseHeader( "Content-Length" );
  103. }
  104. callbackProgress( { total: length, loaded: xhr.responseText.length } );
  105. }
  106. } else if ( xhr.readyState === 2 ) {
  107. length = xhr.getResponseHeader( "Content-Length" );
  108. }
  109. }
  110. xhr.open( "GET", url, true );
  111. xhr.responseType = "arraybuffer";
  112. xhr.send( null );
  113. };
  114. THREE.CTMLoader.prototype.createModelBuffers = function ( file, callback ) {
  115. var Model = function ( ) {
  116. var scope = this;
  117. scope.materials = [];
  118. THREE.BufferGeometry.call( this );
  119. // init GL buffers
  120. var vertexIndexArray = file.body.indices,
  121. vertexPositionArray = file.body.vertices,
  122. vertexNormalArray = file.body.normals;
  123. var vertexUvArray, vertexColorArray;
  124. if ( file.body.uvMaps !== undefined && file.body.uvMaps.length > 0 ) {
  125. vertexUvArray = file.body.uvMaps[ 0 ].uv;
  126. }
  127. if ( file.body.attrMaps !== undefined && file.body.attrMaps.length > 0 && file.body.attrMaps[ 0 ].name === "Color" ) {
  128. vertexColorArray = file.body.attrMaps[ 0 ].attr;
  129. }
  130. // attributes
  131. var attributes = scope.attributes;
  132. attributes[ "index" ] = { itemSize: 1, array: vertexIndexArray };
  133. attributes[ "position" ] = { itemSize: 3, array: vertexPositionArray };
  134. if ( vertexNormalArray !== undefined )
  135. attributes[ "normal" ] = { itemSize: 3, array: vertexNormalArray };
  136. if ( vertexUvArray !== undefined )
  137. attributes[ "uv" ] = { itemSize: 2, array: vertexUvArray };
  138. if ( vertexColorArray !== undefined )
  139. attributes[ "color" ] = { itemSize: 4, array: vertexColorArray };
  140. }
  141. Model.prototype = Object.create( THREE.BufferGeometry.prototype );
  142. var geometry = new Model();
  143. geometry.computeOffsets();
  144. // compute vertex normals if not present in the CTM model
  145. if ( geometry.attributes[ "normal" ] === undefined ) {
  146. geometry.computeVertexNormals();
  147. }
  148. callback( geometry );
  149. };
  150. THREE.CTMLoader.prototype.createModelClassic = function ( file, callback ) {
  151. var Model = function ( ) {
  152. var scope = this;
  153. scope.materials = [];
  154. THREE.Geometry.call( this );
  155. var normals = [],
  156. uvs = [],
  157. colors = [];
  158. init_vertices( file.body.vertices );
  159. if ( file.body.normals !== undefined )
  160. init_normals( file.body.normals );
  161. if ( file.body.uvMaps !== undefined && file.body.uvMaps.length > 0 )
  162. init_uvs( file.body.uvMaps[ 0 ].uv );
  163. if ( file.body.attrMaps !== undefined && file.body.attrMaps.length > 0 && file.body.attrMaps[ 0 ].name === "Color" )
  164. init_colors( file.body.attrMaps[ 0 ].attr );
  165. var hasNormals = normals.length > 0 ? true : false,
  166. hasUvs = uvs.length > 0 ? true : false,
  167. hasColors = colors.length > 0 ? true : false;
  168. init_faces( file.body.indices );
  169. this.computeCentroids();
  170. this.computeFaceNormals();
  171. //this.computeTangents();
  172. function init_vertices( buffer ) {
  173. var x, y, z, i, il = buffer.length;
  174. for( i = 0; i < il; i += 3 ) {
  175. x = buffer[ i ];
  176. y = buffer[ i + 1 ];
  177. z = buffer[ i + 2 ];
  178. vertex( scope, x, y, z );
  179. }
  180. };
  181. function init_normals( buffer ) {
  182. var x, y, z, i, il = buffer.length;
  183. for( i = 0; i < il; i += 3 ) {
  184. x = buffer[ i ];
  185. y = buffer[ i + 1 ];
  186. z = buffer[ i + 2 ];
  187. normals.push( x, y, z );
  188. }
  189. };
  190. function init_colors( buffer ) {
  191. var r, g, b, a, i, il = buffer.length;
  192. for( i = 0; i < il; i += 4 ) {
  193. r = buffer[ i ];
  194. g = buffer[ i + 1 ];
  195. b = buffer[ i + 2 ];
  196. a = buffer[ i + 3 ];
  197. var color = new THREE.Color();
  198. color.setRGB( r, g, b );
  199. colors.push( color );
  200. }
  201. };
  202. function init_uvs( buffer ) {
  203. var u, v, i, il = buffer.length;
  204. for( i = 0; i < il; i += 2 ) {
  205. u = buffer[ i ];
  206. v = buffer[ i + 1 ];
  207. uvs.push( u, v );
  208. }
  209. };
  210. function init_faces( buffer ) {
  211. var a, b, c,
  212. u1, v1, u2, v2, u3, v3,
  213. m, face,
  214. i, il = buffer.length;
  215. m = 0; // all faces defaulting to material 0
  216. for( i = 0; i < il; i += 3 ) {
  217. a = buffer[ i ];
  218. b = buffer[ i + 1 ];
  219. c = buffer[ i + 2 ];
  220. if ( hasNormals ){
  221. face = f3n( scope, normals, a, b, c, m, a, b, c );
  222. } else {
  223. face = f3( scope, a, b, c, m );
  224. }
  225. if ( hasColors ) {
  226. face.vertexColors[ 0 ] = colors[ a ];
  227. face.vertexColors[ 1 ] = colors[ b ];
  228. face.vertexColors[ 2 ] = colors[ c ];
  229. }
  230. if ( hasUvs ) {
  231. u1 = uvs[ a * 2 ];
  232. v1 = uvs[ a * 2 + 1 ];
  233. u2 = uvs[ b * 2 ];
  234. v2 = uvs[ b * 2 + 1 ];
  235. u3 = uvs[ c * 2 ];
  236. v3 = uvs[ c * 2 + 1 ];
  237. uv3( scope.faceVertexUvs[ 0 ], u1, v1, u2, v2, u3, v3 );
  238. }
  239. }
  240. }
  241. };
  242. function vertex ( scope, x, y, z ) {
  243. scope.vertices.push( new THREE.Vector3( x, y, z ) );
  244. };
  245. function f3 ( scope, a, b, c, mi ) {
  246. var face = new THREE.Face3( a, b, c, null, null, mi );
  247. scope.faces.push( face );
  248. return face;
  249. };
  250. function f3n ( scope, normals, a, b, c, mi, nai, nbi, nci ) {
  251. var nax = normals[ nai * 3 ],
  252. nay = normals[ nai * 3 + 1 ],
  253. naz = normals[ nai * 3 + 2 ],
  254. nbx = normals[ nbi * 3 ],
  255. nby = normals[ nbi * 3 + 1 ],
  256. nbz = normals[ nbi * 3 + 2 ],
  257. ncx = normals[ nci * 3 ],
  258. ncy = normals[ nci * 3 + 1 ],
  259. ncz = normals[ nci * 3 + 2 ];
  260. var na = new THREE.Vector3( nax, nay, naz ),
  261. nb = new THREE.Vector3( nbx, nby, nbz ),
  262. nc = new THREE.Vector3( ncx, ncy, ncz );
  263. var face = new THREE.Face3( a, b, c, [ na, nb, nc ], null, mi );
  264. scope.faces.push( face );
  265. return face;
  266. };
  267. function uv3 ( where, u1, v1, u2, v2, u3, v3 ) {
  268. var uv = [];
  269. uv.push( new THREE.Vector2( u1, v1 ) );
  270. uv.push( new THREE.Vector2( u2, v2 ) );
  271. uv.push( new THREE.Vector2( u3, v3 ) );
  272. where.push( uv );
  273. };
  274. Model.prototype = Object.create( THREE.Geometry.prototype );
  275. callback( new Model() );
  276. };