Skip to content

feat: add p5-frame-capturer to libraries - #1587

Open
sevenc-nanashi wants to merge 2 commits into
processing:mainfrom
sevenc-nanashi:feat/p5-frame-capturer
Open

feat: add p5-frame-capturer to libraries#1587
sevenc-nanashi wants to merge 2 commits into
processing:mainfrom
sevenc-nanashi:feat/p5-frame-capturer

Conversation

@sevenc-nanashi

Copy link
Copy Markdown

This PR adds p5-frame-capturer to library list.

https://github.com/sevenc-nanashi/p5-frame-capturer

@Nwakaego-Ego

Copy link
Copy Markdown
Contributor

Thank you, @sevenc-nanashi, for adding this library. I tested p5-frame-capturer 0.5.1 with p5.js 2.2.0 on Chrome and Windows. The proposed dist/umd.js file loads correctly, the controls appear, the browser asks for permission to access the selected folder, and the library successfully saves the captured frames as numbered PNG files.

I found one limitation with the UMD-mode p5.js Web Editor demo linked in the README. The controls load, but clicking "Start" shows this error:
SecurityError: Failed to execute showDirectoryPicker on "Window":
Cross origin sub frames aren't allowed to show a file picker.

This happens because the Web Editor runs the sketch preview inside a cross-origin iframe, where the browser does not allow the directory picker to open. The same sketch works when it is served as a normal top-level page on localhost, so this is a limitation of the Web Editor environment rather than a failure of the library itself.

As a suggestion, it may be helpful to provide a standalone hosted demo that runs as a top-level page, where the complete capture flow can be tested. Another option would be to clearly explain in the README that saving frames does not work inside the current Web Editor preview and include instructions for running the example locally.

It may also be worth updating the library description so that it mentions the browser limitation. For example: description: A library for capturing frames from p5.js sketches and saving them to the local file system in Chromium-based browsers.

The image description could also be clearer. For example: featuredImageAlt: A File Explorer window showing captured frames from a p5.js sketch.

@sevenc-nanashi

Copy link
Copy Markdown
Author

it may be helpful to provide a standalone hosted demo that runs as a top-level page

There is a demo: https://sevenc7c.com/p5-frame-capturer/ (it is using ESM mode though). I haven't noticed that UMD does not work, I'll add the warning to README.

I'll update the description as well.

Co-Authored-By: Nwakaego-Ego <Nwakaego-Ego@users.noreply.github.com>
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

Successfully merging this pull request may close these issues.

2 participants