From bc8666771aa8d1a6d92d595a43bcee83e168f042 Mon Sep 17 00:00:00 2001 From: atomiks Date: Sun, 25 Feb 2018 14:26:15 +1100 Subject: [PATCH 1/7] Create recordFrames.md --- snippets/recordFrames.md | 37 +++++++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 snippets/recordFrames.md diff --git a/snippets/recordFrames.md b/snippets/recordFrames.md new file mode 100644 index 000000000..17a71300c --- /dev/null +++ b/snippets/recordFrames.md @@ -0,0 +1,37 @@ +### recordFrames + +Invokes the provided callback on each animation frame. + +Use recursion. Provided that `running` is `true`, continue invoking `window.requestAnimationFrame`. 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 recordFrames = (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 = recordFrames(cb) // logs 'Animation frame fired' on each animation frame +recorder.stop() // stops logging +recorder.start() // starts again +const recorder2 = recordFrames(cb, false) // `start` needs to be explicitly called to begin recording frames +``` From 802bd7dca38c2b7fc9146bb550e094732abc02c1 Mon Sep 17 00:00:00 2001 From: atomiks Date: Sun, 25 Feb 2018 14:27:59 +1100 Subject: [PATCH 2/7] Update tag_database --- tag_database | 1 + 1 file changed, 1 insertion(+) diff --git a/tag_database b/tag_database index 54db11193..5eeee0a58 100644 --- a/tag_database +++ b/tag_database @@ -204,6 +204,7 @@ randomIntegerInRange:math,utility,random randomNumberInRange:math,utility,random readFileLines:node,array,string rearg:adapter,function +recordFrames:utility redirect:browser,url reducedFilter:array reduceSuccessive:array,function From 2562ab4878650deeed3801f2ff638ff91e36ed55 Mon Sep 17 00:00:00 2001 From: atomiks Date: Sun, 25 Feb 2018 14:32:23 +1100 Subject: [PATCH 3/7] Update recordFrames.md --- snippets/recordFrames.md | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/snippets/recordFrames.md b/snippets/recordFrames.md index 17a71300c..938058ae9 100644 --- a/snippets/recordFrames.md +++ b/snippets/recordFrames.md @@ -2,9 +2,8 @@ Invokes the provided callback on each animation frame. -Use recursion. Provided that `running` is `true`, continue invoking `window.requestAnimationFrame`. 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. +Use recursion. Provided that `running` is `true`, continue invoking `window.requestAnimationFrame()` and invoking 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 recordFrames = (callback, autoStart = true) => { From c070168e94fa62b1fc6719b1e1a3c0f0e27fe818 Mon Sep 17 00:00:00 2001 From: atomiks Date: Sun, 25 Feb 2018 14:32:45 +1100 Subject: [PATCH 4/7] Update recordFrames.md --- snippets/recordFrames.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/snippets/recordFrames.md b/snippets/recordFrames.md index 938058ae9..cc158c7b2 100644 --- a/snippets/recordFrames.md +++ b/snippets/recordFrames.md @@ -2,7 +2,7 @@ Invokes the provided callback on each animation frame. -Use recursion. Provided that `running` is `true`, continue invoking `window.requestAnimationFrame()` and invoking the +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 From 33fd5f62a3c28c5f3b49d5c75596ba71f3307937 Mon Sep 17 00:00:00 2001 From: atomiks Date: Wed, 28 Feb 2018 16:19:07 +1000 Subject: [PATCH 5/7] Update and rename recordFrames.md to recordAnimationFrames.md --- snippets/{recordFrames.md => recordAnimationFrames.md} | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) rename snippets/{recordFrames.md => recordAnimationFrames.md} (73%) diff --git a/snippets/recordFrames.md b/snippets/recordAnimationFrames.md similarity index 73% rename from snippets/recordFrames.md rename to snippets/recordAnimationFrames.md index cc158c7b2..227eb23f5 100644 --- a/snippets/recordFrames.md +++ b/snippets/recordAnimationFrames.md @@ -1,4 +1,4 @@ -### recordFrames +### recordAnimationFrames Invokes the provided callback on each animation frame. @@ -6,7 +6,7 @@ Use recursion. Provided that `running` is `true`, continue invoking `window.requ 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 recordFrames = (callback, autoStart = true) => { +const recordAnimationFrames = (callback, autoStart = true) => { let running = true, raf const stop = () => { running = false @@ -29,8 +29,8 @@ const recordFrames = (callback, autoStart = true) => { ```js const cb = () => console.log('Animation frame fired') -const recorder = recordFrames(cb) // logs 'Animation frame fired' on each animation frame +const recorder = recordAnimationFrames(cb) // logs 'Animation frame fired' on each animation frame recorder.stop() // stops logging recorder.start() // starts again -const recorder2 = recordFrames(cb, false) // `start` needs to be explicitly called to begin recording frames +const recorder2 = recordAnimationFrames(cb, false) // `start` needs to be explicitly called to begin recording frames ``` From 9cca4b40d973977a3c1c85a7139e205a46c6eccc Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Tue, 6 Mar 2018 09:09:20 +0200 Subject: [PATCH 6/7] Update tag_database --- tag_database | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tag_database b/tag_database index 5eeee0a58..937c27eae 100644 --- a/tag_database +++ b/tag_database @@ -204,7 +204,7 @@ randomIntegerInRange:math,utility,random randomNumberInRange:math,utility,random readFileLines:node,array,string rearg:adapter,function -recordFrames:utility +recordAnimationFrames:browser,utility redirect:browser,url reducedFilter:array reduceSuccessive:array,function From 0121ccff1e263756a64591284d54d3e1515d4be7 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Tue, 6 Mar 2018 09:10:09 +0200 Subject: [PATCH 7/7] Update recordAnimationFrames.md --- snippets/recordAnimationFrames.md | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/snippets/recordAnimationFrames.md b/snippets/recordAnimationFrames.md index 227eb23f5..100504eb9 100644 --- a/snippets/recordAnimationFrames.md +++ b/snippets/recordAnimationFrames.md @@ -2,8 +2,10 @@ 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. +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) => { @@ -28,9 +30,9 @@ const recordAnimationFrames = (callback, autoStart = true) => { ``` ```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 +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 ```