getting the video's current vttcue frame information - html

I am trying to build a live video captioning editor and require that I fetch the current video frame's VTTCue information (startTime, endTime, text). How do I go about accomplishing this? Thanks.

nevermind. video.textTracks[0].oncuechange is what i needed to accomplish my goal.

Related

Remove Vimeo replay button

First off I do apologies if this isn't the kind of question I should be asking on stackoverflow. I'm trying to remove the small 'replay' button in the bottom left of a Vimeo video after it's finished playing. Or at least just keep the controls visible (either or).
I've been through all the documentation related to player.js on Git and gone through the SDK doc's related to the API and I can't find anything related to the replay button / event. I can trigger items after the ended event. But this will not do anything within the player because it's contained in an iframe. Any pointing in the right direction here will be of great help. I've also google searched and it's drawing a blank.
Thanks
I found the answer for this one just incase someone searches for the same thing. The simple solution was to destroy the player on ending.
player.on('ended', function () {
player.destroy();
player = new Vimeo.Player('video', options);
});
Hope this may help someone else out.

As3 Google DoubleClick Video

I'm very frustrated with Google DoubleClick's AS3 documentation. I'm not an advanced ActionScript coder and I have limited experience with streaming video, but I feel like their API is omitting a lot of information about how these classes actually work.
I'm attempting to load an FLV to play in an expanded unit. Their video component API shows how to control playback of a video, but it doesn't say anything about how to actually load an flv file through code into the component.
http://www.google.com/doubleclick/studio/docs/sdk/flash/as3/en/com_google_ads_studio_video_VideoPlayer.html
I found a controller API, but I have no idea how a "controller" works, or what it is, and the API doesn't explain anything outside of vague general information. I assume the controller needs to be somehow associated with the video player component, but there's nothing anywhere on Google that explains this in any form.
http://www.google.com/doubleclick/studio/docs/sdk/flash/as3/en/com_google_ads_studio_video_VideoController.html
So, in conclusion, what I want is simple. I want to programically load an flv file into a video component on the stage, and have it play. I feel like this is a simple thing to do. I can do this with netstream objects and regular means, but Google has explained nothing in it's API on how to achieve this in studio rich media, and I have no idea how the inner workings of it's components function. Can anyone tell me how to achieve this?
For using video in Studio, you use either the basic or advanced video player component, and component inspector to specify your video, then upload all your assets.
You can literally browse through hundreds of templates, including filtering for features like video, and choose one that best fits your needs along with documentaion here.
http://www.richmediagallery.com/resources/template-database
Basic video overview
https://support.google.com/richmedia/answer/1719810?hl=en
I could only add 2 links to my answer above
Here is the AS3 API for video
http://www.google.com/doubleclick/studio/docs/sdk/flash/as3/en/com_google_ads_studio_video_VideoPlayer.html
And the one for video player advanced
http://www.google.com/doubleclick/studio/docs/sdk/flash/as3/en/com_google_ads_studio_video_VideoPlayerAdvanced.html

interactive video with html5

I am new to actionScript programming. I know some html and I am currently learning html5. I need to do an interactive video by putting html content in a specific time of the video. I'll be more concise:
For example, I have a video that is 5 minutes long, let's suppose that from the second 3:50 to 4:00 I need to display two boxes over the video, each one representing one choice. If at 3:50 the video shows the possibility to the viewer to select among two paths (the video told the user to select among those paths for instance) the viewer will have the possibility to select one of the paths by clicking on one of the two boxes that will appear in that time interval. I know this needs to be made with the tag and with hyperlinks.
My question is How do I tell the html5 video player to display a canvas from the minute 3:50 to the minute 4:00 in which two hyperlinks will display??
Thanks for your attention I will appreciate very much your help. I need some kind of guidance because I have been looking for many days.
For your use case it seems you want to be able to control the video flow of the user through interactions that jump to different times in the video.
Using html5 video player to seek to a different time in a video (using currentTime) you could create a click event on a box that you lay on top of the video and set the time when you click that box, using:
// Jump 30 seconds into the video
var time = '30';
var video = document.createElement('video');
video.src = "video.mp4";
// Set the time
video.currentTime = time;
video.play();
You can check out how we created an interactive video authoring tool(open source) using html5 and JS and use that.
If you don't want to spend time coding an interactive video you should check out H5Ps authoring tool through this simple example. You can test out creating your own at H5P.org as well. The tool is completely free.
I may be wrong, but I believe that you mean javascript instead of actionscript. If that is the case then I would definitely check this out Video.JS.
When you reach the current time you trigger your method/function which adds whatever you want on top of the video.
var whereYouAt = myPlayer.currentTime();
However, if you DO mean actionscript then you are working with a flash player. Therefore I suggest you take a look at this Vimeo Player
currentTime:Number [read-only] Returns the current playback time of the video.

HTML5 video - playing only a portion of a video

Is there some straightforward technique to play only a certain part of a HTML5 video? For example in a 30 second clip I would like to play only the part 5-20 sec. Additionally the rest of the video should not be accessible from the UI at all (meaning the video timeline should only show the 5-20 sec part).
I've been going through some HTML5 video players but none of them seem to be supporting this kind of functionality. If anyone knows a (good) way to implement this feature please give me a hint.
Thanks in advance!
Even though this question has already been marked as answered, here's something that may interest you and anyone else who stumbles across here: Specifying playback range.
It's part of the Media Fragment API and currently works in the latest versions of Firefox, Chrome and Safari 6+.
You can implement it there is a Player.Play() event in a players, whenever Play() called start a timer and call the Player.stop() on the specific time you want.
I got the same problem and I didn't found something that can solves this problem, what you can do is to implement your own controls and display the video with a canvas...
and if you are trying to implement this in IOS you will not be able to do it.
My thought would be to use custom controls, as I don't believe that functionality is available natively. All the functionality of html5 controls (play, pause, start at timestamp, etc.) can be called via javascript. In this case you are going to want to edit the currentTime variable.
So you may want to consider setting up your own slider, where the start of the slider represents your starting point, and the end your ending point. Set the video to not play on page load. Then on page load have a javascript function change the currentTime to your starting point. For stopping you could occasionally query the currentTime. I wouldn't use a timer as delays like slow loading could throw it off.
I am trying to implement a similar video in "Preview Mode". I am utilizing the methods stated above by adding an event listener and then pausing the video at a currentTime()=='x' postition. To prevent user from simply hitting play again, the currentTime listener wont allow playback past the 'x' time in the timeline so each time the user hits play, it is automatically instantly paused again. Furthermore, at time 'x' the video container will become hidden through CSS thus preventing interaction from the user with the video.

AS3 Camera selection

Has anyone build a AS3 Camera-Select-algorithm, ready to use?
With MacBooks you have the problem that the build-in webcam is not rightly choosen from the webplayer.
You have to select the USP-Cam by youself from the list
DV Video
IIDC FireWire Video
USB Video Class Video
by
camera = Camera.getCamera("2");
THNX!
I found kind of a workaround here
You cant actually set the camera programatically. The best you can do is prompt the user to set it next to a video panel to show them if the camera they've chosen actually works. example here: http://www.neave.com/webcam/
to prompt them to change cameras you use:
Security.showSettings(SecurityPanel.CAMERA)
there is no event to wait for, though you can poll your video panel's bitmap data for changes and prompt the user behind the security panel when you think they've chosen the right camera.
Having done battle with this problem, I would suggest that everyone use this library.
https://github.com/cataclysmicrewind/CameraDetection/
Flash + webcam should = easy + awesome.
Unfortunately, it is pain + suffering.