On-the-fly negotiating mediaTypes for viewing in the crossPlayer.

Introduction.

Have you ever spent spent hours and days developing webcontent with embedded media just to find out only 1 out of 4 visitors sees it the way you intended, because they haven't got the plug-in that that does the trick... Well, then you should have a look at this solution.

This showoff centers around the Windows Media Player and Real Player G2. Having an identical mediasource encoded separately for each of these two players should guarantee viewability for any visitor with a 4+ browser nowadays...

Negotiating overview.
This is really quite simple task using the crossProbe. Under normal circumstances the execution of what we're about to describe here would go off automatically as the page is loading, but since the purpose of this page is merely instructional. It will execute on demand by you later on.

The main setup is pretty much a cut and paste job from some other showoff. But instead of just probing for one plug-in and draw the corresponding media-object or some other HTML depending on the detection status, now we're doing a double-probe for two plugs. Then depending on what we have decided to be the first choice mediaType combined with what the end user can view, we pass crossProbe the instructions of how / what mediaType to build.

Negotiation in theory.
We intend to negotiate in the following order;
Alt. 1: Client has got both WMP and G2 : Build WMP style.
Alt .2: Client can do WMP only, shoot Alternative 1.
Alt .3: Client has got G2 but no WMP, build with G2 arguments.
Alt .4: Client has neither of the plugs we wanted, shoot an WMP image.
Detection and negotiation programatically

var isG2, isMP = cp.probeExecute( "Windows Media*" );
if( ! isMP ) isG2 = cp.probeExecute( "RealPlayer(tm) G2 *" );

if ( isMP ) buildAs( "MP");
else if ( isG2 ) buildAs ( "G2" ),
else cp.onfailureHTML = "<IMG SRC='some_image.gif'>";

function buildAs ( mediaType ) {
if (mediaType == "MP") cp.setObjectArguments ( ... MP attributes ... );
else cp.setObjectArguments ( ... G2 attributes ... ) }

There is actually not much more to it, from here we just have to publish the object to the viewer. We could just do a plain HTML flow embedding here, that had been done using the buildObject method, but since we like to showoff , we are using crossPlayer to graphically wrap our mediastream. With this module loaded and prepared, publishing are done using the buildPlayer method. This will cause crossProbe to create a package of HTML concisting of two part crossPlayer specific tags and one part per-browser specific media-object tags containing the attributes we defined earlier with the setObjectArguments method.

-ok, before you click the button below to see if this really works. Not rightclicking on the media-object, can you determine what plug-in is used...

Needed to setup this page:
Required.
crossProbe.js
mediasource / s.
Since we intend to negotiate, we'll need a mediasource formatted atleast to be viewable for two different plug-ins. As we will be using MediaPlayer and Real G2 here, then this should be an ASF and a RM file. We use;
* hated.rm / hated.ram
* hated.asf / heated.asx
 
Mandatory.
crossPlayer_basic.js
crossExt_dragTarget.js
crossExt_fixTarget.js
Recommended order of events in a productional page
Load a HTML document, with the crossProbe embedded.
crossProbe kicks off a loaded event as it's fully loaded.
Use this event to do the initial set-up.
Assign and wait for the window.onload event to go off
Use this event to build and draw the crossPlayer.
Use crossPlayer's onload event to make it visible.
-cheers
Feb 5, 2000, Betty Crossprobe.