fix(rAF): move rAF to web-animations polyfill

RequestAnimationFrame polyfill is required for Android 4.3 and below,
and it must be written to the window object for Angular to work
correctly. Related #794

ionic/util/dom.ts

@@ -1,33 +1,7 @@
 
-const nativeRaf = window.requestAnimationFrame ||
+// requestAnimationFrame is polyfilled for old Android
-   window.webkitRequestAnimationFrame ||
+// within the web-animations polyfill
-   window.mozRequestAnimationFrame;
+export const raf = window.requestAnimationFrame;
-
-const nativeCancelRaf = window.cancelAnimationFrame ||
-  window.webkitCancelAnimationFrame ||
-  window.webkitCancelRequestAnimationFrame;
-
-export function raf(callback) {
-  //console.log('raf', callback.toString().replace(/\s/g, '').replace('function', '').substring(0, 50));
-  //console.log('raf, isRootZone()', zone.isRootZone(), '$id', zone.$id);
-  _raf(callback);
-}
-
-const _raf = nativeRaf || function(callback) {
-  let timeCurrent = (new Date()).getTime(),
-      timeDelta;
-
-  /* Dynamically set delay on a per-tick basis to match 60fps. */
-  /* Technique by Erik Moller. MIT license: https://gist.github.com/paulirish/1579671 */
-  timeDelta = Math.max(0, 16 - (timeCurrent - timeLast));
-  timeLast = timeCurrent + timeDelta;
-
-  return setTimeout(function() { callback(timeCurrent + timeDelta); }, timeDelta);
-}
-
-export const rafCancel = nativeRaf ? nativeCancelRaf : function(id) {
-  return window.cancelTimeout(id);
-}
 
 export function rafFrames(framesToWait, callback) {
   framesToWait = Math.ceil(framesToWait);

scripts/resources/web-animations-js/Gruntfile.js

@@ -87,6 +87,21 @@ module.exports = function(grunt) {
     config.wrap[target] = {
       source: source,
       preamble: '(function() {\n' +
+                '  // RequestAnimationFrame Polyfill (Android 4.1, 4.2, 4.3)\n' +
+                '  /*! @author Paul Irish */\n' +
+                '  /*! @source https://gist.github.com/paulirish/1579671 */\n' +
+                '  var rafLastTime = 0;\n' +
+                '  if (!window.requestAnimationFrame)\n' +
+                '    window.requestAnimationFrame = function(callback, element) {\n' +
+                '      var currTime = Date.now();\n' +
+                '      var timeToCall = Math.max(0, 16 - (currTime - rafLastTime));\n' +
+                '      var id = window.setTimeout(function() { callback(currTime + timeToCall); }, timeToCall);\n' +
+                '      rafLastTime = currTime + timeToCall;\n' +
+                '      return id;\n' +
+                '    };\n' +
+                '  if (!window.cancelAnimationFrame) window.cancelAnimationFrame = function(id) { clearTimeout(id); };\n' +
+                '  \n' +
+                '  // Web Animations Polyfill\n' +
                 '  if (document.documentElement.animate) {\n' +
                 '    var player = document.documentElement.animate([], 0);\n' +
                 '    var load = true;\n' +