JSONLoader.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. * @author alteredq / http://alteredqualia.com/
  4. */
  5. THREE.JSONLoader = function ( showStatus ) {
  6. THREE.Loader.call( this, showStatus );
  7. this.withCredentials = false;
  8. };
  9. THREE.JSONLoader.prototype = Object.create( THREE.Loader.prototype );
  10. THREE.JSONLoader.prototype.constructor = THREE.JSONLoader;
  11. THREE.JSONLoader.prototype.load = function ( url, callback, texturePath ) {
  12. var scope = this;
  13. // todo: unify load API to for easier SceneLoader use
  14. texturePath = texturePath && ( typeof texturePath === 'string' ) ? texturePath : this.extractUrlBase( url );
  15. this.onLoadStart();
  16. this.loadAjaxJSON( this, url, callback, texturePath );
  17. };
  18. THREE.JSONLoader.prototype.loadAjaxJSON = function ( context, url, callback, texturePath, callbackProgress ) {
  19. var xhr = new XMLHttpRequest();
  20. var length = 0;
  21. xhr.onreadystatechange = function () {
  22. if ( xhr.readyState === xhr.DONE ) {
  23. if ( xhr.status === 200 || xhr.status === 0 ) {
  24. if ( xhr.responseText ) {
  25. var json = JSON.parse( xhr.responseText );
  26. if ( json.metadata !== undefined && json.metadata.type === 'scene' ) {
  27. THREE.error( 'THREE.JSONLoader: "' + url + '" seems to be a Scene. Use THREE.SceneLoader instead.' );
  28. return;
  29. }
  30. var result = context.parse( json, texturePath );
  31. callback( result.geometry, result.materials );
  32. } else {
  33. THREE.error( 'THREE.JSONLoader: "' + url + '" seems to be unreachable or the file is empty.' );
  34. }
  35. // in context of more complex asset initialization
  36. // do not block on single failed file
  37. // maybe should go even one more level up
  38. context.onLoadComplete();
  39. } else {
  40. THREE.error( 'THREE.JSONLoader: Couldn\'t load "' + url + '" (' + xhr.status + ')' );
  41. }
  42. } else if ( xhr.readyState === xhr.LOADING ) {
  43. if ( callbackProgress ) {
  44. if ( length === 0 ) {
  45. length = xhr.getResponseHeader( 'Content-Length' );
  46. }
  47. callbackProgress( { total: length, loaded: xhr.responseText.length } );
  48. }
  49. } else if ( xhr.readyState === xhr.HEADERS_RECEIVED ) {
  50. if ( callbackProgress !== undefined ) {
  51. length = xhr.getResponseHeader( 'Content-Length' );
  52. }
  53. }
  54. };
  55. xhr.open( 'GET', url, true );
  56. xhr.withCredentials = this.withCredentials;
  57. xhr.send( null );
  58. };
  59. THREE.JSONLoader.prototype.parse = function ( json, texturePath ) {
  60. var scope = this,
  61. geometry = new THREE.Geometry(),
  62. scale = ( json.scale !== undefined ) ? 1.0 / json.scale : 1.0;
  63. parseModel( scale );
  64. parseSkin();
  65. parseMorphing( scale );
  66. geometry.computeFaceNormals();
  67. geometry.computeBoundingSphere();
  68. function parseModel( scale ) {
  69. function isBitSet( value, position ) {
  70. return value & ( 1 << position );
  71. }
  72. var i, j, fi,
  73. offset, zLength,
  74. colorIndex, normalIndex, uvIndex, materialIndex,
  75. type,
  76. isQuad,
  77. hasMaterial,
  78. hasFaceVertexUv,
  79. hasFaceNormal, hasFaceVertexNormal,
  80. hasFaceColor, hasFaceVertexColor,
  81. vertex, face, faceA, faceB, color, hex, normal,
  82. uvLayer, uv, u, v,
  83. faces = json.faces,
  84. vertices = json.vertices,
  85. normals = json.normals,
  86. colors = json.colors,
  87. nUvLayers = 0;
  88. if ( json.uvs !== undefined ) {
  89. // disregard empty arrays
  90. for ( i = 0; i < json.uvs.length; i ++ ) {
  91. if ( json.uvs[ i ].length ) nUvLayers ++;
  92. }
  93. for ( i = 0; i < nUvLayers; i ++ ) {
  94. geometry.faceVertexUvs[ i ] = [];
  95. }
  96. }
  97. offset = 0;
  98. zLength = vertices.length;
  99. while ( offset < zLength ) {
  100. vertex = new THREE.Vector3();
  101. vertex.x = vertices[ offset ++ ] * scale;
  102. vertex.y = vertices[ offset ++ ] * scale;
  103. vertex.z = vertices[ offset ++ ] * scale;
  104. geometry.vertices.push( vertex );
  105. }
  106. offset = 0;
  107. zLength = faces.length;
  108. while ( offset < zLength ) {
  109. type = faces[ offset ++ ];
  110. isQuad = isBitSet( type, 0 );
  111. hasMaterial = isBitSet( type, 1 );
  112. hasFaceVertexUv = isBitSet( type, 3 );
  113. hasFaceNormal = isBitSet( type, 4 );
  114. hasFaceVertexNormal = isBitSet( type, 5 );
  115. hasFaceColor = isBitSet( type, 6 );
  116. hasFaceVertexColor = isBitSet( type, 7 );
  117. // console.log("type", type, "bits", isQuad, hasMaterial, hasFaceVertexUv, hasFaceNormal, hasFaceVertexNormal, hasFaceColor, hasFaceVertexColor);
  118. if ( isQuad ) {
  119. faceA = new THREE.Face3();
  120. faceA.a = faces[ offset ];
  121. faceA.b = faces[ offset + 1 ];
  122. faceA.c = faces[ offset + 3 ];
  123. faceB = new THREE.Face3();
  124. faceB.a = faces[ offset + 1 ];
  125. faceB.b = faces[ offset + 2 ];
  126. faceB.c = faces[ offset + 3 ];
  127. offset += 4;
  128. if ( hasMaterial ) {
  129. materialIndex = faces[ offset ++ ];
  130. faceA.materialIndex = materialIndex;
  131. faceB.materialIndex = materialIndex;
  132. }
  133. // to get face <=> uv index correspondence
  134. fi = geometry.faces.length;
  135. if ( hasFaceVertexUv ) {
  136. for ( i = 0; i < nUvLayers; i ++ ) {
  137. uvLayer = json.uvs[ i ];
  138. geometry.faceVertexUvs[ i ][ fi ] = [];
  139. geometry.faceVertexUvs[ i ][ fi + 1 ] = []
  140. for ( j = 0; j < 4; j ++ ) {
  141. uvIndex = faces[ offset ++ ];
  142. u = uvLayer[ uvIndex * 2 ];
  143. v = uvLayer[ uvIndex * 2 + 1 ];
  144. uv = new THREE.Vector2( u, v );
  145. if ( j !== 2 ) geometry.faceVertexUvs[ i ][ fi ].push( uv );
  146. if ( j !== 0 ) geometry.faceVertexUvs[ i ][ fi + 1 ].push( uv );
  147. }
  148. }
  149. }
  150. if ( hasFaceNormal ) {
  151. normalIndex = faces[ offset ++ ] * 3;
  152. faceA.normal.set(
  153. normals[ normalIndex ++ ],
  154. normals[ normalIndex ++ ],
  155. normals[ normalIndex ]
  156. );
  157. faceB.normal.copy( faceA.normal );
  158. }
  159. if ( hasFaceVertexNormal ) {
  160. for ( i = 0; i < 4; i ++ ) {
  161. normalIndex = faces[ offset ++ ] * 3;
  162. normal = new THREE.Vector3(
  163. normals[ normalIndex ++ ],
  164. normals[ normalIndex ++ ],
  165. normals[ normalIndex ]
  166. );
  167. if ( i !== 2 ) faceA.vertexNormals.push( normal );
  168. if ( i !== 0 ) faceB.vertexNormals.push( normal );
  169. }
  170. }
  171. if ( hasFaceColor ) {
  172. colorIndex = faces[ offset ++ ];
  173. hex = colors[ colorIndex ];
  174. faceA.color.setHex( hex );
  175. faceB.color.setHex( hex );
  176. }
  177. if ( hasFaceVertexColor ) {
  178. for ( i = 0; i < 4; i ++ ) {
  179. colorIndex = faces[ offset ++ ];
  180. hex = colors[ colorIndex ];
  181. if ( i !== 2 ) faceA.vertexColors.push( new THREE.Color( hex ) );
  182. if ( i !== 0 ) faceB.vertexColors.push( new THREE.Color( hex ) );
  183. }
  184. }
  185. geometry.faces.push( faceA );
  186. geometry.faces.push( faceB );
  187. } else {
  188. face = new THREE.Face3();
  189. face.a = faces[ offset ++ ];
  190. face.b = faces[ offset ++ ];
  191. face.c = faces[ offset ++ ];
  192. if ( hasMaterial ) {
  193. materialIndex = faces[ offset ++ ];
  194. face.materialIndex = materialIndex;
  195. }
  196. // to get face <=> uv index correspondence
  197. fi = geometry.faces.length;
  198. if ( hasFaceVertexUv ) {
  199. for ( i = 0; i < nUvLayers; i ++ ) {
  200. uvLayer = json.uvs[ i ];
  201. geometry.faceVertexUvs[ i ][ fi ] = [];
  202. for ( j = 0; j < 3; j ++ ) {
  203. uvIndex = faces[ offset ++ ];
  204. u = uvLayer[ uvIndex * 2 ];
  205. v = uvLayer[ uvIndex * 2 + 1 ];
  206. uv = new THREE.Vector2( u, v );
  207. geometry.faceVertexUvs[ i ][ fi ].push( uv );
  208. }
  209. }
  210. }
  211. if ( hasFaceNormal ) {
  212. normalIndex = faces[ offset ++ ] * 3;
  213. face.normal.set(
  214. normals[ normalIndex ++ ],
  215. normals[ normalIndex ++ ],
  216. normals[ normalIndex ]
  217. );
  218. }
  219. if ( hasFaceVertexNormal ) {
  220. for ( i = 0; i < 3; i ++ ) {
  221. normalIndex = faces[ offset ++ ] * 3;
  222. normal = new THREE.Vector3(
  223. normals[ normalIndex ++ ],
  224. normals[ normalIndex ++ ],
  225. normals[ normalIndex ]
  226. );
  227. face.vertexNormals.push( normal );
  228. }
  229. }
  230. if ( hasFaceColor ) {
  231. colorIndex = faces[ offset ++ ];
  232. face.color.setHex( colors[ colorIndex ] );
  233. }
  234. if ( hasFaceVertexColor ) {
  235. for ( i = 0; i < 3; i ++ ) {
  236. colorIndex = faces[ offset ++ ];
  237. face.vertexColors.push( new THREE.Color( colors[ colorIndex ] ) );
  238. }
  239. }
  240. geometry.faces.push( face );
  241. }
  242. }
  243. };
  244. function parseSkin() {
  245. var influencesPerVertex = ( json.influencesPerVertex !== undefined ) ? json.influencesPerVertex : 2;
  246. if ( json.skinWeights ) {
  247. for ( var i = 0, l = json.skinWeights.length; i < l; i += influencesPerVertex ) {
  248. var x = json.skinWeights[ i ];
  249. var y = ( influencesPerVertex > 1 ) ? json.skinWeights[ i + 1 ] : 0;
  250. var z = ( influencesPerVertex > 2 ) ? json.skinWeights[ i + 2 ] : 0;
  251. var w = ( influencesPerVertex > 3 ) ? json.skinWeights[ i + 3 ] : 0;
  252. geometry.skinWeights.push( new THREE.Vector4( x, y, z, w ) );
  253. }
  254. }
  255. if ( json.skinIndices ) {
  256. for ( var i = 0, l = json.skinIndices.length; i < l; i += influencesPerVertex ) {
  257. var a = json.skinIndices[ i ];
  258. var b = ( influencesPerVertex > 1 ) ? json.skinIndices[ i + 1 ] : 0;
  259. var c = ( influencesPerVertex > 2 ) ? json.skinIndices[ i + 2 ] : 0;
  260. var d = ( influencesPerVertex > 3 ) ? json.skinIndices[ i + 3 ] : 0;
  261. geometry.skinIndices.push( new THREE.Vector4( a, b, c, d ) );
  262. }
  263. }
  264. geometry.bones = json.bones;
  265. if ( geometry.bones && geometry.bones.length > 0 && ( geometry.skinWeights.length !== geometry.skinIndices.length || geometry.skinIndices.length !== geometry.vertices.length ) ) {
  266. THREE.warning( 'When skinning, number of vertices (' + geometry.vertices.length + '), skinIndices (' +
  267. geometry.skinIndices.length + '), and skinWeights (' + geometry.skinWeights.length + ') should match.' );
  268. }
  269. // could change this to json.animations[0] or remove completely
  270. geometry.animation = json.animation;
  271. geometry.animations = json.animations;
  272. };
  273. function parseMorphing( scale ) {
  274. if ( json.morphTargets !== undefined ) {
  275. var i, l, v, vl, dstVertices, srcVertices;
  276. for ( i = 0, l = json.morphTargets.length; i < l; i ++ ) {
  277. geometry.morphTargets[ i ] = {};
  278. geometry.morphTargets[ i ].name = json.morphTargets[ i ].name;
  279. geometry.morphTargets[ i ].vertices = [];
  280. dstVertices = geometry.morphTargets[ i ].vertices;
  281. srcVertices = json.morphTargets [ i ].vertices;
  282. for ( v = 0, vl = srcVertices.length; v < vl; v += 3 ) {
  283. var vertex = new THREE.Vector3();
  284. vertex.x = srcVertices[ v ] * scale;
  285. vertex.y = srcVertices[ v + 1 ] * scale;
  286. vertex.z = srcVertices[ v + 2 ] * scale;
  287. dstVertices.push( vertex );
  288. }
  289. }
  290. }
  291. if ( json.morphColors !== undefined ) {
  292. var i, l, c, cl, dstColors, srcColors, color;
  293. for ( i = 0, l = json.morphColors.length; i < l; i ++ ) {
  294. geometry.morphColors[ i ] = {};
  295. geometry.morphColors[ i ].name = json.morphColors[ i ].name;
  296. geometry.morphColors[ i ].colors = [];
  297. dstColors = geometry.morphColors[ i ].colors;
  298. srcColors = json.morphColors [ i ].colors;
  299. for ( c = 0, cl = srcColors.length; c < cl; c += 3 ) {
  300. color = new THREE.Color( 0xffaa00 );
  301. color.setRGB( srcColors[ c ], srcColors[ c + 1 ], srcColors[ c + 2 ] );
  302. dstColors.push( color );
  303. }
  304. }
  305. }
  306. };
  307. if ( json.materials === undefined || json.materials.length === 0 ) {
  308. return { geometry: geometry };
  309. } else {
  310. var materials = this.initMaterials( json.materials, texturePath );
  311. if ( this.needsTangents( materials ) ) {
  312. geometry.computeTangents();
  313. }
  314. return { geometry: geometry, materials: materials };
  315. }
  316. };