Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 

191 строка
5.1 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.isCssAnimationSupported = undefined;
  6. var _typeof2 = require('babel-runtime/helpers/typeof');
  7. var _typeof3 = _interopRequireDefault(_typeof2);
  8. var _Event = require('./Event');
  9. var _Event2 = _interopRequireDefault(_Event);
  10. var _componentClasses = require('component-classes');
  11. var _componentClasses2 = _interopRequireDefault(_componentClasses);
  12. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  13. var isCssAnimationSupported = _Event2['default'].endEvents.length !== 0;
  14. var capitalPrefixes = ['Webkit', 'Moz', 'O',
  15. // ms is special .... !
  16. 'ms'];
  17. var prefixes = ['-webkit-', '-moz-', '-o-', 'ms-', ''];
  18. function getStyleProperty(node, name) {
  19. // old ff need null, https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
  20. var style = window.getComputedStyle(node, null);
  21. var ret = '';
  22. for (var i = 0; i < prefixes.length; i++) {
  23. ret = style.getPropertyValue(prefixes[i] + name);
  24. if (ret) {
  25. break;
  26. }
  27. }
  28. return ret;
  29. }
  30. function fixBrowserByTimeout(node) {
  31. if (isCssAnimationSupported) {
  32. var transitionDelay = parseFloat(getStyleProperty(node, 'transition-delay')) || 0;
  33. var transitionDuration = parseFloat(getStyleProperty(node, 'transition-duration')) || 0;
  34. var animationDelay = parseFloat(getStyleProperty(node, 'animation-delay')) || 0;
  35. var animationDuration = parseFloat(getStyleProperty(node, 'animation-duration')) || 0;
  36. var time = Math.max(transitionDuration + transitionDelay, animationDuration + animationDelay);
  37. // sometimes, browser bug
  38. node.rcEndAnimTimeout = setTimeout(function () {
  39. node.rcEndAnimTimeout = null;
  40. if (node.rcEndListener) {
  41. node.rcEndListener();
  42. }
  43. }, time * 1000 + 200);
  44. }
  45. }
  46. function clearBrowserBugTimeout(node) {
  47. if (node.rcEndAnimTimeout) {
  48. clearTimeout(node.rcEndAnimTimeout);
  49. node.rcEndAnimTimeout = null;
  50. }
  51. }
  52. var cssAnimation = function cssAnimation(node, transitionName, endCallback) {
  53. var nameIsObj = (typeof transitionName === 'undefined' ? 'undefined' : (0, _typeof3['default'])(transitionName)) === 'object';
  54. var className = nameIsObj ? transitionName.name : transitionName;
  55. var activeClassName = nameIsObj ? transitionName.active : transitionName + '-active';
  56. var end = endCallback;
  57. var start = void 0;
  58. var active = void 0;
  59. var nodeClasses = (0, _componentClasses2['default'])(node);
  60. if (endCallback && Object.prototype.toString.call(endCallback) === '[object Object]') {
  61. end = endCallback.end;
  62. start = endCallback.start;
  63. active = endCallback.active;
  64. }
  65. if (node.rcEndListener) {
  66. node.rcEndListener();
  67. }
  68. node.rcEndListener = function (e) {
  69. if (e && e.target !== node) {
  70. return;
  71. }
  72. if (node.rcAnimTimeout) {
  73. clearTimeout(node.rcAnimTimeout);
  74. node.rcAnimTimeout = null;
  75. }
  76. clearBrowserBugTimeout(node);
  77. nodeClasses.remove(className);
  78. nodeClasses.remove(activeClassName);
  79. _Event2['default'].removeEndEventListener(node, node.rcEndListener);
  80. node.rcEndListener = null;
  81. // Usually this optional end is used for informing an owner of
  82. // a leave animation and telling it to remove the child.
  83. if (end) {
  84. end();
  85. }
  86. };
  87. _Event2['default'].addEndEventListener(node, node.rcEndListener);
  88. if (start) {
  89. start();
  90. }
  91. nodeClasses.add(className);
  92. node.rcAnimTimeout = setTimeout(function () {
  93. node.rcAnimTimeout = null;
  94. nodeClasses.add(activeClassName);
  95. if (active) {
  96. setTimeout(active, 0);
  97. }
  98. fixBrowserByTimeout(node);
  99. // 30ms for firefox
  100. }, 30);
  101. return {
  102. stop: function stop() {
  103. if (node.rcEndListener) {
  104. node.rcEndListener();
  105. }
  106. }
  107. };
  108. };
  109. cssAnimation.style = function (node, style, callback) {
  110. if (node.rcEndListener) {
  111. node.rcEndListener();
  112. }
  113. node.rcEndListener = function (e) {
  114. if (e && e.target !== node) {
  115. return;
  116. }
  117. if (node.rcAnimTimeout) {
  118. clearTimeout(node.rcAnimTimeout);
  119. node.rcAnimTimeout = null;
  120. }
  121. clearBrowserBugTimeout(node);
  122. _Event2['default'].removeEndEventListener(node, node.rcEndListener);
  123. node.rcEndListener = null;
  124. // Usually this optional callback is used for informing an owner of
  125. // a leave animation and telling it to remove the child.
  126. if (callback) {
  127. callback();
  128. }
  129. };
  130. _Event2['default'].addEndEventListener(node, node.rcEndListener);
  131. node.rcAnimTimeout = setTimeout(function () {
  132. for (var s in style) {
  133. if (style.hasOwnProperty(s)) {
  134. node.style[s] = style[s];
  135. }
  136. }
  137. node.rcAnimTimeout = null;
  138. fixBrowserByTimeout(node);
  139. }, 0);
  140. };
  141. cssAnimation.setTransition = function (node, p, value) {
  142. var property = p;
  143. var v = value;
  144. if (value === undefined) {
  145. v = property;
  146. property = '';
  147. }
  148. property = property || '';
  149. capitalPrefixes.forEach(function (prefix) {
  150. node.style[prefix + 'Transition' + property] = v;
  151. });
  152. };
  153. cssAnimation.isCssAnimationSupported = isCssAnimationSupported;
  154. exports.isCssAnimationSupported = isCssAnimationSupported;
  155. exports['default'] = cssAnimation;