Is there any way to create and add a caption to a video without creating .vtt file?
Here is what I want to try: So, I am creating a video call app (just for practice purposes), and I am wondering if I can display the username of the callers by making a caption or subtitle in the video that will run in the entire stream time.
Adding subtitles is possible using a tracking element, but I need to create .vtt file, and I don't want that. What I want is to create the track in the code. I have this code below but it is not showing in the video.
video.srcObject = stream;
video.addEventListener("loadedmetadata", () => {
video.play();
track = this.addTextTrack("captions", "English", "en");
track.addCue(new VTTCue(0, 500, username));
});
Summary of the questions:
This in arrow function points to window. You can access video element by event.target or just use you video variable.
video.srcObject = stream;
video.addEventListener("loadedmetadata", () => {
video.play();
const track = video.addTextTrack("captions", "English", "en");
track.mode = "showing";
track.addCue(new VTTCue(0, 500, username));// or TextTrackCue instead VTTCue
});