Animation.js 9.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407
  1. /**
  2. * @author mikael emtinger / http://gomo.se/
  3. * @author mrdoob / http://mrdoob.com/
  4. * @author alteredq / http://alteredqualia.com/
  5. */
  6. THREE.Animation = function ( root, data ) {
  7. this.root = root;
  8. this.data = THREE.AnimationHandler.init( data );
  9. this.hierarchy = THREE.AnimationHandler.parse( root );
  10. this.currentTime = 0;
  11. this.timeScale = 1;
  12. this.isPlaying = false;
  13. this.loop = true;
  14. this.weight = 0;
  15. this.interpolationType = THREE.AnimationHandler.LINEAR;
  16. };
  17. THREE.Animation.prototype = {
  18. constructor: THREE.Animation,
  19. keyTypes: [ "pos", "rot", "scl" ],
  20. play: function ( startTime, weight ) {
  21. this.currentTime = startTime !== undefined ? startTime : 0;
  22. this.weight = weight !== undefined ? weight : 1;
  23. this.isPlaying = true;
  24. this.reset();
  25. THREE.AnimationHandler.play( this );
  26. },
  27. stop: function() {
  28. this.isPlaying = false;
  29. THREE.AnimationHandler.stop( this );
  30. },
  31. reset: function () {
  32. for ( var h = 0, hl = this.hierarchy.length; h < hl; h ++ ) {
  33. var object = this.hierarchy[ h ];
  34. if ( object.animationCache === undefined ) {
  35. object.animationCache = {
  36. animations: {},
  37. blending: {
  38. positionWeight: 0.0,
  39. quaternionWeight: 0.0,
  40. scaleWeight: 0.0
  41. }
  42. };
  43. }
  44. var name = this.data.name;
  45. var animations = object.animationCache.animations;
  46. var animationCache = animations[ name ];
  47. if ( animationCache === undefined ) {
  48. animationCache = {
  49. prevKey: { pos: 0, rot: 0, scl: 0 },
  50. nextKey: { pos: 0, rot: 0, scl: 0 },
  51. originalMatrix: object.matrix
  52. };
  53. animations[ name ] = animationCache;
  54. }
  55. // Get keys to match our current time
  56. for ( var t = 0; t < 3; t ++ ) {
  57. var type = this.keyTypes[ t ];
  58. var prevKey = this.data.hierarchy[ h ].keys[ 0 ];
  59. var nextKey = this.getNextKeyWith( type, h, 1 );
  60. while ( nextKey.time < this.currentTime && nextKey.index > prevKey.index ) {
  61. prevKey = nextKey;
  62. nextKey = this.getNextKeyWith( type, h, nextKey.index + 1 );
  63. }
  64. animationCache.prevKey[ type ] = prevKey;
  65. animationCache.nextKey[ type ] = nextKey;
  66. }
  67. }
  68. },
  69. resetBlendWeights: function () {
  70. for ( var h = 0, hl = this.hierarchy.length; h < hl; h ++ ) {
  71. var object = this.hierarchy[ h ];
  72. var animationCache = object.animationCache;
  73. if ( animationCache !== undefined ) {
  74. var blending = animationCache.blending;
  75. blending.positionWeight = 0.0;
  76. blending.quaternionWeight = 0.0;
  77. blending.scaleWeight = 0.0;
  78. }
  79. }
  80. },
  81. update: ( function() {
  82. var points = [];
  83. var target = new THREE.Vector3();
  84. var newVector = new THREE.Vector3();
  85. var newQuat = new THREE.Quaternion();
  86. // Catmull-Rom spline
  87. var interpolateCatmullRom = function ( points, scale ) {
  88. var c = [], v3 = [],
  89. point, intPoint, weight, w2, w3,
  90. pa, pb, pc, pd;
  91. point = ( points.length - 1 ) * scale;
  92. intPoint = Math.floor( point );
  93. weight = point - intPoint;
  94. c[ 0 ] = intPoint === 0 ? intPoint : intPoint - 1;
  95. c[ 1 ] = intPoint;
  96. c[ 2 ] = intPoint > points.length - 2 ? intPoint : intPoint + 1;
  97. c[ 3 ] = intPoint > points.length - 3 ? intPoint : intPoint + 2;
  98. pa = points[ c[ 0 ] ];
  99. pb = points[ c[ 1 ] ];
  100. pc = points[ c[ 2 ] ];
  101. pd = points[ c[ 3 ] ];
  102. w2 = weight * weight;
  103. w3 = weight * w2;
  104. v3[ 0 ] = interpolate( pa[ 0 ], pb[ 0 ], pc[ 0 ], pd[ 0 ], weight, w2, w3 );
  105. v3[ 1 ] = interpolate( pa[ 1 ], pb[ 1 ], pc[ 1 ], pd[ 1 ], weight, w2, w3 );
  106. v3[ 2 ] = interpolate( pa[ 2 ], pb[ 2 ], pc[ 2 ], pd[ 2 ], weight, w2, w3 );
  107. return v3;
  108. };
  109. var interpolate = function ( p0, p1, p2, p3, t, t2, t3 ) {
  110. var v0 = ( p2 - p0 ) * 0.5,
  111. v1 = ( p3 - p1 ) * 0.5;
  112. return ( 2 * ( p1 - p2 ) + v0 + v1 ) * t3 + ( - 3 * ( p1 - p2 ) - 2 * v0 - v1 ) * t2 + v0 * t + p1;
  113. };
  114. return function ( delta ) {
  115. if ( this.isPlaying === false ) return;
  116. this.currentTime += delta * this.timeScale;
  117. if ( this.weight === 0 )
  118. return;
  119. //
  120. var duration = this.data.length;
  121. if ( this.currentTime > duration || this.currentTime < 0 ) {
  122. if ( this.loop ) {
  123. this.currentTime %= duration;
  124. if ( this.currentTime < 0 )
  125. this.currentTime += duration;
  126. this.reset();
  127. } else {
  128. this.stop();
  129. }
  130. }
  131. for ( var h = 0, hl = this.hierarchy.length; h < hl; h ++ ) {
  132. var object = this.hierarchy[ h ];
  133. var animationCache = object.animationCache.animations[ this.data.name ];
  134. var blending = object.animationCache.blending;
  135. // loop through pos/rot/scl
  136. for ( var t = 0; t < 3; t ++ ) {
  137. // get keys
  138. var type = this.keyTypes[ t ];
  139. var prevKey = animationCache.prevKey[ type ];
  140. var nextKey = animationCache.nextKey[ type ];
  141. if ( ( this.timeScale > 0 && nextKey.time <= this.currentTime ) ||
  142. ( this.timeScale < 0 && prevKey.time >= this.currentTime ) ) {
  143. prevKey = this.data.hierarchy[ h ].keys[ 0 ];
  144. nextKey = this.getNextKeyWith( type, h, 1 );
  145. while ( nextKey.time < this.currentTime && nextKey.index > prevKey.index ) {
  146. prevKey = nextKey;
  147. nextKey = this.getNextKeyWith( type, h, nextKey.index + 1 );
  148. }
  149. animationCache.prevKey[ type ] = prevKey;
  150. animationCache.nextKey[ type ] = nextKey;
  151. }
  152. var scale = ( this.currentTime - prevKey.time ) / ( nextKey.time - prevKey.time );
  153. var prevXYZ = prevKey[ type ];
  154. var nextXYZ = nextKey[ type ];
  155. if ( scale < 0 ) scale = 0;
  156. if ( scale > 1 ) scale = 1;
  157. // interpolate
  158. if ( type === "pos" ) {
  159. if ( this.interpolationType === THREE.AnimationHandler.LINEAR ) {
  160. newVector.x = prevXYZ[ 0 ] + ( nextXYZ[ 0 ] - prevXYZ[ 0 ] ) * scale;
  161. newVector.y = prevXYZ[ 1 ] + ( nextXYZ[ 1 ] - prevXYZ[ 1 ] ) * scale;
  162. newVector.z = prevXYZ[ 2 ] + ( nextXYZ[ 2 ] - prevXYZ[ 2 ] ) * scale;
  163. // blend
  164. var proportionalWeight = this.weight / ( this.weight + blending.positionWeight );
  165. object.position.lerp( newVector, proportionalWeight );
  166. blending.positionWeight += this.weight;
  167. } else if ( this.interpolationType === THREE.AnimationHandler.CATMULLROM ||
  168. this.interpolationType === THREE.AnimationHandler.CATMULLROM_FORWARD ) {
  169. points[ 0 ] = this.getPrevKeyWith( "pos", h, prevKey.index - 1 )[ "pos" ];
  170. points[ 1 ] = prevXYZ;
  171. points[ 2 ] = nextXYZ;
  172. points[ 3 ] = this.getNextKeyWith( "pos", h, nextKey.index + 1 )[ "pos" ];
  173. scale = scale * 0.33 + 0.33;
  174. var currentPoint = interpolateCatmullRom( points, scale );
  175. var proportionalWeight = this.weight / ( this.weight + blending.positionWeight );
  176. blending.positionWeight += this.weight;
  177. // blend
  178. var vector = object.position;
  179. vector.x = vector.x + ( currentPoint[ 0 ] - vector.x ) * proportionalWeight;
  180. vector.y = vector.y + ( currentPoint[ 1 ] - vector.y ) * proportionalWeight;
  181. vector.z = vector.z + ( currentPoint[ 2 ] - vector.z ) * proportionalWeight;
  182. if ( this.interpolationType === THREE.AnimationHandler.CATMULLROM_FORWARD ) {
  183. var forwardPoint = interpolateCatmullRom( points, scale * 1.01 );
  184. target.set( forwardPoint[ 0 ], forwardPoint[ 1 ], forwardPoint[ 2 ] );
  185. target.sub( vector );
  186. target.y = 0;
  187. target.normalize();
  188. var angle = Math.atan2( target.x, target.z );
  189. object.rotation.set( 0, angle, 0 );
  190. }
  191. }
  192. } else if ( type === "rot" ) {
  193. THREE.Quaternion.slerp( prevXYZ, nextXYZ, newQuat, scale );
  194. // Avoid paying the cost of an additional slerp if we don't have to
  195. if ( blending.quaternionWeight === 0 ) {
  196. object.quaternion.copy( newQuat );
  197. blending.quaternionWeight = this.weight;
  198. } else {
  199. var proportionalWeight = this.weight / ( this.weight + blending.quaternionWeight );
  200. THREE.Quaternion.slerp( object.quaternion, newQuat, object.quaternion, proportionalWeight );
  201. blending.quaternionWeight += this.weight;
  202. }
  203. } else if ( type === "scl" ) {
  204. newVector.x = prevXYZ[ 0 ] + ( nextXYZ[ 0 ] - prevXYZ[ 0 ] ) * scale;
  205. newVector.y = prevXYZ[ 1 ] + ( nextXYZ[ 1 ] - prevXYZ[ 1 ] ) * scale;
  206. newVector.z = prevXYZ[ 2 ] + ( nextXYZ[ 2 ] - prevXYZ[ 2 ] ) * scale;
  207. var proportionalWeight = this.weight / ( this.weight + blending.scaleWeight );
  208. object.scale.lerp( newVector, proportionalWeight );
  209. blending.scaleWeight += this.weight;
  210. }
  211. }
  212. }
  213. return true;
  214. };
  215. } )(),
  216. getNextKeyWith: function ( type, h, key ) {
  217. var keys = this.data.hierarchy[ h ].keys;
  218. if ( this.interpolationType === THREE.AnimationHandler.CATMULLROM ||
  219. this.interpolationType === THREE.AnimationHandler.CATMULLROM_FORWARD ) {
  220. key = key < keys.length - 1 ? key : keys.length - 1;
  221. } else {
  222. key = key % keys.length;
  223. }
  224. for ( ; key < keys.length; key ++ ) {
  225. if ( keys[ key ][ type ] !== undefined ) {
  226. return keys[ key ];
  227. }
  228. }
  229. return this.data.hierarchy[ h ].keys[ 0 ];
  230. },
  231. getPrevKeyWith: function ( type, h, key ) {
  232. var keys = this.data.hierarchy[ h ].keys;
  233. if ( this.interpolationType === THREE.AnimationHandler.CATMULLROM ||
  234. this.interpolationType === THREE.AnimationHandler.CATMULLROM_FORWARD ) {
  235. key = key > 0 ? key : 0;
  236. } else {
  237. key = key >= 0 ? key : key + keys.length;
  238. }
  239. for ( ; key >= 0; key -- ) {
  240. if ( keys[ key ][ type ] !== undefined ) {
  241. return keys[ key ];
  242. }
  243. }
  244. return this.data.hierarchy[ h ].keys[ keys.length - 1 ];
  245. }
  246. };