analytics/webcontent/bi/js/storytelling/util/AnimationHelper.js

'use strict';

/**
 * Licensed Materials - Property of IBM
 * IBM Cognos Products: Storytelling
 * (C) Copyright IBM Corp. 2017, 2018
 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 */
define(['baglass/core-client/js/core-client/ui/core/Class', 'baglass/core-client/js/core-client/utils/BrowserUtils'], function (Class, BrowserUtils) {

	var AnimationHelper = Class.extend({

		// Not zero for IE on Windows 10. Bug reporeted to Microsoft.
		SCALE_ZERO: BrowserUtils.isIE() ? 'scale(0.00001)' : 'scale(0)',
		/**
   * Allows the browser to animate the properties in animationCSS using the 'transition' property.
   *
   * the caller must provide the transition values in the css parameter/
   *
   *@param {jquery} $el - the element to animate.
   *@param {object} css - CSS properties.
   *	ex:
   *	{
   *		opacity: 1,
   *		transition: "opacity 1s"
   *	}
   *@returns promise that is resolved when the animation is done.
   */
		Animate: function Animate($el, css) {
			var isResolved = false;

			if (!$el || !$el.length || !css) {
				return Promise.resolve();
			}

			return new Promise(function (resolve) {
				var transitionend = function transitionend(event) {
					isResolved = true;
					resolve();
					event.target.removeEventListener('transitionend', transitionend);
				};

				// Set a timeout so that if the animation doesn't complete for some reason, all of the
				// code waiting for this promise to resolve isn't held up.
				setTimeout(function () {
					if (!isResolved) {
						resolve();
					}
				}, 1100);

				$el[0].addEventListener('transitionend', transitionend);

				// we are setting multiple conflicting css properties in a row and we want them to be all executed.
				// the browser does not always do this so we add the read to force a "repaint".
				//see: http://stackoverflow.com/questions/7974761/in-jquery-is-it-possible-to-get-callback-function-after-setting-new-css-rule
				$el.css('transform');
				$el.css(css);
			});
		}
	});

	return new AnimationHelper();
});
//# sourceMappingURL=AnimationHelper.js.map