DOM Video: randomly playing only between buffered frames of a video.

setupdraw

I am having fun exploring the DOM library. Trying to build something with video: I would like to build a video player where the video playhead jumps around based on certain parameters/user interactions. But only within the frames that are already (pre)loaded, otherwise I will have blank frames and pauses depending on the user's connection speed. Now, in terms of references/examples there's not much @ P5jS.org yet. But I have found this nice reference page: http://www.w3schools.com/tags/ref_av_dom.asp for HTML Audio/Video Properties. But how to use them properly in P5.js is quite obscure to me… for example:

Assumed what I've found here http://www.w3schools.com/tags/av_prop_duration.asp I was expecting the following code to work...

var randomF = floor(random(0, myVideo.duration));

But it doesn't.

While the code below gives me the result I was looking for:

var randomF = floor(random(0, myVideo.duration()));

I don't know why round brackets are needed here, I just discovered by chance this was what was the way to go… so I also tried the following:

var randomF = floor(random(0, myVideo.buffered.end()));

Assuming this would have worked out as well, but it didn't :((

I started being quite confused about what/how can I successfully use in terms of HTML DOM lingo in P5js. What are the properties HTML Audio/Video DOM I can use in P5js and how is quite a mystery to me... Does anybody out there experimenting with p5js Dom library has some advice/suggestion for me? Is there a general golden Javascript rule I am missing?

Thank a lot for your help!

GoToLoop

No familiarity w/ p5.MediaElement: http://p5js.org/reference/#/p5.MediaElement
But we can always access the actual HTMLElement from p5.Element via its property elt:
http://p5js.org/reference/#/p5.Element/elt