babylon.animation.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393
  1. var BABYLON;
  2. (function (BABYLON) {
  3. var Animation = (function () {
  4. function Animation(name, targetProperty, framePerSecond, dataType, loopMode) {
  5. this.name = name;
  6. this.targetProperty = targetProperty;
  7. this.framePerSecond = framePerSecond;
  8. this.dataType = dataType;
  9. this.loopMode = loopMode;
  10. this._offsetsCache = {};
  11. this._highLimitsCache = {};
  12. this._stopped = false;
  13. this.targetPropertyPath = targetProperty.split(".");
  14. this.dataType = dataType;
  15. this.loopMode = loopMode === undefined ? Animation.ANIMATIONLOOPMODE_CYCLE : loopMode;
  16. }
  17. Animation.CreateAndStartAnimation = function (name, mesh, tartgetProperty, framePerSecond, totalFrame, from, to, loopMode) {
  18. var dataType = undefined;
  19. if (!isNaN(parseFloat(from)) && isFinite(from)) {
  20. dataType = Animation.ANIMATIONTYPE_FLOAT;
  21. } else if (from instanceof BABYLON.Quaternion) {
  22. dataType = Animation.ANIMATIONTYPE_QUATERNION;
  23. } else if (from instanceof BABYLON.Vector3) {
  24. dataType = Animation.ANIMATIONTYPE_VECTOR3;
  25. } else if (from instanceof BABYLON.Vector2) {
  26. dataType = Animation.ANIMATIONTYPE_VECTOR2;
  27. } else if (from instanceof BABYLON.Color3) {
  28. dataType = Animation.ANIMATIONTYPE_COLOR3;
  29. }
  30. if (dataType == undefined) {
  31. return;
  32. }
  33. var animation = new Animation(name, tartgetProperty, framePerSecond, dataType, loopMode);
  34. var keys = [];
  35. keys.push({ frame: 0, value: from });
  36. keys.push({ frame: totalFrame, value: to });
  37. animation.setKeys(keys);
  38. mesh.animations.push(animation);
  39. mesh.getScene().beginAnimation(mesh, 0, totalFrame, (animation.loopMode == 1));
  40. };
  41. // Methods
  42. Animation.prototype.isStopped = function () {
  43. return this._stopped;
  44. };
  45. Animation.prototype.getKeys = function () {
  46. return this._keys;
  47. };
  48. Animation.prototype.getEasingFunction = function () {
  49. return this._easingFunction;
  50. };
  51. Animation.prototype.setEasingFunction = function (easingFunction) {
  52. this._easingFunction = easingFunction;
  53. };
  54. Animation.prototype.floatInterpolateFunction = function (startValue, endValue, gradient) {
  55. return startValue + (endValue - startValue) * gradient;
  56. };
  57. Animation.prototype.quaternionInterpolateFunction = function (startValue, endValue, gradient) {
  58. return BABYLON.Quaternion.Slerp(startValue, endValue, gradient);
  59. };
  60. Animation.prototype.vector3InterpolateFunction = function (startValue, endValue, gradient) {
  61. return BABYLON.Vector3.Lerp(startValue, endValue, gradient);
  62. };
  63. Animation.prototype.vector2InterpolateFunction = function (startValue, endValue, gradient) {
  64. return BABYLON.Vector2.Lerp(startValue, endValue, gradient);
  65. };
  66. Animation.prototype.color3InterpolateFunction = function (startValue, endValue, gradient) {
  67. return BABYLON.Color3.Lerp(startValue, endValue, gradient);
  68. };
  69. Animation.prototype.clone = function () {
  70. var clone = new Animation(this.name, this.targetPropertyPath.join("."), this.framePerSecond, this.dataType, this.loopMode);
  71. clone.setKeys(this._keys);
  72. return clone;
  73. };
  74. Animation.prototype.setKeys = function (values) {
  75. this._keys = values.slice(0);
  76. this._offsetsCache = {};
  77. this._highLimitsCache = {};
  78. };
  79. Animation.prototype._interpolate = function (currentFrame, repeatCount, loopMode, offsetValue, highLimitValue) {
  80. if (loopMode === Animation.ANIMATIONLOOPMODE_CONSTANT && repeatCount > 0) {
  81. return highLimitValue.clone ? highLimitValue.clone() : highLimitValue;
  82. }
  83. this.currentFrame = currentFrame;
  84. for (var key = 0; key < this._keys.length; key++) {
  85. // for each frame, we need the key just before the frame superior
  86. if (this._keys[key + 1].frame >= currentFrame) {
  87. var startValue = this._keys[key].value;
  88. var endValue = this._keys[key + 1].value;
  89. // gradient : percent of currentFrame between the frame inf and the frame sup
  90. var gradient = (currentFrame - this._keys[key].frame) / (this._keys[key + 1].frame - this._keys[key].frame);
  91. // check for easingFunction and correction of gradient
  92. if (this._easingFunction != null) {
  93. gradient = this._easingFunction.ease(gradient);
  94. }
  95. switch (this.dataType) {
  96. case Animation.ANIMATIONTYPE_FLOAT:
  97. switch (loopMode) {
  98. case Animation.ANIMATIONLOOPMODE_CYCLE:
  99. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  100. return this.floatInterpolateFunction(startValue, endValue, gradient);
  101. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  102. return offsetValue * repeatCount + this.floatInterpolateFunction(startValue, endValue, gradient);
  103. }
  104. break;
  105. case Animation.ANIMATIONTYPE_QUATERNION:
  106. var quaternion = null;
  107. switch (loopMode) {
  108. case Animation.ANIMATIONLOOPMODE_CYCLE:
  109. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  110. quaternion = this.quaternionInterpolateFunction(startValue, endValue, gradient);
  111. break;
  112. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  113. quaternion = this.quaternionInterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
  114. break;
  115. }
  116. return quaternion;
  117. case Animation.ANIMATIONTYPE_VECTOR3:
  118. switch (loopMode) {
  119. case Animation.ANIMATIONLOOPMODE_CYCLE:
  120. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  121. return this.vector3InterpolateFunction(startValue, endValue, gradient);
  122. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  123. return this.vector3InterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
  124. }
  125. case Animation.ANIMATIONTYPE_VECTOR2:
  126. switch (loopMode) {
  127. case Animation.ANIMATIONLOOPMODE_CYCLE:
  128. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  129. return this.vector2InterpolateFunction(startValue, endValue, gradient);
  130. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  131. return this.vector2InterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
  132. }
  133. case Animation.ANIMATIONTYPE_COLOR3:
  134. switch (loopMode) {
  135. case Animation.ANIMATIONLOOPMODE_CYCLE:
  136. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  137. return this.color3InterpolateFunction(startValue, endValue, gradient);
  138. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  139. return this.color3InterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
  140. }
  141. case Animation.ANIMATIONTYPE_MATRIX:
  142. switch (loopMode) {
  143. case Animation.ANIMATIONLOOPMODE_CYCLE:
  144. case Animation.ANIMATIONLOOPMODE_CONSTANT:
  145. case Animation.ANIMATIONLOOPMODE_RELATIVE:
  146. return startValue;
  147. }
  148. default:
  149. break;
  150. }
  151. break;
  152. }
  153. }
  154. return this._keys[this._keys.length - 1].value;
  155. };
  156. Animation.prototype.animate = function (delay, from, to, loop, speedRatio) {
  157. if (!this.targetPropertyPath || this.targetPropertyPath.length < 1) {
  158. this._stopped = true;
  159. return false;
  160. }
  161. var returnValue = true;
  162. // Adding a start key at frame 0 if missing
  163. if (this._keys[0].frame != 0) {
  164. var newKey = { frame: 0, value: this._keys[0].value };
  165. this._keys.splice(0, 0, newKey);
  166. }
  167. // Check limits
  168. if (from < this._keys[0].frame || from > this._keys[this._keys.length - 1].frame) {
  169. from = this._keys[0].frame;
  170. }
  171. if (to < this._keys[0].frame || to > this._keys[this._keys.length - 1].frame) {
  172. to = this._keys[this._keys.length - 1].frame;
  173. }
  174. // Compute ratio
  175. var range = to - from;
  176. var offsetValue;
  177. // ratio represents the frame delta between from and to
  178. var ratio = delay * (this.framePerSecond * speedRatio) / 1000.0;
  179. if (ratio > range && !loop) {
  180. returnValue = false;
  181. highLimitValue = this._keys[this._keys.length - 1].value;
  182. } else {
  183. // Get max value if required
  184. var highLimitValue = 0;
  185. if (this.loopMode != Animation.ANIMATIONLOOPMODE_CYCLE) {
  186. var keyOffset = to.toString() + from.toString();
  187. if (!this._offsetsCache[keyOffset]) {
  188. var fromValue = this._interpolate(from, 0, Animation.ANIMATIONLOOPMODE_CYCLE);
  189. var toValue = this._interpolate(to, 0, Animation.ANIMATIONLOOPMODE_CYCLE);
  190. switch (this.dataType) {
  191. case Animation.ANIMATIONTYPE_FLOAT:
  192. this._offsetsCache[keyOffset] = toValue - fromValue;
  193. break;
  194. case Animation.ANIMATIONTYPE_QUATERNION:
  195. this._offsetsCache[keyOffset] = toValue.subtract(fromValue);
  196. break;
  197. case Animation.ANIMATIONTYPE_VECTOR3:
  198. this._offsetsCache[keyOffset] = toValue.subtract(fromValue);
  199. case Animation.ANIMATIONTYPE_VECTOR2:
  200. this._offsetsCache[keyOffset] = toValue.subtract(fromValue);
  201. case Animation.ANIMATIONTYPE_COLOR3:
  202. this._offsetsCache[keyOffset] = toValue.subtract(fromValue);
  203. default:
  204. break;
  205. }
  206. this._highLimitsCache[keyOffset] = toValue;
  207. }
  208. highLimitValue = this._highLimitsCache[keyOffset];
  209. offsetValue = this._offsetsCache[keyOffset];
  210. }
  211. }
  212. if (offsetValue === undefined) {
  213. switch (this.dataType) {
  214. case Animation.ANIMATIONTYPE_FLOAT:
  215. offsetValue = 0;
  216. break;
  217. case Animation.ANIMATIONTYPE_QUATERNION:
  218. offsetValue = new BABYLON.Quaternion(0, 0, 0, 0);
  219. break;
  220. case Animation.ANIMATIONTYPE_VECTOR3:
  221. offsetValue = BABYLON.Vector3.Zero();
  222. break;
  223. case Animation.ANIMATIONTYPE_VECTOR2:
  224. offsetValue = BABYLON.Vector2.Zero();
  225. break;
  226. case Animation.ANIMATIONTYPE_COLOR3:
  227. offsetValue = BABYLON.Color3.Black();
  228. }
  229. }
  230. // Compute value
  231. var repeatCount = (ratio / range) >> 0;
  232. var currentFrame = returnValue ? from + ratio % range : to;
  233. var currentValue = this._interpolate(currentFrame, repeatCount, this.loopMode, offsetValue, highLimitValue);
  234. // Set value
  235. if (this.targetPropertyPath.length > 1) {
  236. var property = this._target[this.targetPropertyPath[0]];
  237. for (var index = 1; index < this.targetPropertyPath.length - 1; index++) {
  238. property = property[this.targetPropertyPath[index]];
  239. }
  240. property[this.targetPropertyPath[this.targetPropertyPath.length - 1]] = currentValue;
  241. } else {
  242. this._target[this.targetPropertyPath[0]] = currentValue;
  243. }
  244. if (this._target.markAsDirty) {
  245. this._target.markAsDirty(this.targetProperty);
  246. }
  247. if (!returnValue) {
  248. this._stopped = true;
  249. }
  250. return returnValue;
  251. };
  252. Object.defineProperty(Animation, "ANIMATIONTYPE_FLOAT", {
  253. get: function () {
  254. return Animation._ANIMATIONTYPE_FLOAT;
  255. },
  256. enumerable: true,
  257. configurable: true
  258. });
  259. Object.defineProperty(Animation, "ANIMATIONTYPE_VECTOR3", {
  260. get: function () {
  261. return Animation._ANIMATIONTYPE_VECTOR3;
  262. },
  263. enumerable: true,
  264. configurable: true
  265. });
  266. Object.defineProperty(Animation, "ANIMATIONTYPE_VECTOR2", {
  267. get: function () {
  268. return Animation._ANIMATIONTYPE_VECTOR2;
  269. },
  270. enumerable: true,
  271. configurable: true
  272. });
  273. Object.defineProperty(Animation, "ANIMATIONTYPE_QUATERNION", {
  274. get: function () {
  275. return Animation._ANIMATIONTYPE_QUATERNION;
  276. },
  277. enumerable: true,
  278. configurable: true
  279. });
  280. Object.defineProperty(Animation, "ANIMATIONTYPE_MATRIX", {
  281. get: function () {
  282. return Animation._ANIMATIONTYPE_MATRIX;
  283. },
  284. enumerable: true,
  285. configurable: true
  286. });
  287. Object.defineProperty(Animation, "ANIMATIONTYPE_COLOR3", {
  288. get: function () {
  289. return Animation._ANIMATIONTYPE_COLOR3;
  290. },
  291. enumerable: true,
  292. configurable: true
  293. });
  294. Object.defineProperty(Animation, "ANIMATIONLOOPMODE_RELATIVE", {
  295. get: function () {
  296. return Animation._ANIMATIONLOOPMODE_RELATIVE;
  297. },
  298. enumerable: true,
  299. configurable: true
  300. });
  301. Object.defineProperty(Animation, "ANIMATIONLOOPMODE_CYCLE", {
  302. get: function () {
  303. return Animation._ANIMATIONLOOPMODE_CYCLE;
  304. },
  305. enumerable: true,
  306. configurable: true
  307. });
  308. Object.defineProperty(Animation, "ANIMATIONLOOPMODE_CONSTANT", {
  309. get: function () {
  310. return Animation._ANIMATIONLOOPMODE_CONSTANT;
  311. },
  312. enumerable: true,
  313. configurable: true
  314. });
  315. Animation._ANIMATIONTYPE_FLOAT = 0;
  316. Animation._ANIMATIONTYPE_VECTOR3 = 1;
  317. Animation._ANIMATIONTYPE_QUATERNION = 2;
  318. Animation._ANIMATIONTYPE_MATRIX = 3;
  319. Animation._ANIMATIONTYPE_COLOR3 = 4;
  320. Animation._ANIMATIONTYPE_VECTOR2 = 5;
  321. Animation._ANIMATIONLOOPMODE_RELATIVE = 0;
  322. Animation._ANIMATIONLOOPMODE_CYCLE = 1;
  323. Animation._ANIMATIONLOOPMODE_CONSTANT = 2;
  324. return Animation;
  325. })();
  326. BABYLON.Animation = Animation;
  327. })(BABYLON || (BABYLON = {}));
  328. //# sourceMappingURL=babylon.animation.js.map