search

mattdesl / canvas-sketch

[beta] A framework for making generative artwork in JavaScript and the browser.
MIT License
5.01k stars 393 forks source link

Export mp4 containing multiple concatenated loops #117

Closed aaronpenne closed 3 years ago

aaronpenne commented 3 years ago

One use case I have is to concatenate a loop so it plays N times in an mp4 file. I achieve this currently by using the ffmpeg concat demuxer and repeatedly putting the same mp4 into a longer mp4.

Wonder if this export functionality already exists or if there is a way to trick ffmpeg into doing it for me from canvas-sketch?

BTW this library has dramatically improved my workflow, thank you for keeping it up to date!

For example, I have a sketch that exported an mp4 file: 2021.02.21-08.19.47.mp4. This mp4 contains one iteration of the loop. I want 5 iterations of the loop in one mp4.

I then create a file mp4_list.txt containing:

file 2021.02.21-08.19.47.mp4
file 2021.02.21-08.19.47.mp4
file 2021.02.21-08.19.47.mp4
file 2021.02.21-08.19.47.mp4
file 2021.02.21-08.19.47.mp4

And finally do the concat from the terminal:

ffmpeg -f concat -safe 0 -i mp4_list.txt -c copy 2021.02.21-08.19.47.long.mp4
mattdesl commented 3 years ago

That’s something I’ve also needed at times. Might be worth adding as a function or some documentation at least.

What you could perhaps do for now is to set a longer duration and calculate your own playhead setting , eg

playhead = ((time / (duration/5)) % 1)

You might also need to keep track of the { frame } prop to reset any state once you reach the end of your short loop.

There might be a nicer way by wrapping your sketch in a ‘higher order’ sketch. Let me think on it.

aaronpenne commented 3 years ago

That seems like a reasonable approach, thanks for the idea.