Skip to main content
matthewg80632478
Participant
December 13, 2015
Question

Can I dynamically resize the incoming video stream without removing/re-attaching new netstream object?

  • December 13, 2015
  • 0 replies
  • 368 views

I am streaming video from Adobe Media Server and playing it back thru the Flash player and it works great. What I'd like is for the video to resize as the user resizes their browser.

In my current implementation it works great as long as the user resizes to a smaller size. In that case the video resizes correctly. But, if they resize it larger then the video itself does not resize.

My guess is that I'm not really resizing the stream and that I'd have to remove the existing net stream and replace it with another one. Is this the correct way to do it and will doing so cause major performance issues? My attempt at doing so is noted below but it had no success.

This is what I have in JS:

    $(window).resize(function(){

  var w = $("#vidContainer").width();

        var h = .56 * w;

      

        var theApp = getFlexApp(attributes.name);

            theApp.jsResizePlayer(w,h);

            $("#videoWrapper").css("width",w);

            $("#videoWrapper").css("height",h);

  });

This is the HTML that wraps the SWF:

    <div id="vidContainer" class="center-block">

  <div id="primaryVideo" class="center displayNone">

  <div id="videoWrapper">

  <div id="flashContent"></div>

  </div>

  </div>

</div>

This is the SWF object embed code:

    swfobject.embedSWF(

                 "/path/to/my.swf",

                    "flashContent",

                 "100%", "100%",

                 swfVersionStr, xiSwfUrlStr,

                 flashvars, params, attributes);

And this is the resize code in the Flash file:

    /**

  * Handles the js call if the user is resizing the browser window

  */

  public function jsResizePlayer(w:int,h:int):void

  {

  this.availableWidth = w;

  this.availableHeight = h;

  this.video.height = h;

  this.video.width = w;

            this.adjustStream(w,h);

  }

        private function adjustStream(w:int,h:int):void {

  video.attachNetStream(null);

  nsPlayer = new NetStream(nc);

  var videoStreamSettings:H264VideoStreamSettings = new H264VideoStreamSettings();

  videoStreamSettings.setMode(w, h, this.incomingStreamFPS);

  nsPlayer.videoStreamSettings = videoStreamSettings;

  video.attachNetStream(nsPlayer);

  nsPlayer.play(incomingStream, "live");

  this.validateNow();

  }

And this is the MXML:

    <s:VideoDisplay id="videoHolder" width="{this.availableWidth}" height="{this.availableHeight}"/>

This topic has been closed for replies.