Tutorials

Beginnings of tutorials. Resource list of helpful docs online. I usually do live "consulting", but rarely a formalized tutorial. Perhaps I should enhance my teachery nature...

 

JW Player Embedded

Question: How to embed JW Player in any Flash file?

Here's all the necessary resources and more:

Basic embed Flash in html: http://www.longtailvideo.com/support/tutorials/Embedding-Flash
Embed JW Player in Flex: http://developer.longtailvideo.com/trac/wiki/FlexEmbedding
JW Player API: http://developer.longtailvideo.com/trac/wiki/FlashAPI
JW Player flashvars: http://developer.longtailvideo.com/trac/wiki/FlashVars
load external SWF in Flash stage: link
LONG forum posts: http://www.longtailvideo.com/support/forum/Setup-Problems/11830/Embeding-JW-player-4-0-in-a-flash-website-AS3-
more... http://www.longtailvideo.com/jw/?search=embed+flash

Thanks to some members in the longtail forum, I frankensteined a working presentation without being very familiar with AS3. See example here:
sample portfolio

JW specific imports, or you can import all JW stuff:

import com.jeroenwijering.events.*;
import com.jeroenwijering.player.*;
import com.jeroenwijering.plugins.*;
import com.jeroenwijering.utils.Configger;

Optional, store a URL string of the player with parameters, like size, autoplay etc.

To keep things simple, put all files (yes html, player files, host SWF, all videos) in the same directory. My version did organize elements into a nice folder hierarchy. Though since referencing parent folders (eg ../parent) doesn't work perhaps due security or silly syntax, my videos folder is in the player folder. I dislike this hierarchy in terms of strict relations, but at least folders separate element types cleanly.

Link in the SWF JW player by the procedure in the above Adobe page, using a Loader object. Take care relative directories in the URL is relative to the html page caller, not the host SWF caller.

Note relationship: html page -> your custom SWF -> embedded (loaded) JW Player SWF

Then some good event handlers as the bulk of you customization:

function loaderHandler(e:Event) //SWF player loaded
function playerReady(e:Event=null) //initialized. Now use the API to send/receive
function resizePlayer(), buttons etc //the interactive UI bulk

Then much of the UI connections just take time. You can see I retained the standard JW skin. You can replace it, use all your own controls etc. All the controls still work, except fullscreen, which I need to somehow intercept and relay to a correct parent "window".