• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1// Copyright 2016 Google Inc. 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(function(shared) {
16  // If the polyfill is being loaded in a context where Element.animate is
17  // supported but object-form syntax is not, then creating an animation
18  // using the new syntax will either have no effect or will throw an exception.
19  // In either case, we want to proceed to load this part of the polyfill.
20  //
21  // The test animation uses an opacity other than the one the element already
22  // has, and doesn't need to change during the animation for the test to work.
23  // After the test, the element's opacity will be left how we found it:
24  // - If the animation is not created, the test will leave the element's
25  //   opacity untouched at originalOpacity.
26  // - If the animation is created, it will be cancelled, and leave the
27  //   element's opacity at originalOpacity.
28  // - If the animation is somehow created and runs without being cancelled,
29  //   when it finishes after 1ms, it will cease to have any effect (because
30  //   fill is not specified), and opacity will again be left at originalOpacity.
31  var element = document.documentElement;
32  var animation = null;
33  var animated = false;
34  try {
35    var originalOpacity = getComputedStyle(element).getPropertyValue('opacity');
36    var testOpacity = originalOpacity == '0' ? '1' : '0';
37    animation = element.animate({'opacity': [testOpacity, testOpacity]},
38        {duration: 1});
39    animation.currentTime = 0;
40    animated = getComputedStyle(element).getPropertyValue('opacity') == testOpacity;
41  } catch (error) {
42  } finally {
43    if (animation)
44      animation.cancel();
45  }
46  if (animated) {
47    return;
48  }
49
50  var originalElementAnimate = window.Element.prototype.animate;
51  window.Element.prototype.animate = function(effectInput, options) {
52    if (window.Symbol && Symbol.iterator && Array.prototype.from && effectInput[Symbol.iterator]) {
53      // Handle custom iterables in most browsers by converting to an array
54      effectInput = Array.from(effectInput);
55    }
56
57    if (!Array.isArray(effectInput) && effectInput !== null) {
58      effectInput = shared.convertToArrayForm(effectInput);
59    }
60
61    return originalElementAnimate.call(this, effectInput, options);
62  };
63})(webAnimationsShared);
64