Detecting when a video cannot be loaded by the Spark VideoPlayer control in Flex 4

The following example shows how you can detect when an error was encountered while trying to play media using the Spark VideoPlayer control in Flex 4 by listening for the mediaPlayerStateChange event and checking for the playbackError state.

Full code after the jump.

The following example(s) require Flash Player 10 and the Adobe Flex 4 SDK. To download the Adobe Flash Builder 4 trial, see www.adobe.com/products/flex/. To download the latest nightly build of the Flex 4 SDK, see opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.

For more information on getting started with Flex 4 and Flash Builder 4, see the official Adobe Flex Team blog.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/12/15/detecting-when-a-video-cannot-be-loaded-by-the-spark-videoplayer-control-in-flex-4/ -->
<s:Application name="Spark_VideoPlayer_mediaPlayerStateChange_playbackError_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark">
    <s:controlBarContent>
        <s:Button label="Good source" click="vidPlyr.source = goodStream;" />
        <s:Button label="Bad source" click="vidPlyr.source = badStream;" />
    </s:controlBarContent>
 
    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import org.osmf.events.MediaPlayerStateChangeEvent;
            import org.osmf.media.MediaPlayerState;
 
            protected function vidPlyr_mediaPlayerStateChangeHandler(evt:MediaPlayerStateChangeEvent):void {
                switch (evt.state) {
                    case MediaPlayerState.LOADING:
                        vidPlyr.errorString = "";
                        break;
                    case MediaPlayerState.PLAYBACK_ERROR:
                        Alert.show("Unable to load video", evt.state);
                        vidPlyr.errorString = "Unable to load video";
                        break;
                }
            }
        ]]>
    </fx:Script>
 
    <fx:Declarations>
        <s:DynamicStreamingVideoSource id="goodStream" host="rtmp://fmsexamples.adobe.com/vod/" streamType="recorded">
            <s:DynamicStreamingVideoItem streamName="mp4:_cs4promo_1000.f4v" />
        </s:DynamicStreamingVideoSource>
 
        <s:DynamicStreamingVideoSource id="badStream" host="rtmp://fmsexamples.adobe.com/vod/" streamType="recorded">
            <s:DynamicStreamingVideoItem streamName="mp4:_cs4promo_404_1000.f4v" />
        </s:DynamicStreamingVideoSource>
    </fx:Declarations>
 
    <s:VideoPlayer id="vidPlyr"
            loop="true"
            muted="true"
            left="100" right="100"
            top="100" bottom="100"
            horizontalCenter="0" verticalCenter="0"
            mediaPlayerStateChange="vidPlyr_mediaPlayerStateChangeHandler(event);" />
 
</s:Application>

This entry is based on a beta version of the Flex 4 SDK and therefore is very likely to change as development of the Flex SDK continues. The API can (and will) change causing examples to possibly not compile in newer versions of the Flex 4 SDK.

9 thoughts on “Detecting when a video cannot be loaded by the Spark VideoPlayer control in Flex 4

  1. Great Blog!
    With the final release of Flex 4 it seems the syntax for playing a live streaming video has been set.
    I cannot get the spark VideoPlayer or VideoDisplay component to play a Live stream.

    i’ve tried using a string as the source.
    i’ve tried passing the DynamicStreamingVideoSource, just as you have above except setting streamType equal to “live”

    tracing out the MediaPlayerStateChangeEvent i get the following:

    event:MediaPlayerStateChangeEvent -loading
    event:MediaPlayerStateChangeEvent -ready
    event:MediaPlayerStateChangeEvent -playing
    event:MediaPlayerStateChangeEvent -playbackError

    I know that the live stream is streaming, because
    I can playback the exact same live stream, using the traditional NetConnection, NetStream code.

    I cannot find any documentation, on how to determine the cause and/or to troubleshoot a MediaPlayerStateChangeEvent -playbackError..
    (
    Thanks Again for this blog, I’ve learned more here than from any other source!
    drew

    1. @drew b,

      Any chance you can post the URL to the live stream? I can try talking a look tomorrow and checking with some OSMF folks and double check. I’ve only touched the Spark Video controls a little bit, but don’t have much/any experience with live streaming specifically.

      Peter

  2. I don’t currently have a way to have a live stream going 24/7.
    i have to start it up and publish to it for it to be an active live stream.

    i still haven’t solved it.. it’s frustrating..
    i posted to wowza forums, and they are helping.

  3. Hi,

    I’m having some problems with the VideoPlayer streaming F4V content from behind a firewall. Should it switch over to RTMPT automatically if it can’t connect using RTMP or does this need to be done manually?

  4. Ditto on drew b’s comment, digging into the error handling for this VideoDisplay component seems to be a royal PITA, any pointers to docs on this Peter? Cheers, Simon

    1. @Simon,

      I’m not overly familiar with the Video documentation in Flex 4+. Can you please file a bug, and Adobe can take a look at improving error handling (either at the Flex SDK level or OSMF level), and improving the documentation.

      Thanks,
      Peter

Comments are closed.