Merge pull request #616 from Chalarangelo/recordFrames

Create recordAnimationFrames.md

snippets/recordAnimationFrames.md

@@ -0,0 +1,38 @@
+### recordAnimationFrames
+
+Invokes the provided callback on each animation frame.
+
+Use recursion. 
+Provided that `running` is `true`, continue invoking `window.requestAnimationFrame()` which invokes the provided callback. 
+Return an object with two methods `start` and `stop` to allow manual control of the recording. 
+Omit the second argument, `autoStart`, to implicitly call `start` when the function is invoked.
+
+```js
+const recordAnimationFrames = (callback, autoStart = true) => {
+  let running = true, raf
+  const stop = () => {
+    running = false
+    cancelAnimationFrame(raf)
+  }
+  const start = () => {
+    running = true
+    run()
+  }
+  const run = () => {
+    raf = requestAnimationFrame(() => {
+      callback()
+      if (running) run()
+    })
+  }
+  if (autoStart) start()
+  return { start, stop }
+}
+```
+
+```js
+const cb = () => console.log('Animation frame fired');
+const recorder = recordAnimationFrames(cb); // logs 'Animation frame fired' on each animation frame
+recorder.stop(); // stops logging
+recorder.start(); // starts again
+const recorder2 = recordAnimationFrames(cb, false); // `start` needs to be explicitly called to begin recording frames
+```

tag_database

@@ -206,6 +206,7 @@ randomIntegerInRange:math,utility,random
 randomNumberInRange:math,utility,random
 readFileLines:node,array,string
 rearg:adapter,function
+recordAnimationFrames:browser,utility
 redirect:browser,url
 reducedFilter:array
 reduceSuccessive:array,function