We are creating animations using HTML5 + Javascript. Now, we'd like to convert these animations to video files (MPEG4, or other, doesn't matter) so that browserly challenged people could also see the animations. Animations contain an audio track.
We are looking for solutions where HTML page would be rendered and recorded on the server side. I know there exist tools for rendering web page thumbnails etc. static images already. However, in our use case we should output a video file.
What options are there? Is headless X server + Firefox a way to go? Preferably we'd be running this in a cloud (Amazon EC2).
Also if there something special we'd need to think when playing animation in non-real-time speeds, I'd like to hear - e.g. syncing HTML5 audio with animation.
Just to note that we have solved this problem by
Running Firefox on a headless server. A server with a decent graphics card.
Having a Selenium Python control script to start/stop rendering
A custom rendering loop which will use Firefox's XPCom API to feed <canvas>
raw pixels directly in the encoding pipeline
A custom Javascript rendering loop where clock does not come from a real clock, but it slices frames to the renderer on a stable framerate which is not real-time
Quite a complex system, so doesn't fit into one Answer box :(
One thing that might work, depending on your animation, would be to essentially create an animated gif. With enough still images of your animation strung together, you should be able to turn those into a video with the right software. This is a rather brute-force solution, but if you can advance through your animation in a "frame-by-frame" fashion, it might work.
Sounds interesting. I've done a similar thing with the QtWebKit library that requires a headless X server to run. What I was doing was converting web pages to PDF on a large scale. It might make sense to search for some webkit2pdf tools to see an example that you can build off of.
I would take a look at the library and combine it with another recording solution.
In terms of tooling I've had a pretty decent experience with these Ruby tools:
- the headless gem supports video capturing with ffmpeg
- capybara will allow you to drive e.g. firefox.
I have NO idea about how they deal with audio though