sprite-animated.mjs 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343
  1. /*!
  2. * @pixi/sprite-animated - v6.5.10
  3. * Compiled Thu, 06 Jul 2023 15:25:11 UTC
  4. *
  5. * @pixi/sprite-animated is licensed under the MIT License.
  6. * http://www.opensource.org/licenses/mit-license
  7. */
  8. import { Texture } from '@pixi/core';
  9. import { Sprite } from '@pixi/sprite';
  10. import { Ticker, UPDATE_PRIORITY } from '@pixi/ticker';
  11. /*! *****************************************************************************
  12. Copyright (c) Microsoft Corporation.
  13. Permission to use, copy, modify, and/or distribute this software for any
  14. purpose with or without fee is hereby granted.
  15. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
  16. REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
  17. AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
  18. INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
  19. LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
  20. OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
  21. PERFORMANCE OF THIS SOFTWARE.
  22. ***************************************************************************** */
  23. /* global Reflect, Promise */
  24. var extendStatics = function(d, b) {
  25. extendStatics = Object.setPrototypeOf ||
  26. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  27. function (d, b) { for (var p in b) { if (b.hasOwnProperty(p)) { d[p] = b[p]; } } };
  28. return extendStatics(d, b);
  29. };
  30. function __extends(d, b) {
  31. extendStatics(d, b);
  32. function __() { this.constructor = d; }
  33. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  34. }
  35. /**
  36. * An AnimatedSprite is a simple way to display an animation depicted by a list of textures.
  37. *
  38. * ```js
  39. * let alienImages = ["image_sequence_01.png","image_sequence_02.png","image_sequence_03.png","image_sequence_04.png"];
  40. * let textureArray = [];
  41. *
  42. * for (let i=0; i < 4; i++)
  43. * {
  44. * let texture = PIXI.Texture.from(alienImages[i]);
  45. * textureArray.push(texture);
  46. * };
  47. *
  48. * let animatedSprite = new PIXI.AnimatedSprite(textureArray);
  49. * ```
  50. *
  51. * The more efficient and simpler way to create an animated sprite is using a {@link PIXI.Spritesheet}
  52. * containing the animation definitions:
  53. *
  54. * ```js
  55. * PIXI.Loader.shared.add("assets/spritesheet.json").load(setup);
  56. *
  57. * function setup() {
  58. * let sheet = PIXI.Loader.shared.resources["assets/spritesheet.json"].spritesheet;
  59. * animatedSprite = new PIXI.AnimatedSprite(sheet.animations["image_sequence"]);
  60. * ...
  61. * }
  62. * ```
  63. * @memberof PIXI
  64. */
  65. var AnimatedSprite = /** @class */ (function (_super) {
  66. __extends(AnimatedSprite, _super);
  67. /**
  68. * @param textures - An array of {@link PIXI.Texture} or frame
  69. * objects that make up the animation.
  70. * @param {boolean} [autoUpdate=true] - Whether to use PIXI.Ticker.shared to auto update animation time.
  71. */
  72. function AnimatedSprite(textures, autoUpdate) {
  73. if (autoUpdate === void 0) { autoUpdate = true; }
  74. var _this = _super.call(this, textures[0] instanceof Texture ? textures[0] : textures[0].texture) || this;
  75. _this._textures = null;
  76. _this._durations = null;
  77. _this._autoUpdate = autoUpdate;
  78. _this._isConnectedToTicker = false;
  79. _this.animationSpeed = 1;
  80. _this.loop = true;
  81. _this.updateAnchor = false;
  82. _this.onComplete = null;
  83. _this.onFrameChange = null;
  84. _this.onLoop = null;
  85. _this._currentTime = 0;
  86. _this._playing = false;
  87. _this._previousFrame = null;
  88. _this.textures = textures;
  89. return _this;
  90. }
  91. /** Stops the AnimatedSprite. */
  92. AnimatedSprite.prototype.stop = function () {
  93. if (!this._playing) {
  94. return;
  95. }
  96. this._playing = false;
  97. if (this._autoUpdate && this._isConnectedToTicker) {
  98. Ticker.shared.remove(this.update, this);
  99. this._isConnectedToTicker = false;
  100. }
  101. };
  102. /** Plays the AnimatedSprite. */
  103. AnimatedSprite.prototype.play = function () {
  104. if (this._playing) {
  105. return;
  106. }
  107. this._playing = true;
  108. if (this._autoUpdate && !this._isConnectedToTicker) {
  109. Ticker.shared.add(this.update, this, UPDATE_PRIORITY.HIGH);
  110. this._isConnectedToTicker = true;
  111. }
  112. };
  113. /**
  114. * Stops the AnimatedSprite and goes to a specific frame.
  115. * @param frameNumber - Frame index to stop at.
  116. */
  117. AnimatedSprite.prototype.gotoAndStop = function (frameNumber) {
  118. this.stop();
  119. var previousFrame = this.currentFrame;
  120. this._currentTime = frameNumber;
  121. if (previousFrame !== this.currentFrame) {
  122. this.updateTexture();
  123. }
  124. };
  125. /**
  126. * Goes to a specific frame and begins playing the AnimatedSprite.
  127. * @param frameNumber - Frame index to start at.
  128. */
  129. AnimatedSprite.prototype.gotoAndPlay = function (frameNumber) {
  130. var previousFrame = this.currentFrame;
  131. this._currentTime = frameNumber;
  132. if (previousFrame !== this.currentFrame) {
  133. this.updateTexture();
  134. }
  135. this.play();
  136. };
  137. /**
  138. * Updates the object transform for rendering.
  139. * @param deltaTime - Time since last tick.
  140. */
  141. AnimatedSprite.prototype.update = function (deltaTime) {
  142. if (!this._playing) {
  143. return;
  144. }
  145. var elapsed = this.animationSpeed * deltaTime;
  146. var previousFrame = this.currentFrame;
  147. if (this._durations !== null) {
  148. var lag = this._currentTime % 1 * this._durations[this.currentFrame];
  149. lag += elapsed / 60 * 1000;
  150. while (lag < 0) {
  151. this._currentTime--;
  152. lag += this._durations[this.currentFrame];
  153. }
  154. var sign = Math.sign(this.animationSpeed * deltaTime);
  155. this._currentTime = Math.floor(this._currentTime);
  156. while (lag >= this._durations[this.currentFrame]) {
  157. lag -= this._durations[this.currentFrame] * sign;
  158. this._currentTime += sign;
  159. }
  160. this._currentTime += lag / this._durations[this.currentFrame];
  161. }
  162. else {
  163. this._currentTime += elapsed;
  164. }
  165. if (this._currentTime < 0 && !this.loop) {
  166. this.gotoAndStop(0);
  167. if (this.onComplete) {
  168. this.onComplete();
  169. }
  170. }
  171. else if (this._currentTime >= this._textures.length && !this.loop) {
  172. this.gotoAndStop(this._textures.length - 1);
  173. if (this.onComplete) {
  174. this.onComplete();
  175. }
  176. }
  177. else if (previousFrame !== this.currentFrame) {
  178. if (this.loop && this.onLoop) {
  179. if (this.animationSpeed > 0 && this.currentFrame < previousFrame) {
  180. this.onLoop();
  181. }
  182. else if (this.animationSpeed < 0 && this.currentFrame > previousFrame) {
  183. this.onLoop();
  184. }
  185. }
  186. this.updateTexture();
  187. }
  188. };
  189. /** Updates the displayed texture to match the current frame index. */
  190. AnimatedSprite.prototype.updateTexture = function () {
  191. var currentFrame = this.currentFrame;
  192. if (this._previousFrame === currentFrame) {
  193. return;
  194. }
  195. this._previousFrame = currentFrame;
  196. this._texture = this._textures[currentFrame];
  197. this._textureID = -1;
  198. this._textureTrimmedID = -1;
  199. this._cachedTint = 0xFFFFFF;
  200. this.uvs = this._texture._uvs.uvsFloat32;
  201. if (this.updateAnchor) {
  202. this._anchor.copyFrom(this._texture.defaultAnchor);
  203. }
  204. if (this.onFrameChange) {
  205. this.onFrameChange(this.currentFrame);
  206. }
  207. };
  208. /**
  209. * Stops the AnimatedSprite and destroys it.
  210. * @param {object|boolean} [options] - Options parameter. A boolean will act as if all options
  211. * have been set to that value.
  212. * @param {boolean} [options.children=false] - If set to true, all the children will have their destroy
  213. * method called as well. 'options' will be passed on to those calls.
  214. * @param {boolean} [options.texture=false] - Should it destroy the current texture of the sprite as well.
  215. * @param {boolean} [options.baseTexture=false] - Should it destroy the base texture of the sprite as well.
  216. */
  217. AnimatedSprite.prototype.destroy = function (options) {
  218. this.stop();
  219. _super.prototype.destroy.call(this, options);
  220. this.onComplete = null;
  221. this.onFrameChange = null;
  222. this.onLoop = null;
  223. };
  224. /**
  225. * A short hand way of creating an AnimatedSprite from an array of frame ids.
  226. * @param frames - The array of frames ids the AnimatedSprite will use as its texture frames.
  227. * @returns - The new animated sprite with the specified frames.
  228. */
  229. AnimatedSprite.fromFrames = function (frames) {
  230. var textures = [];
  231. for (var i = 0; i < frames.length; ++i) {
  232. textures.push(Texture.from(frames[i]));
  233. }
  234. return new AnimatedSprite(textures);
  235. };
  236. /**
  237. * A short hand way of creating an AnimatedSprite from an array of image ids.
  238. * @param images - The array of image urls the AnimatedSprite will use as its texture frames.
  239. * @returns The new animate sprite with the specified images as frames.
  240. */
  241. AnimatedSprite.fromImages = function (images) {
  242. var textures = [];
  243. for (var i = 0; i < images.length; ++i) {
  244. textures.push(Texture.from(images[i]));
  245. }
  246. return new AnimatedSprite(textures);
  247. };
  248. Object.defineProperty(AnimatedSprite.prototype, "totalFrames", {
  249. /**
  250. * The total number of frames in the AnimatedSprite. This is the same as number of textures
  251. * assigned to the AnimatedSprite.
  252. * @readonly
  253. * @default 0
  254. */
  255. get: function () {
  256. return this._textures.length;
  257. },
  258. enumerable: false,
  259. configurable: true
  260. });
  261. Object.defineProperty(AnimatedSprite.prototype, "textures", {
  262. /** The array of textures used for this AnimatedSprite. */
  263. get: function () {
  264. return this._textures;
  265. },
  266. set: function (value) {
  267. if (value[0] instanceof Texture) {
  268. this._textures = value;
  269. this._durations = null;
  270. }
  271. else {
  272. this._textures = [];
  273. this._durations = [];
  274. for (var i = 0; i < value.length; i++) {
  275. this._textures.push(value[i].texture);
  276. this._durations.push(value[i].time);
  277. }
  278. }
  279. this._previousFrame = null;
  280. this.gotoAndStop(0);
  281. this.updateTexture();
  282. },
  283. enumerable: false,
  284. configurable: true
  285. });
  286. Object.defineProperty(AnimatedSprite.prototype, "currentFrame", {
  287. /**
  288. * The AnimatedSprites current frame index.
  289. * @readonly
  290. */
  291. get: function () {
  292. var currentFrame = Math.floor(this._currentTime) % this._textures.length;
  293. if (currentFrame < 0) {
  294. currentFrame += this._textures.length;
  295. }
  296. return currentFrame;
  297. },
  298. enumerable: false,
  299. configurable: true
  300. });
  301. Object.defineProperty(AnimatedSprite.prototype, "playing", {
  302. /**
  303. * Indicates if the AnimatedSprite is currently playing.
  304. * @readonly
  305. */
  306. get: function () {
  307. return this._playing;
  308. },
  309. enumerable: false,
  310. configurable: true
  311. });
  312. Object.defineProperty(AnimatedSprite.prototype, "autoUpdate", {
  313. /** Whether to use PIXI.Ticker.shared to auto update animation time. */
  314. get: function () {
  315. return this._autoUpdate;
  316. },
  317. set: function (value) {
  318. if (value !== this._autoUpdate) {
  319. this._autoUpdate = value;
  320. if (!this._autoUpdate && this._isConnectedToTicker) {
  321. Ticker.shared.remove(this.update, this);
  322. this._isConnectedToTicker = false;
  323. }
  324. else if (this._autoUpdate && !this._isConnectedToTicker && this._playing) {
  325. Ticker.shared.add(this.update, this);
  326. this._isConnectedToTicker = true;
  327. }
  328. }
  329. },
  330. enumerable: false,
  331. configurable: true
  332. });
  333. return AnimatedSprite;
  334. }(Sprite));
  335. export { AnimatedSprite };
  336. //# sourceMappingURL=sprite-animated.mjs.map