Getting a single frame from the webcam instead of continuous stream + saving those frames in a list

Ders

I'm trying to create a simple web application that a user can take a picture with using their webcam. At the moment I have everything figured out so that the webcam is constantly streaming the video to the canvas but I want it to save a "frame" to the app instead. Is this possible? If so, how do I do this? Also, I want to save these images in an array for now. I've tried using array.push() on the timing I want to take a picture (using mouseReleased) but that gives me an array of video streams from the webcam.

koogs

are you using capture like this example?

https://processing.org/reference/libraries/video/Capture.html

if so, you are probably free to ignore the cam.available flag until YOU are ready (ie mouseReleased has been called)

Ders

That's Processing code. I can't use this for p5js

Ders

Ok, I got as far as to save the current frame to the list by using the loadPixels() method on the camera capture object I get from createCapture(VIDEO). Now, I push this data to the list every time I click my mouse but when I do it again (with data already in the list) the older items are overridden with the new frame. So, I assume that the data is all "by reference" and not "by value" which is what I'm looking for. So, how can I copy these pixels in a new object so I can save it in the list?

GoToLoop

http://p5js.org/reference/#/p5.Image/get

BarbaraAlmeida