Introduction
I made a video player that plays .mp4 files. It is based upon the FLVplaybackcomponent 2.5 in Flash Pro CS 5. It's basically a component with a movieclip interface (not a skin). the video plays fine, play/pause works and all that jazz.
Problem
The scrubber is erratic.
It seems to only be able to scrub in 10 second intervals and often behaves oddly (jumping to wrong locations).
All I seem to be doing is to take the total video time. Applying that time to a slider component so minimum is 0 and maximum is total video time. Then when the user changes the slider value it sets the playheadtime equal to the slider value.
If I trace out the values it seems fine, but the playheadtime is misbehaving.
If the slider displays 16 seconds and the playhead is made equal to 16 seconds it seems to snap at the closest 10 second interval.
Source
Here is a test file showcasing the problem:
http://rosefalk.dk/stuff/temp/stackoverflow/videoplayer_no_js.html
Here is the source with video and .fla: http://rosefalk.dk/stuff/temp/stackoverflow/stackoverflow-scrubberproblem.zip
BONUS
HTML players in some browsers seem to have no problem scrubbing the file.
The video service used (DigiZuite) seems to re-encode the video with keyframes every 10 seconds. Re-encoding the video with keyframes every second fixed the problem (small video so it was VERY noticeable).
Related
I have an angular application with a html5 <video> which gets the video source from a url. The problem is that for apparently no reason, at some point the video stops playing and shows itself as loading and stays at that same point for a few minutes and then resumes playing. I haven't provided the code because it is just the video and a condition to check if the video time is inside the wanted fragments, as some parts should be skipped (When it is not the time jumps forward). The video is played inside a modal, and it is not a connection problem
I have a database that contains metadata about some videos on my site. One of the things I store is video length which is often a decimal. When I query the database I will round the seconds value so videos that are 10.543 seconds display in a list as 11 seconds. However I've noticed the default html video player will show the video as being 10 seconds when the video loads. I could just floor the true video duration time but I would bet a video that is 10.998 would display as 11 seconds in the default html player.
I'm having trouble finding documentation on what the thresholds are for rounding when it comes to displaying video time durations. And do they change browser to browser?
Its probably not a rounding problem. It's probably a source of truth problem. There is not a standard way to measuring a video duration. Often in a video file there are two or three durations encoded, which can be combined in different ways. For example if you have 10 seconds video, and 11 seconds of audio, but the audio starts 1 second after the video starts what is the duration? 10 (the video track) 11 (the audio track) or 12 (the start of the video track through the end of the audio track)?
Some file formats may encode a duration into the medatadata, which can be calculated using any method, or could even be completely wrong. And the player that reads the file, could choose to ignore the metadata, and calculate it own duration.
And yes, every browser will do it differently for each format.
I'm developing an application in Adobe Air to display videos for a museum exhibit at a resolution of 2560x1440. The application works without a hitch on my machine, but when I run it on another (less powerful) computer, it does not function as intended. I've texted the application on two machines besides my own.
The problem is when one of the videos is called up, the video is called up and displays the first frame of the video and lags there for a good number of seconds (5-10), however I can still hear audio. After about 8-10 seconds, the video plays back as if it had been playing before and stutters briefly (1-2 seconds) before resuming playback normally. This is consistent behavior every time a video is launched as long as it's a fairly large video (> 50 MB as far as I can tell).
This does not happen on my development machine, which has a GTX 980 graphics card in it, but besides that and the motherboard, I can't think of any differences between the specs of the multiple machines.
The video throws an event indicating the buffer is full immediately as a video is launched, so buffering doesn't seem to be the issue.
Edit: Code (Pastebin)
Edit 2: Figured out it was the first frame, not a black screen
Still not entirely sure where the root of the problem lies, but what fixed it was adding this code right after calling the video. What it does is pause the playback and add a timer for one second, then seek 0.5 seconds into the video. I haven't run tests with this yet beyond getting past that first frame lag, but it works.
ns.pause();
var hesitate:Timer = new Timer(1000, 1);
hesitate.addEventListener(TimerEvent.TIMER_COMPLETE, function(e:TimerEvent)
{
ns.seek(0.5);
ns.resume();
});
hesitate.start();
I have to play video loop (2 second HD quality), and there is problem with playing video from the begining because method seek(0) always freeze Flash Player for a moment. There is now way to avoid this problem.
I have an idea, to play 2 netstreams in 2 separeted workers, but dont know how to share stage to do this ;[.
i have same problem.
i have embed the flv video in swf and play it in time line .
with embed vido you can loop it smoothly, this is a good solution in some cases.
(unconditionally embedding the video in swf have performance issue increased when ever your project become more complicated.
another issue is the swf file size become larger and larger
)
I'm working on measuring the real-time frame rate of html5 video, does anyone has some ideas? Since I have not find the properties info about frame in html5 video, I have no idea about how to do that.
Another alternative, how to access each frame that html5-video displayed(maybe there are drop frame while playing). I have tried to use canvas to get image from video by drawImage, and get the frame data by getImageData, but it seems that the frame data obtained is not the same as the frame by frame played in video, maybe there are 100 frames played, but we can get 120 0r 70 etc frames by getImageData method.
So in summary, how to get the real time fps or each frame displayed while playing for html5 video?
HTML5 video tag does not support dropped frames or real fps metric yet. However there is a proposal to add such metrics in future. More details at http://wiki.whatwg.org/wiki/Video_Metrics. The page also has video metrics for other players like flash.