0 Replies Latest reply on Dec 17, 2006 11:23 AM by Northland12

    Customize FLVPlayback skin

    Northland12
      I am following the tutorial entitled "Creating a Dynamic Playlist for Streaming Flash Video" and I am unable to set the playback window size. Here is the original code followed by my attempt. I am new to flash, so I am flying blind here. PLEASE HELP. Here is what is happening now: http://71.129.34.15 (dynamic ip so I will have to update)

      ORIGINAL

      import mx.video.*;
      //Set up the list box, call function VideoThumb to create the actual thumbnails
      list.rowHeight = 70;
      list.cellRenderer = "VideoThumb";
      list.selectable = true;

      //create new empty listener object
      listListener = {};

      nc = new NetConnection(); //create a connection
      nc.connect( nav.attributes.url ); //connect to FCS
      ns = new NetStream(nc); //create a stream
      ns.connect(); //connect the stream

      nc.connect(null);
      var stream_ns:NetStream = new NetStream(nc);
      stream_ns.play("video2.flv");

      // Create function to trace all the status info.
      function traceStatus(info) {
      Message.text+="Level: " + info.level + " Code: " + info.code+"\n";
      } // Assign this function to onStatus handlers when you create objects.


      //Function to handle what happens when an item in the list is selected
      listListener.change = function( evtobj ) {
      var nav = list.dataProvider[list.selectedIndex];
      var reset = true;
      for ( var i = 0; i < nav.childNodes.length; i++ ) {
      var stream = nav.childNodes ;
      if ( stream.nodeName == "stream" ) {
      attachMovie("FLVPlayback", "my_FLVPlybk", 10, {width:320, height:240, x:90, y:100});

      //center the FLVPlayback component when FLV is ready to play
      var listenerObject:Object = new Object();
      listenerObject.resize = function(eventObject:Object):Void {
      //center video in playback area
      newx = (460 - my_FLVPlybk.preferredWidth)/2;
      newy = (470 - my_FLVPlybk.preferredHeight)/2;
      my_FLVPlybk._x = newx;
      my_FLVPlybk._y = newy;
      };
      my_FLVPlybk.addEventListener("resize", listenerObject);
      listenerObject.ready = function(eventObject:Object):Void {
      my_FLVPlybk.setSize(250, 350);
      };

      my_FLVPlybk.skin = "SteelExternalAll.swf";
      my_FLVPlybk.clear();
      my_FLVPlybk.contentPath = nav.attributes.url + "/_definst_/" + stream.attributes.name+".flv";
      my_FLVPlybk.autoSize = true;
      //trace(my_FLVPlybk.contentPath);
      reset = false;
      }
      }
      }



      //Add an event listener on the list, when it triggers, run the listListener function to repopulate the list
      list.addEventListener("change", listListener);


      //Function that loads the XML file, parses it, and builds the list of available video clips
      var xmllist = new XML(); //setup a variable to hold the XML
      xmllist.ignoreWhite = true;
      xmllist.load( "playlist-demo-1.xml" ); //load the XML file
      //The following gets called when the XML has been loaded
      xmllist.onLoad = function( status ) {
      if ( !status )
      trace( status );
      var entries = this.childNodes[0];
      var playlists = {};
      var nav = [];
      for ( var i = 0; i < entries.childNodes.length; i++ ) {
      var entry = entries.childNodes
      ;
      if ( entry.nodeName == "listitem" )
      //builds array of video clip names
      playlists[entry.attributes.name] = entry;
      else if ( entry.nodeName == "menu" ) {
      //builds array of available videos
      for ( var j = 0; j < entry.childNodes.length; j++ )
      nav[j] = playlists[entry.childNodes[j].attributes.name];
      } //end else if
      } //end if

      //sends the array of videos to the listbox UI
      list.dataProvider = nav;
      } //end xmllist.onload


      MY VERSION

      import mx.video.*;
      //Set up the list box, call function VideoThumb to create the actual thumbnails
      list.rowHeight = 70;
      list.cellRenderer = "VideoThumb";
      list.selectable = true;

      //create new empty listener object
      listListener = {};

      nc = new NetConnection(); //create a connection
      nc.connect( nav.attributes.url ); //connect to FCS
      ns = new NetStream(nc); //create a stream
      ns.connect(); //connect the stream

      nc.connect(null);
      var stream_ns:NetStream = new NetStream(nc);
      stream_ns.play("video2.flv");

      // Create function to trace all the status info.
      function traceStatus(info) {
      Message.text+="Level: " + info.level + " Code: " + info.code+"\n";
      } // Assign this function to onStatus handlers when you create objects.


      //Function to handle what happens when an item in the list is selected
      listListener.change = function( evtobj ) {
      var nav = list.dataProvider[list.selectedIndex];
      var reset = true;
      for ( var i = 0; i < nav.childNodes.length; i++ ) {
      var stream = nav.childNodes ;
      if ( stream.nodeName == "stream" ) {
      attachMovie("FLVPlayback", "my_FLVPlybk", 10, {width:470, height:405, x:90, y:100});

      //center the FLVPlayback component when FLV is ready to play
      var listenerObject:Object = new Object();
      listenerObject.resize = function(eventObject:Object):Void {
      //center video in playback area
      newx = (460 - my_FLVPlybk.preferredWidth)/2;
      newy = (470 - my_FLVPlybk.preferredHeight)/2;
      my_FLVPlybk._x = newx;
      my_FLVPlybk._y = newy;
      };
      my_FLVPlybk.addEventListener("resize", listenerObject);
      listenerObject.ready = function(eventObject:Object):Void {
      my_FLVPlybk.setSize(470, 405);
      };

      my_FLVPlybk.skin = "SteelExternalAll.swf";
      my_FLVPlybk.clear();
      my_FLVPlybk.contentPath = nav.attributes.url + "/_definst_/" + stream.attributes.name+".flv";
      my_FLVPlybk.autoSize = true;
      //trace(my_FLVPlybk.contentPath);
      reset = false;
      }
      }
      }



      //Add an event listener on the list, when it triggers, run the listListener function to repopulate the list
      list.addEventListener("change", listListener);


      //Function that loads the XML file, parses it, and builds the list of available video clips
      var xmllist = new XML(); //setup a variable to hold the XML
      xmllist.ignoreWhite = true;
      xmllist.load( "playlist-demo-1.xml" ); //load the XML file
      //The following gets called when the XML has been loaded
      xmllist.onLoad = function( status ) {
      if ( !status )
      trace( status );
      var entries = this.childNodes[0];
      var playlists = {};
      var nav = [];
      for ( var i = 0; i < entries.childNodes.length; i++ ) {
      var entry = entries.childNodes
      ;
      if ( entry.nodeName == "listitem" )
      //builds array of video clip names
      playlists[entry.attributes.name] = entry;
      else if ( entry.nodeName == "menu" ) {
      //builds array of available videos
      for ( var j = 0; j < entry.childNodes.length; j++ )
      nav[j] = playlists[entry.childNodes[j].attributes.name];
      } //end else if
      } //end if

      //sends the array of videos to the listbox UI
      list.dataProvider = nav;
      } //end xmllist.onload