Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Capture stalls after capturing only one frame -- then repeated timeouts #117

Open
darethehair opened this issue Jul 17, 2020 · 4 comments
Open

Comments

@darethehair
Copy link

From the examples I have read, I am doing everything correctly to add canvas capture to my HTML5 app using 'ccapture.js, but after successfully capturing a single frame (webm, jpg, etc) my animation stalls out, and my console gets repeated messages about setting and clearing a 'Timeout':

turning video capture ON
CCapture.all.min.js:1 Capturer start
CCapture.all.min.js:1 Timeout set to 1000
comet.html:11519 saving video frame
CCapture.all.min.js:1 Full Frame! 1

CCapture.all.min.js:1 Frame: 1 0
CCapture.all.min.js:1 Timeout set to 5000
CCapture.all.min.js:1 Timeout cleared
CCapture.all.min.js:1 Timeout set to 5000
CCapture.all.min.js:1 Timeout cleared
CCapture.all.min.js:1 Timeout set to 5000
CCapture.all.min.js:1 Timeout cleared
...

My animation loop never continues, and more frames are not grabbed. Stopping/saving the capture seems to work fine, but the result only contains one image/frame.

What am I doing wrong? I feel like I am so close to my goal! :)

@spite
Copy link
Owner

spite commented Jul 17, 2020

I can't help you with only that. I would need to see how your code handles frames. There can't be a handful of reasons why CCapture stalls. Usually it's because you're using timers in an unconventional/unsupported way.

@darethehair
Copy link
Author

My code is very long, created years ago, but I have a loop that draws on the HTML5 canvas:

                    function update_clock() {
                            user_interval = document.getElementById('user_interval').value * 1000;
                            var timeout_interval = setTimeout("update_clock()", user_interval);
                            ...bunch of code that draws on canvas...
                            save_video_frame();
                            }

And a very simple function that captures a single frame:

                    function save_video_frame() {
                            console.log("saving video frame");
                            capturer.capture(canvas);
                    }

...

@darethehair
Copy link
Author

Any updated suggestions regarding my capture problem? I posted the basic context in my post above. Thanks

@spite
Copy link
Owner

spite commented Jul 29, 2020

I don't have enough to work with. But relying on setTimeout/setInterval is guarantedd to become an issue if you start capturing halfway. I'd recommend using requestAnimationFrame.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants