SceneLoader.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804
  1. /**
  2. * @author alteredq / http://alteredqualia.com/
  3. */
  4. THREE.SceneLoader = function () {
  5. this.onLoadStart = function () {};
  6. this.onLoadProgress = function() {};
  7. this.onLoadComplete = function () {};
  8. this.callbackSync = function () {};
  9. this.callbackProgress = function () {};
  10. };
  11. THREE.SceneLoader.prototype.constructor = THREE.SceneLoader;
  12. THREE.SceneLoader.prototype.load = function( url, callbackFinished ) {
  13. var context = this;
  14. var xhr = new XMLHttpRequest();
  15. xhr.onreadystatechange = function () {
  16. if ( xhr.readyState == 4 ) {
  17. if ( xhr.status == 200 || xhr.status == 0 ) {
  18. try {
  19. var json = JSON.parse( xhr.responseText );
  20. } catch ( error ) {
  21. console.warn( "DEPRECATED: [" + url + "] seems to be using old model format" );
  22. }
  23. context.createScene( json, callbackFinished, url );
  24. } else {
  25. console.error( "Couldn't load [" + url + "] [" + xhr.status + "]" );
  26. }
  27. }
  28. };
  29. xhr.open( "GET", url, true );
  30. if ( xhr.overrideMimeType ) xhr.overrideMimeType( "text/plain; charset=x-user-defined" );
  31. xhr.setRequestHeader( "Content-Type", "text/plain" );
  32. xhr.send( null );
  33. };
  34. THREE.SceneLoader.prototype.createScene = function ( json, callbackFinished, url ) {
  35. var scope = this;
  36. var urlBase = THREE.Loader.prototype.extractUrlbase( url );
  37. var dg, dm, dd, dl, dc, df, dt,
  38. g, o, m, l, d, p, r, q, s, c, t, f, tt, pp, u,
  39. geometry, material, camera, fog,
  40. texture, images,
  41. light,
  42. data, binLoader, jsonLoader,
  43. counter_models, counter_textures,
  44. total_models, total_textures,
  45. result;
  46. data = json;
  47. binLoader = new THREE.BinaryLoader();
  48. jsonLoader = new THREE.JSONLoader();
  49. counter_models = 0;
  50. counter_textures = 0;
  51. result = {
  52. scene: new THREE.Scene(),
  53. geometries: {},
  54. materials: {},
  55. textures: {},
  56. objects: {},
  57. cameras: {},
  58. lights: {},
  59. fogs: {},
  60. triggers: {},
  61. empties: {}
  62. };
  63. // find out if there are some colliders
  64. var hasColliders = false;
  65. for( dd in data.objects ) {
  66. o = data.objects[ dd ];
  67. if ( o.meshCollider ) {
  68. hasColliders = true;
  69. break;
  70. }
  71. }
  72. if ( hasColliders ) {
  73. result.scene.collisions = new THREE.CollisionSystem();
  74. }
  75. if ( data.transform ) {
  76. var position = data.transform.position,
  77. rotation = data.transform.rotation,
  78. scale = data.transform.scale;
  79. if ( position )
  80. result.scene.position.set( position[ 0 ], position[ 1 ], position [ 2 ] );
  81. if ( rotation )
  82. result.scene.rotation.set( rotation[ 0 ], rotation[ 1 ], rotation [ 2 ] );
  83. if ( scale )
  84. result.scene.scale.set( scale[ 0 ], scale[ 1 ], scale [ 2 ] );
  85. if ( position || rotation || scale )
  86. result.scene.updateMatrix();
  87. }
  88. function get_url( source_url, url_type ) {
  89. if ( url_type == "relativeToHTML" ) {
  90. return source_url;
  91. } else {
  92. return urlBase + "/" + source_url;
  93. }
  94. };
  95. function handle_objects() {
  96. var object;
  97. for( dd in data.objects ) {
  98. if ( !result.objects[ dd ] ) {
  99. o = data.objects[ dd ];
  100. if ( o.geometry !== undefined ) {
  101. geometry = result.geometries[ o.geometry ];
  102. // geometry already loaded
  103. if ( geometry ) {
  104. var hasNormals = false;
  105. // not anymore support for multiple materials
  106. // shouldn't really be array
  107. material = result.materials[ o.materials[ 0 ] ];
  108. hasNormals = material instanceof THREE.ShaderMaterial;
  109. if ( hasNormals ) {
  110. geometry.computeTangents();
  111. }
  112. p = o.position;
  113. r = o.rotation;
  114. q = o.quaternion;
  115. s = o.scale;
  116. // turn off quaternions, for the moment
  117. q = 0;
  118. if ( o.materials.length == 0 ) {
  119. material = new THREE.MeshFaceMaterial();
  120. }
  121. // dirty hack to handle meshes with multiple materials
  122. // just use face materials defined in model
  123. if ( o.materials.length > 1 ) {
  124. material = new THREE.MeshFaceMaterial();
  125. }
  126. object = new THREE.Mesh( geometry, material );
  127. object.name = dd;
  128. object.position.set( p[0], p[1], p[2] );
  129. if ( q ) {
  130. object.quaternion.set( q[0], q[1], q[2], q[3] );
  131. object.useQuaternion = true;
  132. } else {
  133. object.rotation.set( r[0], r[1], r[2] );
  134. }
  135. object.scale.set( s[0], s[1], s[2] );
  136. object.visible = o.visible;
  137. result.scene.add( object );
  138. result.objects[ dd ] = object;
  139. if ( o.meshCollider ) {
  140. var meshCollider = THREE.CollisionUtils.MeshColliderWBox( object );
  141. result.scene.collisions.colliders.push( meshCollider );
  142. }
  143. if ( o.castsShadow ) {
  144. //object.visible = true;
  145. //object.materials = [ new THREE.MeshBasicMaterial( { color: 0xff0000 } ) ];
  146. var shadow = new THREE.ShadowVolume( geometry )
  147. result.scene.add( shadow );
  148. shadow.position = object.position;
  149. shadow.rotation = object.rotation;
  150. shadow.scale = object.scale;
  151. }
  152. if ( o.trigger && o.trigger.toLowerCase() != "none" ) {
  153. var trigger = {
  154. "type" : o.trigger,
  155. "object" : o
  156. };
  157. result.triggers[ object.name ] = trigger;
  158. }
  159. }
  160. // pure Object3D
  161. } else {
  162. p = o.position;
  163. r = o.rotation;
  164. q = o.quaternion;
  165. s = o.scale;
  166. // turn off quaternions, for the moment
  167. q = 0;
  168. object = new THREE.Object3D();
  169. object.name = dd;
  170. object.position.set( p[0], p[1], p[2] );
  171. if ( q ) {
  172. object.quaternion.set( q[0], q[1], q[2], q[3] );
  173. object.useQuaternion = true;
  174. } else {
  175. object.rotation.set( r[0], r[1], r[2] );
  176. }
  177. object.scale.set( s[0], s[1], s[2] );
  178. object.visible = ( o.visible !== undefined ) ? o.visible : false;
  179. result.scene.add( object );
  180. result.objects[ dd ] = object;
  181. result.empties[ dd ] = object;
  182. if ( o.trigger && o.trigger.toLowerCase() != "none" ) {
  183. var trigger = {
  184. "type" : o.trigger,
  185. "object" : o
  186. };
  187. result.triggers[ object.name ] = trigger;
  188. }
  189. }
  190. }
  191. }
  192. };
  193. function handle_mesh( geo, id ) {
  194. result.geometries[ id ] = geo;
  195. handle_objects();
  196. };
  197. function create_callback( id ) {
  198. return function( geo ) {
  199. handle_mesh( geo, id );
  200. counter_models -= 1;
  201. scope.onLoadComplete();
  202. async_callback_gate();
  203. }
  204. };
  205. function create_callback_embed( id ) {
  206. return function( geo ) {
  207. result.geometries[ id ] = geo;
  208. }
  209. };
  210. function async_callback_gate() {
  211. var progress = {
  212. totalModels : total_models,
  213. totalTextures : total_textures,
  214. loadedModels : total_models - counter_models,
  215. loadedTextures : total_textures - counter_textures
  216. };
  217. scope.callbackProgress( progress, result );
  218. scope.onLoadProgress();
  219. if( counter_models == 0 && counter_textures == 0 ) {
  220. callbackFinished( result );
  221. }
  222. };
  223. var callbackTexture = function( images ) {
  224. counter_textures -= 1;
  225. async_callback_gate();
  226. scope.onLoadComplete();
  227. };
  228. // first go synchronous elements
  229. // cameras
  230. for( dc in data.cameras ) {
  231. c = data.cameras[ dc ];
  232. if ( c.type == "perspective" ) {
  233. camera = new THREE.PerspectiveCamera( c.fov, c.aspect, c.near, c.far );
  234. } else if ( c.type == "ortho" ) {
  235. camera = new THREE.OrthographicCamera( c.left, c.right, c.top, c.bottom, c.near, c.far );
  236. }
  237. p = c.position;
  238. t = c.target;
  239. u = c.up;
  240. camera.position.set( p[0], p[1], p[2] );
  241. camera.target = new THREE.Vector3( t[0], t[1], t[2] );
  242. if ( u ) camera.up.set( u[0], u[1], u[2] );
  243. result.cameras[ dc ] = camera;
  244. }
  245. // lights
  246. var hex, intensity;
  247. for ( dl in data.lights ) {
  248. l = data.lights[ dl ];
  249. hex = ( l.color !== undefined ) ? l.color : 0xffffff;
  250. intensity = ( l.intensity !== undefined ) ? l.intensity : 1;
  251. if ( l.type == "directional" ) {
  252. p = l.direction;
  253. light = new THREE.DirectionalLight( hex, intensity );
  254. light.position.set( p[0], p[1], p[2] );
  255. light.position.normalize();
  256. } else if ( l.type == "point" ) {
  257. p = l.position;
  258. d = l.distance;
  259. light = new THREE.PointLight( hex, intensity, d );
  260. light.position.set( p[0], p[1], p[2] );
  261. } else if ( l.type == "ambient" ) {
  262. light = new THREE.AmbientLight( hex );
  263. }
  264. result.scene.add( light );
  265. result.lights[ dl ] = light;
  266. }
  267. // fogs
  268. for( df in data.fogs ) {
  269. f = data.fogs[ df ];
  270. if ( f.type == "linear" ) {
  271. fog = new THREE.Fog( 0x000000, f.near, f.far );
  272. } else if ( f.type == "exp2" ) {
  273. fog = new THREE.FogExp2( 0x000000, f.density );
  274. }
  275. c = f.color;
  276. fog.color.setRGB( c[0], c[1], c[2] );
  277. result.fogs[ df ] = fog;
  278. }
  279. // defaults
  280. if ( result.cameras && data.defaults.camera ) {
  281. result.currentCamera = result.cameras[ data.defaults.camera ];
  282. }
  283. if ( result.fogs && data.defaults.fog ) {
  284. result.scene.fog = result.fogs[ data.defaults.fog ];
  285. }
  286. c = data.defaults.bgcolor;
  287. result.bgColor = new THREE.Color();
  288. result.bgColor.setRGB( c[0], c[1], c[2] );
  289. result.bgColorAlpha = data.defaults.bgalpha;
  290. // now come potentially asynchronous elements
  291. // geometries
  292. // count how many models will be loaded asynchronously
  293. for( dg in data.geometries ) {
  294. g = data.geometries[ dg ];
  295. if ( g.type == "bin_mesh" || g.type == "ascii_mesh" ) {
  296. counter_models += 1;
  297. scope.onLoadStart();
  298. }
  299. }
  300. total_models = counter_models;
  301. for ( dg in data.geometries ) {
  302. g = data.geometries[ dg ];
  303. if ( g.type == "cube" ) {
  304. geometry = new THREE.CubeGeometry( g.width, g.height, g.depth, g.segmentsWidth, g.segmentsHeight, g.segmentsDepth, null, g.flipped, g.sides );
  305. result.geometries[ dg ] = geometry;
  306. } else if ( g.type == "plane" ) {
  307. geometry = new THREE.PlaneGeometry( g.width, g.height, g.segmentsWidth, g.segmentsHeight );
  308. result.geometries[ dg ] = geometry;
  309. } else if ( g.type == "sphere" ) {
  310. geometry = new THREE.SphereGeometry( g.radius, g.segmentsWidth, g.segmentsHeight );
  311. result.geometries[ dg ] = geometry;
  312. } else if ( g.type == "cylinder" ) {
  313. geometry = new THREE.CylinderGeometry( g.topRad, g.botRad, g.height, g.radSegs, g.heightSegs );
  314. result.geometries[ dg ] = geometry;
  315. } else if ( g.type == "torus" ) {
  316. geometry = new THREE.TorusGeometry( g.radius, g.tube, g.segmentsR, g.segmentsT );
  317. result.geometries[ dg ] = geometry;
  318. } else if ( g.type == "icosahedron" ) {
  319. geometry = new THREE.IcosahedronGeometry( g.radius, g.subdivisions );
  320. result.geometries[ dg ] = geometry;
  321. } else if ( g.type == "bin_mesh" ) {
  322. binLoader.load( get_url( g.url, data.urlBaseType ), create_callback( dg ) );
  323. } else if ( g.type == "ascii_mesh" ) {
  324. jsonLoader.load( get_url( g.url, data.urlBaseType ), create_callback( dg ) );
  325. } else if ( g.type == "embedded_mesh" ) {
  326. var modelJson = data.embeds[ g.id ],
  327. texture_path = "";
  328. // Pass metadata along to jsonLoader so it knows the format version.
  329. modelJson.metadata = data.metadata;
  330. if ( modelJson ) {
  331. jsonLoader.createModel( modelJson, create_callback_embed( dg ), texture_path );
  332. }
  333. }
  334. }
  335. // textures
  336. // count how many textures will be loaded asynchronously
  337. for( dt in data.textures ) {
  338. tt = data.textures[ dt ];
  339. if( tt.url instanceof Array ) {
  340. counter_textures += tt.url.length;
  341. for( var n = 0; n < tt.url.length; n ++ ) {
  342. scope.onLoadStart();
  343. }
  344. } else {
  345. counter_textures += 1;
  346. scope.onLoadStart();
  347. }
  348. }
  349. total_textures = counter_textures;
  350. for( dt in data.textures ) {
  351. tt = data.textures[ dt ];
  352. if ( tt.mapping != undefined && THREE[ tt.mapping ] != undefined ) {
  353. tt.mapping = new THREE[ tt.mapping ]();
  354. }
  355. if( tt.url instanceof Array ) {
  356. var url_array = [];
  357. for( var i = 0; i < tt.url.length; i ++ ) {
  358. url_array[ i ] = get_url( tt.url[ i ], data.urlBaseType );
  359. }
  360. texture = THREE.ImageUtils.loadTextureCube( url_array, tt.mapping, callbackTexture );
  361. } else {
  362. texture = THREE.ImageUtils.loadTexture( get_url( tt.url, data.urlBaseType ), tt.mapping, callbackTexture );
  363. if ( THREE[ tt.minFilter ] != undefined )
  364. texture.minFilter = THREE[ tt.minFilter ];
  365. if ( THREE[ tt.magFilter ] != undefined )
  366. texture.magFilter = THREE[ tt.magFilter ];
  367. if ( tt.repeat ) {
  368. texture.repeat.set( tt.repeat[ 0 ], tt.repeat[ 1 ] );
  369. if ( tt.repeat[ 0 ] != 1 ) texture.wrapS = THREE.RepeatWrapping;
  370. if ( tt.repeat[ 1 ] != 1 ) texture.wrapT = THREE.RepeatWrapping;
  371. }
  372. if ( tt.offset ) {
  373. texture.offset.set( tt.offset[ 0 ], tt.offset[ 1 ] );
  374. }
  375. // handle wrap after repeat so that default repeat can be overriden
  376. if ( tt.wrap ) {
  377. var wrapMap = {
  378. "repeat" : THREE.RepeatWrapping,
  379. "mirror" : THREE.MirroredRepeatWrapping
  380. }
  381. if ( wrapMap[ tt.wrap[ 0 ] ] !== undefined ) texture.wrapS = wrapMap[ tt.wrap[ 0 ] ];
  382. if ( wrapMap[ tt.wrap[ 1 ] ] !== undefined ) texture.wrapT = wrapMap[ tt.wrap[ 1 ] ];
  383. }
  384. }
  385. result.textures[ dt ] = texture;
  386. }
  387. // materials
  388. for ( dm in data.materials ) {
  389. m = data.materials[ dm ];
  390. for ( pp in m.parameters ) {
  391. if ( pp == "envMap" || pp == "map" || pp == "lightMap" ) {
  392. m.parameters[ pp ] = result.textures[ m.parameters[ pp ] ];
  393. } else if ( pp == "shading" ) {
  394. m.parameters[ pp ] = ( m.parameters[ pp ] == "flat" ) ? THREE.FlatShading : THREE.SmoothShading;
  395. } else if ( pp == "blending" ) {
  396. m.parameters[ pp ] = THREE[ m.parameters[ pp ] ] ? THREE[ m.parameters[ pp ] ] : THREE.NormalBlending;
  397. } else if ( pp == "combine" ) {
  398. m.parameters[ pp ] = ( m.parameters[ pp ] == "MixOperation" ) ? THREE.MixOperation : THREE.MultiplyOperation;
  399. } else if ( pp == "vertexColors" ) {
  400. if ( m.parameters[ pp ] == "face" ) {
  401. m.parameters[ pp ] = THREE.FaceColors;
  402. // default to vertex colors if "vertexColors" is anything else face colors or 0 / null / false
  403. } else if ( m.parameters[ pp ] ) {
  404. m.parameters[ pp ] = THREE.VertexColors;
  405. }
  406. }
  407. }
  408. if ( m.parameters.opacity !== undefined && m.parameters.opacity < 1.0 ) {
  409. m.parameters.transparent = true;
  410. }
  411. if ( m.parameters.normalMap ) {
  412. var shader = THREE.ShaderUtils.lib[ "normal" ];
  413. var uniforms = THREE.UniformsUtils.clone( shader.uniforms );
  414. var diffuse = m.parameters.color;
  415. var specular = m.parameters.specular;
  416. var ambient = m.parameters.ambient;
  417. var shininess = m.parameters.shininess;
  418. uniforms[ "tNormal" ].texture = result.textures[ m.parameters.normalMap ];
  419. if ( m.parameters.normalMapFactor ) {
  420. uniforms[ "uNormalScale" ].value = m.parameters.normalMapFactor;
  421. }
  422. if ( m.parameters.map ) {
  423. uniforms[ "tDiffuse" ].texture = m.parameters.map;
  424. uniforms[ "enableDiffuse" ].value = true;
  425. }
  426. if ( m.parameters.lightMap ) {
  427. uniforms[ "tAO" ].texture = m.parameters.lightMap;
  428. uniforms[ "enableAO" ].value = true;
  429. }
  430. if ( m.parameters.specularMap ) {
  431. uniforms[ "tSpecular" ].texture = result.textures[ m.parameters.specularMap ];
  432. uniforms[ "enableSpecular" ].value = true;
  433. }
  434. uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
  435. uniforms[ "uSpecularColor" ].value.setHex( specular );
  436. uniforms[ "uAmbientColor" ].value.setHex( ambient );
  437. uniforms[ "uShininess" ].value = shininess;
  438. if ( m.parameters.opacity ) {
  439. uniforms[ "uOpacity" ].value = m.parameters.opacity;
  440. }
  441. var parameters = { fragmentShader: shader.fragmentShader, vertexShader: shader.vertexShader, uniforms: uniforms, lights: true, fog: true };
  442. material = new THREE.ShaderMaterial( parameters );
  443. } else {
  444. material = new THREE[ m.type ]( m.parameters );
  445. }
  446. result.materials[ dm ] = material;
  447. }
  448. // objects ( synchronous init of procedural primitives )
  449. handle_objects();
  450. // synchronous callback
  451. scope.callbackSync( result );
  452. // just in case there are no async elements:
  453. async_callback_gate();
  454. };
粤ICP备19079148号