JW Player seek on ready

Question

I have another JW Player question... I've implemented JW Player to replace an image at the top of the page on a button click. That code looks like this:

<div class="series_graphic"></div>
<button class="button-watch1">Watch now</button>

$( ".button-watch1" ).click(function() {
    $( ".series_graphic" ).replaceWith('<div id="player-1">Loading</div>');
    jwplayer("player-1").setup({
        file: "file",
        height: 360,
        image: "file.jpg",
        width: 640,
        autostart: true
    });
 });

I'm working on this for a church, and they would like the ability to watch the whole video and also the ability to jump to a certain portion of the video. I'm thinking I'll implement another button that says "Watch sermon" to accomplish this and use the seek command. I'm having issues implementing it since the player isn't yet loaded when the button is pressed. I assumed I could get it to work by using the onReady command, but I'm having issues making that work... I'm just learning JavaScript so it's all a bit fuzzy to me.

The page is here. It's still very much in progress :D

If anyone could walk me through it, I'd really appreciate it! Thanks!

score 4 · Answer 1 · answered Nov 01 '13 at 20:31

4

To do a seek on ready, something like this would suffice:

<script type='text/javascript'>
 jwplayer().onReady(function() { jwplayer().seek('10') });
</script>

This will seek 10 seconds in when the player is ready.

Hope this helps!

answered Nov 01 '13 at 20:31

emaxsaun

4,191
2
13
13

Thanks for your help! It's still not working – I think it's because my player isn't initialized until the button is clicked and the script runs before that. I tried to have it run onclick on the button, but it still wasn't working. Web Inspector is showing the error that jwplayer is undefined. – anguiac7 Nov 02 '13 at 01:11
HTTP load failed with status 404. Load of media resource http://www.andrewanguiano.com/path/to/dummy.mp4 failed. – emaxsaun Nov 05 '13 at 16:43
The way I have it implemented, you have to click the "Watch full service" or "Watch sermon" button for the player to load the correct file. That's a fix I'll be making shortly. – anguiac7 Nov 05 '13 at 17:36
You should make the initial file actually exist first. – emaxsaun Nov 05 '13 at 18:00

score 1 · Accepted Answer · answered Nov 02 '13 at 21:25

Instead of using replaceWith, I used the JWPlayer load function coupled with a play command on my button. That way, the player would be initialized already when the seek function was read. Here's my code:

<script type="text/javascript">
        function watchSermon(URL,sermonTime){
            jwplayer('player').load([{
                file:URL
            }]);

            jwplayer('player').play()
            jwplayer('player').seek(sermonTime)
            };
    </script>

<button class="button-watch" onclick="javascript:watchSermon('{video_url}','{sermon_start}')">Watch sermon</button>

score 0 · Answer 3 · edited Jul 07 '15 at 06:44

0

If you want the JWPlayer seek you need only to add this parameter: startparam: "ec_seek"

jwplayer("").setup{
file: "http://localhost/video.mp4", 
startparam: "ec_seek",
...
...
...
}

edited Jul 07 '15 at 06:44

bummi

27,123
14
62
101

answered Jul 07 '15 at 06:34

exclussif

41
3

JW Player seek on ready

3 Answers3