Friday 22 July 2016

How to add chapter in jwplayer video?

How to add chapter in jwplayer video?

Question: How to add marker in jwplayer video?
 
<script src="//content.jwplatform.com/libraries/bFyELn2w.js"></script>
<div id="videoPlayerId">
</div>
<script type="text/javascript">
    var playerObj = jwplayer("videoPlayerId");


    playerObj.setup({
        image: "//content.jwplatform.com/thumbs/q1fx20VZ-640.jpg",
        file: "//content.jwplatform.com/videos/q1fx20VZ-640.mp4",
        tracks: [{
                file: '//content.jwplatform.com/tracks/XtwSLSdq.txt',
                kind: 'chapters'
            }],
        width: 640,
        height: 400
    }); 
</script> 


Demo



Question: Give the chapter sample file?
1
00:00:00,000 --> 00:01:42,000
Opening credits

2
00:01:42,000 --> 00:04:44,000
A dangerous quest

3
00:04:44,000 --> 00:05:50,000
The attack

4
00:05:50,000 --> 00:08:24,000
In pursuit

5
00:08:24,000 --> 00:10:13,000
Showdown in the cage

6
00:10:13,000 --> 00:12:24,000
Eye to eye

7
00:12:24,000 --> 00:14:48,000
Ending Credits



Question: What are 3 option in chapter?
identifier (optional )
Its for personal use.

Cue timings (required)
What are timing (start-end) to show the chapter/market.

Chapter title (required)
What title when want to show when click on that marker or chatper.