src/js/utils/animation.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

// ==========================================================================
// Animation utils
// ==========================================================================

import is from './is';

export const transitionEndEvent = (() => {
  const element = document.createElement('span');

  const events = {
    WebkitTransition: 'webkitTransitionEnd',
    MozTransition: 'transitionend',
    OTransition: 'oTransitionEnd otransitionend',
    transition: 'transitionend',
  };

  const type = Object.keys(events).find((event) => element.style[event] !== undefined);

  return is.string(type) ? events[type] : false;
})();

// Force repaint of element
export function repaint(element, delay) {
  setTimeout(() => {
    try {
      // eslint-disable-next-line no-param-reassign
      element.hidden = true;

      // eslint-disable-next-line no-unused-expressions
      element.offsetHeight;

      // eslint-disable-next-line no-param-reassign
      element.hidden = false;
    } catch (_) {
      // Do nothing
    }
  }, delay);
}