ColladaLoader2.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. THREE.ColladaLoader = function ( manager ) {
  5. this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
  6. };
  7. THREE.ColladaLoader.prototype = {
  8. constructor: THREE.ColladaLoader,
  9. load: function ( url, onLoad, onProgress, onError ) {
  10. function getBaseUrl( url ) {
  11. var parts = url.split( '/' );
  12. parts.pop();
  13. return ( parts.length < 1 ? '.' : parts.join( '/' ) ) + '/';
  14. }
  15. var scope = this;
  16. var loader = new THREE.XHRLoader( scope.manager );
  17. loader.setCrossOrigin( scope.crossOrigin );
  18. loader.load( url, function ( text ) {
  19. onLoad( scope.parse( text, getBaseUrl( url ) ) );
  20. }, onProgress, onError );
  21. },
  22. options: {
  23. set convertUpAxis ( value ) {
  24. console.log( 'ColladaLoder.options.convertUpAxis: TODO' );
  25. }
  26. },
  27. setCrossOrigin: function ( value ) {
  28. this.crossOrigin = value;
  29. },
  30. parse: function ( text, baseUrl ) {
  31. function parseFloats( text ) {
  32. var parts = text.trim().split( /\s+/ );
  33. var array = new Array( parts.length );
  34. for ( var i = 0, l = parts.length; i < l; i ++ ) {
  35. array[ i ] = parseFloat( parts[ i ] );
  36. }
  37. return array;
  38. }
  39. function parseInts( text ) {
  40. var parts = text.trim().split( /\s+/ );
  41. var array = new Array( parts.length );
  42. for ( var i = 0, l = parts.length; i < l; i ++ ) {
  43. array[ i ] = parseInt( parts[ i ] );
  44. }
  45. return array;
  46. }
  47. function parseId( text ) {
  48. return text.substring( 1 );
  49. }
  50. // asset
  51. function parseAsset( xml ) {
  52. return {
  53. upAxis: parseAssetUpAxis( xml.getElementsByTagName( 'up_axis' )[ 0 ] )
  54. };
  55. }
  56. function parseAssetUpAxis( xml ) {
  57. return xml !== undefined ? xml.textContent : 'Y_UP';
  58. }
  59. // library
  60. function parseLibrary( data, libraryName, nodeName, parser ) {
  61. var library = xml.getElementsByTagName( libraryName )[ 0 ];
  62. if ( library !== undefined ) {
  63. var elements = library.getElementsByTagName( nodeName );
  64. for ( var i = 0; i < elements.length; i ++ ) {
  65. parser( elements[ i ] );
  66. }
  67. }
  68. }
  69. function buildLibrary( data, builder ) {
  70. for ( var name in data ) {
  71. var object = data[ name ];
  72. object.build = builder( data[ name ] );
  73. }
  74. }
  75. // get
  76. function getBuild( data, builder ) {
  77. if ( data.build !== undefined ) return data.build;
  78. data.build = builder( data );
  79. return data.build;
  80. }
  81. // image
  82. var imageLoader = new THREE.ImageLoader();
  83. function parseImage( xml ) {
  84. var data = {
  85. url: xml.getElementsByTagName( 'init_from' )[ 0 ].textContent
  86. };
  87. library.images[ xml.getAttribute( 'id' ) ] = data;
  88. }
  89. function buildImage( data ) {
  90. if ( data.build !== undefined ) return data.build;
  91. var url = data.url;
  92. if ( baseUrl !== undefined ) url = baseUrl + url;
  93. return imageLoader.load( url );
  94. }
  95. function getImage( id ) {
  96. return getBuild( library.images[ id ], buildImage );
  97. }
  98. // effect
  99. function parseEffect( xml ) {
  100. }
  101. function buildEffect( data ) {
  102. }
  103. function getEffect( id ) {
  104. return getBuild( library.effects[ id ], buildEffect );
  105. }
  106. // camera
  107. function parseCamera( xml ) {
  108. var data = {
  109. name: xml.getAttribute( 'name' )
  110. };
  111. library.cameras[ xml.getAttribute( 'id' ) ] = {};
  112. }
  113. function buildCamera( data ) {
  114. var camera = new THREE.PerspectiveCamera();
  115. camera.name = data.name;
  116. return camera;
  117. }
  118. function getCamera( id ) {
  119. return getBuild( library.cameras[ id ], buildCamera );
  120. }
  121. // light
  122. function parseLight( xml ) {
  123. var data = {};
  124. for ( var i = 0, l = xml.childNodes.length; i < l; i ++ ) {
  125. var child = xml.childNodes[ i ];
  126. if ( child.nodeType !== 1 ) continue;
  127. switch ( child.nodeName ) {
  128. case 'technique_common':
  129. data = parseLightTechnique( child );
  130. break;
  131. }
  132. }
  133. library.lights[ xml.getAttribute( 'id' ) ] = data;
  134. }
  135. function parseLightTechnique( xml ) {
  136. var data = {};
  137. for ( var i = 0, l = xml.childNodes.length; i < l; i ++ ) {
  138. var child = xml.childNodes[ i ];
  139. if ( child.nodeType !== 1 ) continue;
  140. switch ( child.nodeName ) {
  141. case 'directional':
  142. case 'point':
  143. case 'spot':
  144. case 'ambient':
  145. data.technique = child.nodeName;
  146. data.parameters = parseLightParameters( child );
  147. }
  148. }
  149. return data;
  150. }
  151. function parseLightParameters( xml ) {
  152. var data = {};
  153. for ( var i = 0, l = xml.childNodes.length; i < l; i ++ ) {
  154. var child = xml.childNodes[ i ];
  155. if ( child.nodeType !== 1 ) continue;
  156. switch ( child.nodeName ) {
  157. case 'color':
  158. var array = parseFloats( child.textContent );
  159. data.color = new THREE.Color().fromArray( array );
  160. break;
  161. case 'falloff_angle':
  162. data.falloffAngle = parseFloat( child.textContent );
  163. break;
  164. case 'quadratic_attenuation':
  165. var f = parseFloat( child.textContent );
  166. data.distance = f ? Math.sqrt( 1 / f ) : 0;
  167. break;
  168. }
  169. }
  170. return data;
  171. }
  172. function buildLight( data ) {
  173. var light;
  174. switch ( data.technique ) {
  175. case 'directional':
  176. light = new THREE.DirectionalLight();
  177. break;
  178. case 'point':
  179. light = new THREE.PointLight();
  180. break;
  181. case 'spot':
  182. light = new THREE.SpotLight();
  183. break;
  184. case 'ambient':
  185. light = new THREE.AmbientLight();
  186. break;
  187. }
  188. if ( data.parameters.color ) light.color.copy( data.parameters.color );
  189. if ( data.parameters.distance ) light.distance = data.parameters.distance;
  190. return light;
  191. }
  192. function getLight( id ) {
  193. return getBuild( library.lights[ id ], buildLight );
  194. }
  195. // geometry
  196. function parseGeometry( xml ) {
  197. var data = {
  198. name: xml.getAttribute( 'name' ),
  199. sources: {},
  200. primitives: []
  201. };
  202. var mesh = xml.getElementsByTagName( 'mesh' )[ 0 ];
  203. for ( var i = 0; i < mesh.childNodes.length; i ++ ) {
  204. var child = mesh.childNodes[ i ];
  205. if ( child.nodeType !== 1 ) continue;
  206. switch ( child.nodeName ) {
  207. case 'source':
  208. data.sources[ child.getAttribute( 'id' ) ] = parseFloats( child.getElementsByTagName( 'float_array' )[ 0 ].textContent );
  209. break;
  210. case 'vertices':
  211. data.sources[ child.getAttribute( 'id' ) ] = data.sources[ parseId( child.getElementsByTagName( 'input' )[ 0 ].getAttribute( 'source' ) ) ];
  212. break;
  213. case 'polygons':
  214. console.log( 'ColladaLoader: Unsupported primitive type: ', child.nodeName );
  215. break;
  216. case 'lines':
  217. case 'linestrips':
  218. case 'polylist':
  219. case 'triangles':
  220. data.primitives.push( parseGeometryPrimitive( child ) );
  221. break;
  222. default:
  223. console.log( child );
  224. }
  225. }
  226. library.geometries[ xml.getAttribute( 'id' ) ] = data;
  227. }
  228. function parseGeometryPrimitive( xml ) {
  229. var primitive = {
  230. type: xml.nodeName,
  231. inputs: {},
  232. stride: 0
  233. };
  234. for ( var i = 0, l = xml.childNodes.length; i < l; i ++ ) {
  235. var child = xml.childNodes[ i ];
  236. if ( child.nodeType !== 1 ) continue;
  237. switch ( child.nodeName ) {
  238. case 'input':
  239. var id = parseId( child.getAttribute( 'source' ) );
  240. var semantic = child.getAttribute( 'semantic' );
  241. var offset = parseInt( child.getAttribute( 'offset' ) );
  242. primitive.inputs[ semantic ] = { id: id, offset: offset };
  243. primitive.stride = Math.max( primitive.stride, offset + 1 );
  244. break;
  245. case 'vcount':
  246. primitive.vcount = parseInts( child.textContent );
  247. break;
  248. case 'p':
  249. primitive.p = parseInts( child.textContent );
  250. break;
  251. }
  252. }
  253. return primitive;
  254. }
  255. function buildGeometry( data ) {
  256. var group = new THREE.Group();
  257. var sources = data.sources;
  258. var primitives = data.primitives;
  259. if ( primitives.length === 0 ) return group;
  260. for ( var p = 0; p < primitives.length; p ++ ) {
  261. var primitive = primitives[ p ];
  262. var inputs = primitive.inputs;
  263. var stride = primitive.stride;
  264. var vcount = primitive.vcount;
  265. var indices = primitive.p;
  266. var vcount = primitive.vcount;
  267. var maxcount = 0;
  268. var geometry = new THREE.BufferGeometry();
  269. if ( data.name ) geometry.name = data.name;
  270. for ( var name in inputs ) {
  271. var input = inputs[ name ];
  272. var source = sources[ input.id ];
  273. var offset = input.offset;
  274. var array = [];
  275. function pushVector( i ) {
  276. var index = indices[ i + offset ] * 3;
  277. if ( asset.upAxis === 'Z_UP' ) {
  278. array.push( source[ index + 0 ], source[ index + 2 ], - source[ index + 1 ] );
  279. } else {
  280. array.push( source[ index + 0 ], source[ index + 1 ], source[ index + 2 ] );
  281. }
  282. }
  283. if ( primitive.vcount !== undefined ) {
  284. var index = 0;
  285. for ( var i = 0, l = vcount.length; i < l; i ++ ) {
  286. var count = vcount[ i ];
  287. if ( count === 4 ) {
  288. var a = index + stride * 0;
  289. var b = index + stride * 1;
  290. var c = index + stride * 2;
  291. var d = index + stride * 3;
  292. pushVector( a ); pushVector( b ); pushVector( d );
  293. pushVector( b ); pushVector( c ); pushVector( d );
  294. } else if ( count === 3 ) {
  295. var a = index + stride * 0;
  296. var b = index + stride * 1;
  297. var c = index + stride * 2;
  298. pushVector( a ); pushVector( b ); pushVector( c );
  299. } else {
  300. maxcount = Math.max( maxcount, count );
  301. }
  302. index += stride * count;
  303. }
  304. } else {
  305. for ( var i = 0, l = indices.length; i < l; i += stride ) {
  306. pushVector( i );
  307. }
  308. }
  309. switch ( name ) {
  310. case 'VERTEX':
  311. geometry.addAttribute( 'position', new THREE.Float32Attribute( array, 3 ) );
  312. break;
  313. case 'NORMAL':
  314. geometry.addAttribute( 'normal', new THREE.Float32Attribute( array, 3 ) );
  315. break;
  316. }
  317. }
  318. if ( maxcount > 0 ) {
  319. console.log( 'ColladaLoader: Geometry', data.id, 'has faces with more than 4 vertices.' );
  320. }
  321. switch ( primitive.type ) {
  322. case 'lines':
  323. group.add( new THREE.LineSegments( geometry ) );
  324. break;
  325. case 'linestrips':
  326. group.add( new THREE.Line( geometry ) );
  327. break;
  328. case 'triangles':
  329. case 'polylist':
  330. group.add( new THREE.Mesh( geometry ) );
  331. break;
  332. }
  333. }
  334. // flatten
  335. if ( group.children.length === 1 ) {
  336. return group.children[ 0 ];
  337. }
  338. return group;
  339. }
  340. function getGeometry( id ) {
  341. return getBuild( library.geometries[ id ], buildGeometry );
  342. }
  343. // nodes
  344. var matrix = new THREE.Matrix4();
  345. var vector = new THREE.Vector3();
  346. function parseNode( xml ) {
  347. var data = {
  348. name: xml.getAttribute( 'name' ),
  349. matrix: new THREE.Matrix4(),
  350. nodes: [],
  351. instanceCameras: [],
  352. instanceLights: [],
  353. instanceGeometries: [],
  354. instanceNodes: []
  355. };
  356. for ( var i = 0; i < xml.childNodes.length; i ++ ) {
  357. var child = xml.childNodes[ i ];
  358. if ( child.nodeType !== 1 ) continue;
  359. switch ( child.nodeName ) {
  360. case 'node':
  361. parseNode( child );
  362. data.nodes.push( child.getAttribute( 'id' ) );
  363. break;
  364. case 'instance_camera':
  365. data.instanceCameras.push( parseId( child.getAttribute( 'url' ) ) );
  366. break;
  367. case 'instance_light':
  368. data.instanceLights.push( parseId( child.getAttribute( 'url' ) ) );
  369. break;
  370. case 'instance_geometry':
  371. data.instanceGeometries.push( parseId( child.getAttribute( 'url' ) ) );
  372. break;
  373. case 'instance_node':
  374. data.instanceNodes.push( parseId( child.getAttribute( 'url' ) ) );
  375. break;
  376. case 'matrix':
  377. var array = parseFloats( child.textContent );
  378. data.matrix.multiply( matrix.fromArray( array ).transpose() ); // .transpose() when Z_UP?
  379. break;
  380. case 'translate':
  381. var array = parseFloats( child.textContent );
  382. vector.fromArray( array );
  383. data.matrix.multiply( matrix.makeTranslation( vector.x, vector.y, vector.z ) );
  384. break;
  385. case 'rotate':
  386. var array = parseFloats( child.textContent );
  387. var angle = THREE.Math.degToRad( array[ 3 ] );
  388. data.matrix.multiply( matrix.makeRotationAxis( vector.fromArray( array ), angle ) );
  389. break;
  390. case 'scale':
  391. var array = parseFloats( child.textContent );
  392. data.matrix.scale( vector.fromArray( array ) );
  393. break;
  394. case 'extra':
  395. break;
  396. default:
  397. console.log( child );
  398. break;
  399. }
  400. }
  401. if ( xml.getAttribute( 'id' ) !== null ) {
  402. library.nodes[ xml.getAttribute( 'id' ) ] = data;
  403. }
  404. return data;
  405. }
  406. function buildNode( data ) {
  407. var objects = [];
  408. var matrix = data.matrix;
  409. var nodes = data.nodes;
  410. var instanceCameras = data.instanceCameras;
  411. var instanceLights = data.instanceLights;
  412. var instanceGeometries = data.instanceGeometries;
  413. var instanceNodes = data.instanceNodes;
  414. for ( var i = 0, l = nodes.length; i < l; i ++ ) {
  415. objects.push( getNode( nodes[ i ] ).clone() );
  416. }
  417. for ( var i = 0, l = instanceCameras.length; i < l; i ++ ) {
  418. objects.push( getCamera( instanceCameras[ i ] ).clone() );
  419. }
  420. for ( var i = 0, l = instanceLights.length; i < l; i ++ ) {
  421. objects.push( getLight( instanceLights[ i ] ).clone() );
  422. }
  423. for ( var i = 0, l = instanceGeometries.length; i < l; i ++ ) {
  424. objects.push( getGeometry( instanceGeometries[ i ] ).clone() );
  425. }
  426. for ( var i = 0, l = instanceNodes.length; i < l; i ++ ) {
  427. objects.push( getNode( instanceNodes[ i ] ).clone() );
  428. }
  429. var object;
  430. if ( objects.length === 1 ) {
  431. object = objects[ 0 ];
  432. } else {
  433. object = new THREE.Group();
  434. for ( var i = 0; i < objects.length; i ++ ) {
  435. object.add( objects[ i ] );
  436. }
  437. }
  438. object.name = data.name;
  439. matrix.decompose( object.position, object.quaternion, object.scale );
  440. return object;
  441. }
  442. function getNode( id ) {
  443. return getBuild( library.nodes[ id ], buildNode );
  444. }
  445. // visual scenes
  446. function parseVisualScene( xml ) {
  447. var data = {
  448. name: xml.getAttribute( 'name' ),
  449. children: []
  450. };
  451. var elements = xml.getElementsByTagName( 'node' );
  452. for ( var i = 0; i < elements.length; i ++ ) {
  453. data.children.push( parseNode( elements[ i ] ) );
  454. }
  455. library.visualScenes[ xml.getAttribute( 'id' ) ] = data;
  456. }
  457. function buildVisualScene( data ) {
  458. var group = new THREE.Group();
  459. group.name = data.name;
  460. var children = data.children;
  461. for ( var i = 0; i < children.length; i ++ ) {
  462. group.add( buildNode( children[ i ] ) );
  463. }
  464. return group;
  465. }
  466. function getVisualScene( id ) {
  467. return getBuild( library.visualScenes[ id ], buildVisualScene );
  468. }
  469. // scenes
  470. function parseScene( xml ) {
  471. var scene = xml.getElementsByTagName( 'scene' )[ 0 ];
  472. var instance = scene.getElementsByTagName( 'instance_visual_scene' )[ 0 ];
  473. return getVisualScene( parseId( instance.getAttribute( 'url' ) ) );
  474. }
  475. console.time( 'ColladaLoader' );
  476. console.time( 'ColladaLoader: DOMParser' );
  477. var xml = new DOMParser().parseFromString( text, 'application/xml' );
  478. console.timeEnd( 'ColladaLoader: DOMParser' );
  479. // metadata
  480. var version = xml.getElementsByTagName( 'COLLADA' )[ 0 ].getAttribute( 'version' );
  481. console.log( 'ColladaLoader: File version', version );
  482. var asset = parseAsset( xml.getElementsByTagName( 'asset' )[ 0 ] );
  483. //
  484. var library = {
  485. images: {},
  486. // effects: {},
  487. cameras: {},
  488. lights: {},
  489. geometries: {},
  490. nodes: {},
  491. visualScenes: {}
  492. };
  493. console.time( 'ColladaLoader: Parse' );
  494. parseLibrary( library.images, 'library_images', 'image', parseImage );
  495. // parseLibrary( library.effects, 'library_effects', 'effect', parseEffect );
  496. parseLibrary( library.cameras, 'library_cameras', 'camera', parseCamera );
  497. parseLibrary( library.lights, 'library_lights', 'light', parseLight );
  498. parseLibrary( library.geometries, 'library_geometries', 'geometry', parseGeometry );
  499. parseLibrary( library.nodes, 'library_nodes', 'node', parseNode );
  500. parseLibrary( library.visualScenes, 'library_visual_scenes', 'visual_scene', parseVisualScene );
  501. console.timeEnd( 'ColladaLoader: Parse' );
  502. console.time( 'ColladaLoader: Build' );
  503. // buildLibrary( library.images, buildImage );
  504. // buildLibrary( library.effects, buildEffect );
  505. buildLibrary( library.cameras, buildCamera );
  506. buildLibrary( library.lights, buildLight );
  507. buildLibrary( library.geometries, buildGeometry );
  508. buildLibrary( library.nodes, buildNode );
  509. buildLibrary( library.visualScenes, buildVisualScene );
  510. console.timeEnd( 'ColladaLoader: Build' );
  511. // console.log( library );
  512. var scene = parseScene( xml );
  513. console.timeEnd( 'ColladaLoader' );
  514. // console.log( scene );
  515. return {
  516. animations: [],
  517. kinematics: { joints: [] },
  518. scene: scene
  519. };
  520. }
  521. };