I am curious to know how html5 video element process text tracks internally? Does it query whole vtt object on every time update event? Any insight will be helpful.
Thanks
Related
Given a video file with multiple audio tracks, I'm looking for a way to toggle the played audio stream during playback to save space and add multiple different translations to the same video file. I read about the video.audioTracks property, however, according to this page it's only available in IE11+ and Safari browsers as of now. From what I've of about so far it might be possible to store the video without any audio tracks whatsoever and play the audiotracks separately (which would most likely lead to asynchronous playback). Are there any better ways of achieving this behaviour?
I want to display ads with VAST ad tag and with a HTML5 player. I'm currently trying to use videoJS with Vast Ads Plugin and I'm noticing I can't get the videoJS player to work without having a video content (video element with a src attribute for the video content).
Does anyone know a simple way to use a video player for just ads from VAST, and without video content? Google IMA3 SDK allows that, but I'm now looking for video plugins to cover IE use case (which Google IMA3 SDK does not cover).
Thank you!
There is a dirty way to do this. You can get the ad video url from the plugin that already parsed by it. Then just paste as src to video tag.
If the player you are using support only running pre-roll, that's obviously the best choice. Since that's likely not the case, I would recommend creating a small 1 second long black video MP4 and setting it as the content, with all video controls disabled. This was the lowest friction solution for me, as I didn't need to ask the player anything special of the player. The pre-roll plays, and the user briefly sees black at the end, which may not really be noticed.
Is it possible to capture a snapshot of a video that's loaded using the HTML5 video element and use that as a preview image until the video loads or the play event is triggered? I know about the poster attribute but I want the thumbnail to be self generated, like a random frame from the video. Sort of what YouTube/Vimeo does.
Thanks,
I don't think that this is possible in pure HTML5. Principally because the stream is not loaded when you see the 'object' in the webpage so the client can't get the desired frame.
However, the best option for you is to save / cache the 'random frame' before loading the page and then use it as the poster of the video. This will allow you to reduce the client work and save the bandwith.
check THIS, which is the first thing that I've found (if you're using PHP and you want a 'quick and dirty' way to get the frame)
Update
Apparently HERE there is a solution with popcorn.js BUT it seems that you can't do it in the way that (I suppose) you need.
This because it would be possible to do this only inside the same domain due to browser security issues.
I am planning to build a system to broadcast public events (trials, meetings, conferences).
A key request will be the insertion of live subtitles to the A/V stream.
The subtitles will be "live" since they will be produced by an operator while the event will happen.
I suppose the HTML5 "track" element is not yet implemented by any of the major browsers, but: can I expect to eventually use it for live subtitles? Will I be able to inject the subtitle to the page while the stream is playing?
Please Look at the following links. Looking at the link i am having to believe it should be possible as they are using Js to show subtitles
http://www.storiesinflight.com/js_videosub/
http://cuepoint.org/
You may also consider http://mozillapopcorn.org/ which is to show content on timing of the video. So technically u can use this with ajax to show/stream subtitles
There are HTML5 video JS libs that support subtitles (eg: VideoJS supports the .srt format, there are several easily Google-able others), however to the best of my knowledge none of them support streaming subtitles.
I think you may have to build your own solution for this. If I were to do it, I'd probably try doing something with Socket.IO's broadcast functionality that can push data out to all connected clients at once, and have your client-side JS listen for new subtitle events and render them on screen as they come in. You can use plain ol' CSS to overlay the text over the HTML5 video.
I have few links to .mp4 video files like
file1.mp4
file2.mp4
file3.mp4
I need to play them all in player as one file. Actually not necessarily "as one" file, the player must act like it's one file. My best guess is to create custom controls and playback area for MPMoviePlayerController and divide the playback by time slices.
For instance
file1.mp4 file2.mp4 file3.mp4
-----------|------------|------------
Is this a good approach? Can this be done anyhow easier?
Also, the server, from which I'll get the videos is not customizable and I can't convert videos to MPEG-2 and stream them via .m3u8 files.
Thanks in advance
I guess you can use AVQueuePlayer. It supports multi-item playback. Haven't tried that myself (I used AVPlayer for single-item playback). I believe that AVQueuePlayer usage should reduce your overall efforts. ( You will still be responsible for drawing playback controls )
I sticked up to the scenario I described in the question and was able to create the player component.