animationqueue.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312
  1. // Copyright 2007 The Closure Library Authors. All Rights Reserved.
  2. //
  3. // Licensed under the Apache License, Version 2.0 (the "License");
  4. // you may not use this file except in compliance with the License.
  5. // You may obtain a copy of the License at
  6. //
  7. // http://www.apache.org/licenses/LICENSE-2.0
  8. //
  9. // Unless required by applicable law or agreed to in writing, software
  10. // distributed under the License is distributed on an "AS-IS" BASIS,
  11. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. // See the License for the specific language governing permissions and
  13. // limitations under the License.
  14. /**
  15. * @fileoverview A class which automatically plays through a queue of
  16. * animations. AnimationParallelQueue and AnimationSerialQueue provide
  17. * specific implementations of the abstract class AnimationQueue.
  18. *
  19. * @see ../demos/animationqueue.html
  20. */
  21. goog.provide('goog.fx.AnimationParallelQueue');
  22. goog.provide('goog.fx.AnimationQueue');
  23. goog.provide('goog.fx.AnimationSerialQueue');
  24. goog.require('goog.array');
  25. goog.require('goog.asserts');
  26. goog.require('goog.events');
  27. goog.require('goog.fx.Animation');
  28. goog.require('goog.fx.Transition');
  29. goog.require('goog.fx.TransitionBase');
  30. /**
  31. * Constructor for AnimationQueue object.
  32. *
  33. * @constructor
  34. * @struct
  35. * @extends {goog.fx.TransitionBase}
  36. */
  37. goog.fx.AnimationQueue = function() {
  38. goog.fx.AnimationQueue.base(this, 'constructor');
  39. /**
  40. * An array holding all animations in the queue.
  41. * @type {Array<goog.fx.TransitionBase>}
  42. * @protected
  43. */
  44. this.queue = [];
  45. };
  46. goog.inherits(goog.fx.AnimationQueue, goog.fx.TransitionBase);
  47. /**
  48. * Pushes an Animation to the end of the queue.
  49. * @param {goog.fx.TransitionBase} animation The animation to add to the queue.
  50. */
  51. goog.fx.AnimationQueue.prototype.add = function(animation) {
  52. goog.asserts.assert(
  53. this.isStopped(),
  54. 'Not allowed to add animations to a running animation queue.');
  55. if (goog.array.contains(this.queue, animation)) {
  56. return;
  57. }
  58. this.queue.push(animation);
  59. goog.events.listen(
  60. animation, goog.fx.Transition.EventType.FINISH, this.onAnimationFinish,
  61. false, this);
  62. };
  63. /**
  64. * Removes an Animation from the queue.
  65. * @param {goog.fx.Animation} animation The animation to remove.
  66. */
  67. goog.fx.AnimationQueue.prototype.remove = function(animation) {
  68. goog.asserts.assert(
  69. this.isStopped(),
  70. 'Not allowed to remove animations from a running animation queue.');
  71. if (goog.array.remove(this.queue, animation)) {
  72. goog.events.unlisten(
  73. animation, goog.fx.Transition.EventType.FINISH, this.onAnimationFinish,
  74. false, this);
  75. }
  76. };
  77. /**
  78. * Handles the event that an animation has finished.
  79. * @param {goog.events.Event} e The finishing event.
  80. * @protected
  81. */
  82. goog.fx.AnimationQueue.prototype.onAnimationFinish = goog.abstractMethod;
  83. /**
  84. * Disposes of the animations.
  85. * @override
  86. */
  87. goog.fx.AnimationQueue.prototype.disposeInternal = function() {
  88. goog.array.forEach(this.queue, function(animation) { animation.dispose(); });
  89. this.queue.length = 0;
  90. goog.fx.AnimationQueue.base(this, 'disposeInternal');
  91. };
  92. /**
  93. * Constructor for AnimationParallelQueue object.
  94. * @constructor
  95. * @struct
  96. * @extends {goog.fx.AnimationQueue}
  97. */
  98. goog.fx.AnimationParallelQueue = function() {
  99. goog.fx.AnimationParallelQueue.base(this, 'constructor');
  100. /**
  101. * Number of finished animations.
  102. * @type {number}
  103. * @private
  104. */
  105. this.finishedCounter_ = 0;
  106. };
  107. goog.inherits(goog.fx.AnimationParallelQueue, goog.fx.AnimationQueue);
  108. /** @override */
  109. goog.fx.AnimationParallelQueue.prototype.play = function(opt_restart) {
  110. if (this.queue.length == 0) {
  111. return false;
  112. }
  113. if (opt_restart || this.isStopped()) {
  114. this.finishedCounter_ = 0;
  115. this.onBegin();
  116. } else if (this.isPlaying()) {
  117. return false;
  118. }
  119. this.onPlay();
  120. if (this.isPaused()) {
  121. this.onResume();
  122. }
  123. var resuming = this.isPaused() && !opt_restart;
  124. this.startTime = goog.now();
  125. this.endTime = null;
  126. this.setStatePlaying();
  127. goog.array.forEach(this.queue, function(anim) {
  128. if (!resuming || anim.isPaused()) {
  129. anim.play(opt_restart);
  130. }
  131. });
  132. return true;
  133. };
  134. /** @override */
  135. goog.fx.AnimationParallelQueue.prototype.pause = function() {
  136. if (this.isPlaying()) {
  137. goog.array.forEach(this.queue, function(anim) {
  138. if (anim.isPlaying()) {
  139. anim.pause();
  140. }
  141. });
  142. this.setStatePaused();
  143. this.onPause();
  144. }
  145. };
  146. /** @override */
  147. goog.fx.AnimationParallelQueue.prototype.stop = function(opt_gotoEnd) {
  148. goog.array.forEach(this.queue, function(anim) {
  149. if (!anim.isStopped()) {
  150. anim.stop(opt_gotoEnd);
  151. }
  152. });
  153. this.setStateStopped();
  154. this.endTime = goog.now();
  155. this.onStop();
  156. this.onEnd();
  157. };
  158. /** @override */
  159. goog.fx.AnimationParallelQueue.prototype.onAnimationFinish = function(e) {
  160. this.finishedCounter_++;
  161. if (this.finishedCounter_ == this.queue.length) {
  162. this.endTime = goog.now();
  163. this.setStateStopped();
  164. this.onFinish();
  165. this.onEnd();
  166. }
  167. };
  168. /**
  169. * Constructor for AnimationSerialQueue object.
  170. * @constructor
  171. * @struct
  172. * @extends {goog.fx.AnimationQueue}
  173. */
  174. goog.fx.AnimationSerialQueue = function() {
  175. goog.fx.AnimationSerialQueue.base(this, 'constructor');
  176. /**
  177. * Current animation in queue currently active.
  178. * @type {number}
  179. * @private
  180. */
  181. this.current_ = 0;
  182. };
  183. goog.inherits(goog.fx.AnimationSerialQueue, goog.fx.AnimationQueue);
  184. /** @override */
  185. goog.fx.AnimationSerialQueue.prototype.play = function(opt_restart) {
  186. if (this.queue.length == 0) {
  187. return false;
  188. }
  189. if (opt_restart || this.isStopped()) {
  190. if (this.current_ < this.queue.length &&
  191. !this.queue[this.current_].isStopped()) {
  192. this.queue[this.current_].stop(false);
  193. }
  194. this.current_ = 0;
  195. this.onBegin();
  196. } else if (this.isPlaying()) {
  197. return false;
  198. }
  199. this.onPlay();
  200. if (this.isPaused()) {
  201. this.onResume();
  202. }
  203. this.startTime = goog.now();
  204. this.endTime = null;
  205. this.setStatePlaying();
  206. this.queue[this.current_].play(opt_restart);
  207. return true;
  208. };
  209. /** @override */
  210. goog.fx.AnimationSerialQueue.prototype.pause = function() {
  211. if (this.isPlaying()) {
  212. this.queue[this.current_].pause();
  213. this.setStatePaused();
  214. this.onPause();
  215. }
  216. };
  217. /** @override */
  218. goog.fx.AnimationSerialQueue.prototype.stop = function(opt_gotoEnd) {
  219. this.setStateStopped();
  220. this.endTime = goog.now();
  221. if (opt_gotoEnd) {
  222. for (var i = this.current_; i < this.queue.length; ++i) {
  223. var anim = this.queue[i];
  224. // If the animation is stopped, start it to initiate rendering. This
  225. // might be needed to make the next line work.
  226. if (anim.isStopped()) anim.play();
  227. // If the animation is not done, stop it and go to the end state of the
  228. // animation.
  229. if (!anim.isStopped()) anim.stop(true);
  230. }
  231. } else if (this.current_ < this.queue.length) {
  232. this.queue[this.current_].stop(false);
  233. }
  234. this.onStop();
  235. this.onEnd();
  236. };
  237. /** @override */
  238. goog.fx.AnimationSerialQueue.prototype.onAnimationFinish = function(e) {
  239. if (this.isPlaying()) {
  240. this.current_++;
  241. if (this.current_ < this.queue.length) {
  242. this.queue[this.current_].play();
  243. } else {
  244. this.endTime = goog.now();
  245. this.setStateStopped();
  246. this.onFinish();
  247. this.onEnd();
  248. }
  249. }
  250. };