Copy link to clipboard
Copied
So I am working on an HTML5 panel that uses an api to load up a list of video previews, and you get the ability to download them, which I am using Node.js request for that. Now after scrubbing through some videos it seems like after about 20 or so videos they stop loading. if i do a new search it will bring up the api data, will build the video player but not load the video data, will not play it. acts as if I have the worst internet connection ever. But if I close the panel and reopen it, it works fine again for another 20 or so videos. Now when I run my panel through a browser it works just fine without this limitation, So I am trying to find out what is causing these limitations and how to go about resolving them.
I am running into another issue, where when I am downloading a file it works great and downloads and places it where I want it, but when I start tracking the progress of my download with jquery .on('data') when the video gets to a couple mb's in it freezes up my whole panel where I will have to restart it.
any help would be appreciated.
-Thank You
Copy link to clipboard
Copied
Out of curiosity, have you attached a Chrome Debugger to it and taken a look at all the various pieces of information there?
Copy link to clipboard
Copied
How do I go about doing that? I have been looking into a way of getting a debugger through CEP but the only solution I have found was "window.onerror"
Copy link to clipboard
Copied
Hey jar0we,
it´s not clear to me what is not working. First you say you´re downloading a list of preview videos using node.js.
What is a "list of video previews". Is this a json object? Or do you try to simultaneously download more than 20 videos using node.js?
Could you please post your download code?
And if you´re using node.js to download that list why is this working in a browser? Node.js is not available in a browser without a node.js server. Are you downloading it differently in the browser?
Please post your download code, otherwise it´s difficult to help.
Thomas
Copy link to clipboard
Copied
Sorry for the confusion. I am dealing with two separate issues.For the first I am using jquery to make an ajax call to an api that returns a list of links of videos.
var response = $.ajax({
url: "https://www.website.com",
method: "GET",
data: { token : tokenID, search_term : search, page : pagenum},
dataType: "json"
});
I am then using that data to populate a list of 50 videos on the page:
<video poster="https://static.videezy.com/system/resources/thumbnails/000/003/674/small_2x/leaf_and_drops.jpg" src="https://static.videezy.com/system/resources/previews/000/003/674/original/leaf_and_drops.mp4" data-mp4="https://static.videezy.com/system/resources/previews/000/003/674/original/leaf_and_drops.mp4" data-name="Leaf and Water Drops Stock Video" preload="none" onmouseover="$(this).get(0).play()" onmouseout="$(this).get(0).pause()"></video>
Originally i had preload on and only about half the videos would load up. once I got rid of preload it seemed to work a lot better. but still, after watching some videos it seems to get limited.
I am using PPRO2017 v 11.0.0
Copy link to clipboard
Copied
Ah, this doesn´t look like any node.js issue (as I don´t see any node.js code).
I can´t really tell if there are limitations on how much <video> elements can be listed but I see potential performance issues.
For that reason there are several different approaches:
• display a list of preview images and dynamically create the <video> elements in place on demand (or on mouseover) (see istockphoto.com)
• display a list of preview images and on mouseover show it in a separate player popup (pond5.com)
• display a list of preview images and on mouseover show hover scrub images (our solution on Frame.io) - no <video> involved
I hope this helps.
Thomas
Copy link to clipboard
Copied
the code works perfectly fine when run through Chrome or any other browser, all the videos load in great, and I cant get it to mess up. It only happens when running the actual panel through PPRO. Is why I'm asking if anyone knows of any data limitations with panels, if there is a way to check that, or a way to force it.
Copy link to clipboard
Copied
jar0we wrote:
How do I go about doing that? I have been looking into a way of getting a debugger through CEP but the only solution I have found was "window.onerror"
You set up your environment to allow remote debugging and then connect to the port you specify with a localhost URI in Chrome. This page, while from a fairly dated series, has a good commentary. The official PDF has robust documentation on this. Check out the following sections:
Finally, the PProPanel Samples page has a great rundown of how to get the environment set up.
That should get you moving.
Copy link to clipboard
Copied
So I got my debugger set up and this is what Im getting get all 200s, then start to get 206. then just pending
Copy link to clipboard
Copied
I have no idea, personally. One thing you might try is finding and installing Chrome/Chromium 41.0.2272.104 (or near enough) on your machine and trying the files there to see if it's something in the CEF layer versus something Premiere Pro-specific...
(According to the CEP documentation, the panel is based on a version of Chromium that roughly matches Chrome 41.0.2272.x.)
Copy link to clipboard
Copied
Also, what Premiere Pro version are you using to test this?