Ahmed Nuaman


builder of internets ~ developer of dreams ~ tamer of Dachshunds

The YouTube Player API

Update: keep up to date with my latest code on my Github.

I’ve recently had an article on the YouTube Player API for Actionscript 3 published on the Flashtuts+ network. However, some people are having issues getting to grips with loading another video in-situ, so here’s a slight change to the code:

Once you read the tutorial, you will finish with two important files:

  • YouTubePlayerWrapper.swf – The AS2 wrapper
  • App.as – The AS3 class files

Now the first thing to do in this customisation is to change the name of “App.as” to “YouTubePlayer.as”, therefore our class is now called “YouTubePlayer”. I’ve also added two new public variables called “playerWidth” and “playerHeight”, so the class’s code is now like this:

package
{
    import com.gskinner.utils.SWFBridgeAS3;
   
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.net.URLRequest;

    public class YouTubePlayer extends Sprite
    {
        public static const BRIDGE_NAME:String          = 'YouTubePlayerWrapperBridge';
       
        public var playerWidth:Number                   = 600;
        public var playerHeight:Number                  = 400;
       
        private var player:Loader;
        private var bridge:SWFBridgeAS3;
        private var videoId:String;
        private var loaded:Boolean;
               
        public function init(videoId:String):void
        {
            this.videoId = videoId;
           
            if ( !loaded )
            {
                var request:URLRequest = new URLRequest( 'assets/swf/YouTubePlayerWrapper.swf' );
               
                player = new Loader();
               
                addChild( player );
               
                player.contentLoaderInfo.addEventListener( Event.INIT, handlePlayerLoadedComplete );
               
                player.load( request );
            }
            else
            {
                handlePlayerLoadedComplete();
            }
        }  
       
        public function play(videoId:String):void
        {
            bridge.send( 'playVideo', videoId, playerWidth, playerHeight, false, null, false );
        }
       
        public function stop():void
        {
            bridge.send( 'stopVideo' );
        }
       
        public function handlePlayerLoadedComplete(e:Event=null):void
        {                      
            if ( bridge )
            {
                handleBridgeConnect();
            }
            else
            {
                bridge = new SWFBridgeAS3( BRIDGE_NAME, this );
           
                bridge.addEventListener( Event.CONNECT, handleBridgeConnect );             
            }
        }
       
        public function sendEvent(e:String):void
        {
            trace( e );
        }
       
        private function handleBridgeConnect(e:Event=null):void
        {
            loaded = true;
           
            play( videoId );
        }  
    }
}

Now we can control this class through another base class, so create a file called “App.as” and put this code in there:

package
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.MouseEvent;

    public class App extends Sprite
    {
        private var player:YouTubePlayer                        = new YouTubePlayer();
       
        public function App()
        {
            var button:Sprite = new Sprite();
           
            addChild( player );
           
            button.graphics.beginFill( 0xFF0000 );
            button.graphics.drawCircle( 0, 0, 20 );
            button.graphics.endFill();
           
            button.addEventListener( MouseEvent.CLICK, handleClick );
           
            addChild( button );
           
            player.init( '76aG8wcb8V8' );
        }
       
        private function handleClick(e:MouseEvent):void
        {
            player.init( 'U5A7AjsZHmQ' );
        }
    }
}

All this class does is create a new “YouTubePlayer()”, it the draws a button, adds a listener that loads another video, thus allowing you to see how you can easily and simply load in a simple YouTube Player, like so:

PS: I am going to publish my full YouTube Player API Library for AS3 on github very soon!

Where have comments gone?

Good question my old fruity. I'm now sticking any post discussions on Google+. Why? Well simply it's better. WordPress's comment system isn't very elegant and nor are ones like Disqus or Livefyre, so to save hassle I've just shipped them off to a social network, like a real boss.

Search

My social skills

Latest blog posts

  • Loading posts...

Subscribe in a reader

Latest tweets

  • Loading tweets...