Revert "Revert "Add cancelAnimationFrame""

lib/dom/templates/html/frog/impl_Window.darttemplate

Index: lib/dom/templates/html/frog/impl_Window.darttemplate
diff --git a/lib/dom/templates/html/frog/impl_Window.darttemplate b/lib/dom/templates/html/frog/impl_Window.darttemplate
index 78335ee8d057cfc33755ccefcb7eb6afed36cd74..2a24df9d710e2bc3afa1ca80a8c6c14327f4a0bd 100644
--- a/lib/dom/templates/html/frog/impl_Window.darttemplate
+++ b/lib/dom/templates/html/frog/impl_Window.darttemplate
@@ -16,22 +16,37 @@ class $CLASSNAME$EXTENDS$IMPLEMENTS native "@*DOMWindow" {
   }
 
   /** @domName DOMWindow.requestAnimationFrame */
-  int requestAnimationFrame(RequestAnimationFrameCallback callback) native '''
-    if (!window.requestAnimationFrame) {
-      window.requestAnimationFrame =
-          window.webkitRequestAnimationFrame ||
-          window.mozRequestAnimationFrame ||
-          window.msRequestAnimationFrame ||
-          window.oRequestAnimationFrame ||
-          function (callback) {
-            window.setTimeout(callback, 16 /* 16ms ~= 60fps */);
-          };
-    }
-    return window.requestAnimationFrame(callback);
-''';
+  int requestAnimationFrame(RequestAnimationFrameCallback callback) {
+    _ensureRequestAnimationFrame();
+    return _requestAnimationFrame(callback);
+  }
 
-  // Protect member 'requestAnimationFrame'.
-  _requestAnimationFrame() native 'requestAnimationFrame';
+  void cancelAnimationFrame(id) {
+    _ensureRequestAnimationFrame();
+    _cancelAnimationFrame(id);
+  }
+
+  int _requestAnimationFrame(RequestAnimationFrameCallback callback)
+      native 'requestAnimationFrame';
+
+  void _cancelAnimationFrame(int id)
+      native 'cancelAnimationFrame';
+
+  _ensureRequestAnimationFrame() native '''
+   if (this.requestAnimationFrame && this.cancelAnimationFrame) return;
+   var vendors = ['ms', 'moz', 'webkit', 'o'];
+   for (var i = 0; i < vendors.length && !this.requestAnimationFrame; ++i) {
+     this.requestAnimationFrame = this[vendors[i] + 'RequestAnimationFrame'];
+     this.cancelAnimationFrame =
+         this[vendors[i]+'CancelAnimationFrame'] ||
+         this[vendors[i]+'CancelRequestAnimationFrame'];
+   }
+   if (this.requestAnimationFrame && this.cancelAnimationFrame) return;
+   this.requestAnimationFrame = function(callback) {
+       return window.setTimeout(callback, 16 /* 16ms ~= 60fps */);
+   };
+   this.cancelAnimationFrame = function(id) { clearTimeout(id); }
+''';
 
 $!MEMBERS
 }