eventsadobeosmfstrobe-media-playback

Strobe Media Playback (OSMF) events


Does someone know if Strobe Media Playback (OSMF) has events like:

  1. Streaming is ended
  2. Streaming is started
  3. Streaming error

in order to access it via JavaScript?

I have tried this but no joy.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Strobe Media Playback</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
    <script type="text/javascript">         

        // Create a StrobeMediaPlayback configuration 
        // http://mediapm.edgesuite.net/strobe/content/test/AFaerysTale_sylviaApostol_640_500_short.flv
        // http://osmf.org/dev/1.6-sprint-2/hello-world-jquery-plugin.html#
        var parameters =
            {
                src: "http://stream.flowplayer.org/bauhaus/624x260.mp4"
            ,   autoPlay: true
            ,   controlBarAutoHide: false
            ,   javascriptCallbackFunction: "onJavaScriptBridgeCreated"
            };

        // Embed the player SWF:            
        swfobject.embedSWF
            ( "StrobeMediaPlayback.swf"
            , "strobeMediaPlayback"
            , 640
            , 480
            , "10.1.0"
            , {}
            , parameters
            , { allowFullScreen: "true"}
            , { name: "strobeMediaPlayback" }
            );

        function completeFunc(time, playerId) {
            //var player = document.getElementById(playerId);
            alert("!!!");
        }

        function onCurrentTimeChange(time, playerId)
        {
            document.getElementById("currentTime").innerHTML = time;        
        }

        function onDurationChange(time, playerId)
        {
            document.getElementById("duration").innerHTML = time;   
        }       
        var player = null;
        function onJavaScriptBridgeCreated(playerId)
        {
            if (player == null) {
                player = document.getElementById(playerId);

                // Add event listeners that will update the 
                player.addEventListener("currentTimeChange", "onCurrentTimeChange");
                player.addEventListener("durationChange", "onDurationChange");

                player.addEventListener("complete", "completeFunc");

                // Pause/Resume the playback when we click the Play/Pause link
                document.getElementById("play-pause").onclick = function(){
                    var state = player.getState();
                    if (state == "ready" || state == "paused") {
                        player.play2();
                    }
                    else 
                        if (state == "playing") {
                            player.pause();
                        }
                    return false;
                };
            }
        }
    </script>   
  </head>
  <body>
    <div>
        <div>
            <span id="currentTime" /> ... </span> : <span id="duration" /> ... </span>
        </div>   
        <a href="#" id="play-pause">Play/Pause</div>  
    </div>
    <div id="strobeMediaPlayback">
      <p>Alternative content</p>
    </div>
  </body>
</html>

Thanks!

P.S. As I can see here we can use STATE variable to detect the end of the video. So in the end of the video it goes to "PAUSED". Can we use it in this manner?


UPDATE:

I found that onJavaScriptBridgeCreated method doesn't triggering. The same happens with all examples of SMP.

Any clue?


Solution

  • there it is.

    function changeVidSrc(url, posterUrl, id, width, height, autoplay) {
    
    var flashvars =
    {
        src: url,
        autoPlay: autoplay,
        controlBarAutoHide: true,
        poster: posterUrl,
        skin: 'skinPath', //i just needed skin, remove if not needed
        javascriptCallbackFunction: "onJavaScriptBridgeCreated"
    
    };
    
    var parameters = { allowFullScreen: "true"};
    
    var attributes = { name: id };
    
    // Embed the player SWF:
        swfobject.embedSWF
            ('/swfs/StrobeMediaPlayback.swf',
                id, width, height,
                "10.1.0",
                '',
                flashvars,
                parameters,
                attributes
            );
    
    }
    

    Some important details:
    1. i couldn't let it debug with firebug correctly. i can't understand behaviour.
    2. passing name in attributes object is important for FF. otherwise callback triggers, but no events handled
    i would also advise to put global var player and handler functions on top.