tapioca24 / p5.capture

🎬 super easy recording for p5.js animations
MIT License
222 stars 6 forks source link

adding support to p5 instance mode with one singleton #17

Closed guilhermesilveira closed 1 year ago

guilhermesilveira commented 1 year ago

This commit adds support for p5 instance mode, allowing the user to record one canvas at a time (any p5 canvas within the page).

Usage is straightforward. As expected, after the canvas is set up, P5Capture is told to use that p5 instance and canvas instead of window.


const s = ( sketch ) => {

    sketch.setup = () => {
        // your setup
        P5Capture.setDefaultOptions({p5 : sketch});
    };

    sketch.draw = () => {
        // your draw
    };
};

new p5(s);```

That is all. I have also included:
- the proper end to end tests
- A safety check to warn if one tries to load p5.capture before the document body has been created. You can't load it before document.body as there would be nowhere for the recording window to be appended to

If this implementation makes sense I can add this example to the Readme to finish it.

I did not choose to support multiple recording sessions running at the same time inside a single page since:
- it seems to be an even more rare situation
- it would require to remove the singleton pattern of the P5.Capture, which is not a minor feature

I guess that is all, thanks for the great work.
tapioca24 commented 1 year ago

Hi, @guilhermesilveira. Thank you for opening this one! I checked the behavior and found that the option setting by P5Capture.setDefaultOptions() did not work. This was due to the code execution order difference between global and instance modes. By using other approaches inspired by your code, the options work, and the mode can be auto-detected without additional options.

I will close this as I have created a new one as #20. Once again, my deepest thanks for your contribution 💚

guilhermesilveira commented 1 year ago

Perfect! Thanks.

On Fri, Nov 18, 2022, 11:43 tapioca24 @.***> wrote:

Closed #17 https://github.com/tapioca24/p5.capture/pull/17.

— Reply to this email directly, view it on GitHub https://github.com/tapioca24/p5.capture/pull/17#event-7844489783, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAMRP4PS5YAMVHW5PAMRE3WI6IZRANCNFSM6AAAAAAR7GE6MU . You are receiving this because you were mentioned.Message ID: @.***>