Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

How to control JW Player 5.3 with javascript when using swfobject?


I wish to use javascript to control the JW Player (version 5.3) whilst using swfobject to embed. I have run into an issue (of scope?) - I cannot figure out how to make calls to the javascript API from outside the swfobject callback function. Is this possible?

For example, how could this be made to work? :

bc.. code hopefully to follow in next post... frustrating JW spam filter kept blocking it!?



Apologies for the newbish nature of my post, and thanks very much for anyone who responds!

4 Community Answers

JW Player

User  
0 rated :

For example, how could this be made to work? :

bc.. var flashvars = { file:"/videos/video.mp4" };
var params = { allowfullscreen:"true", allowscriptaccess:"always" };
var attributes = { id:"player", name:"player" };

swfobject.embedSWF("/jwplayer/player.swf", "container", 320, 240, "9.0.115", "false", flashvars, params, attributes, flashLoaded);

function flashLoaded(e) {
// e.ref is a reference to the Flash object. We'll pass it to jwplayer() so the API knows where the player is.
// Add event listeners
jwplayer(e.ref).onReady(function() { alert("Player is ready"); });
jwplayer(e.ref).onPlay(function() { alert("Player is playing"); });

// The below would work from within the callback...
// jwplayer(e.ref).play();
}

// But outside of the flashLoaded callback, it wouldn't work...
// For example if you wanted to make a play/pause button...
jwplayer(e.ref).play();



An example of a button that wouldn't work:
bc.. <a href="#" onlick="jwplayer(e.ref).play();">play/pause</a>

JW Player

User  
0 rated :

Alternatively, is it possible to make the jwplayer.js embed method, only render Flash, and then fall back to the no flash content. (bypassing the HTML5 player and download fallback)... i.e. is it possible to make the jwembed behave like the swfobject embed?

This is because I want to provide customised alternate content in any situation where flash isn't available; and that's the reason that I wanted to use the swfobject embed in the 1st place.

JW Player

User  
0 rated :

When using swfobject, you can use the playerReady() function to assign the player to a variable so that you can access it elsewhere.

Here's a working example:
http://osric.com/chris/jwplayer/jwplayer5.4/javascript-play-pause.html

See this section in the Javascript API documentation: http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v4/12209/javascript-api-reference#initialization

As to your second question, you can also use the jwplayer.js embed method and the newer Javascript API and bypass the HTML5 player using the players option block. Here's an example--I just commented out the HTML5 player option:
http://osric.com/chris/jwplayer/jwplayer5.4/no-html5.html

(I tested this on an iPad and in Firefox with the Flash plugin disabled. It displays a "No suitable players found" message.)

See the Players section of the JW Embedder Reference Guide:
http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v5/15995/jw-embedder-reference-guide

Hope this helps.

JW Player

User  
0 rated :

Thankyou so much Chris! Fantastically helpful. Just working through it all now...

When I'm finished, I'm going to have a nice little script called "jwresume.js" which upon unLoad will write out the current playlist, selected item, position and state to a cookie, and recall and resume the player where it left off after a page change/refresh for a website with a persistent media player. I'll be sure to post back once I'm done for the benefit of others... (I saw the subject mentioned in the forums a year or so ago, but all the example links are now dead and the player's been through a couple of versions, so I'm starting again from scratch).

With regards to the players block to disable HTML5: I had already tried this, but what if you don't want the "no suitable players" message and the JW watermark? Would you have to use javascript to completely remove the element when it hears a failedLoad event or something?

This question has received the maximum number of answers.