Red5 Flex2/AS3 Demo :: FLV Stream Player

I went ahead and re-routed some of the guts of my soon to come FLVPlayer to work with Red5 and streaming. This is a Flex2/AS3 app with source so people can have some basic code in getting started with Red5 and Flex2/AS3. This was built with Red5 v0.6RC1.

Source:
Get the updated source

Red5 Flex FLVPlayer

Enjoy!

  1. Nice one John! Looking forward to your final player. I’m especially interested in how you accomplish that the video window resizes according to the browser/flex window (if the user wants to resize maybe). I found out that it’s not that easy. Everything resizes, except the video window.
    Right now I’m working on an application for adding captions to FLV files. I’ve recently finished the FLV browser, based on our own video streaming solution (except the resiziing issue ;)). It would be cool if you want to take a look at it and tell me what you think. It’ located here:
    http://marcelfahle.com/projects/captionproducer/
    (drop me a line for getting username and password)

    Marcel

  2. Yeah, that’s looking/working very nicely Marcel!

  3. I’m such a screwball sometimes – I did this centerUp() method and calculated center and added a listener and everything.

    TOTALLY forgetting that Flex has 2 style settings that DO that for you automatically:

    videoHolder.setStyle(“horizontalCenter”, 0);
    videoHolder.setStyle(“verticalCenter”, 0);

    works BEAUTIFULLY and keeps it centered. Much better than my method did😉

    Just thought I’d share the joy. I’m going to clean up the code and repost the source

  4. Haha, I think in Flex are so many properties/settings for me to discover🙂

    • Chris Jolly
    • December 2nd, 2006

    John, excellent tool… I’ve been looking all over for a decent flash player in flex 2.

    I’m not that familiar with Red 5… I’ve installed Red 5 and can run all the Red 5 demos, so I think the server is working… But when I run FLVPlayer.mxml from Flex Builder 2 I can’t make your player “see” the demo video files on the Red 5 server… Clicking Connect changes to Disconnect, but doesn’t seem to do anything… Do I need to deploy your application somehow, or is there some other settings I’m missing ? I could start working through your code, but thought you might have a couple of hints for a Red 5 novice…

    Thanks and Rock On…

  5. Hey Chris, did you check to see if there are any FLV’s in the oflaDemo/streams folder? If you connect to rtmp://localhost/oflaDemo you will get a green light and a list of movies to choose from in the datagrid below. There’s really nothing more to it than that.

    • Chris Jolly
    • December 3rd, 2006

    Hi John,

    Just can’t get a green light. I’m sure it’s my ignorance of Red 5, so I guess this is really a Red 5 question – sorry for that… I tried Red 5 version 0.5 to see if it was 0.6RC1, but the result is the same. After running the Red 5 Windows Installer I can run the demos – ofla_demo.swf connects to rtmp://localhost/oflaDemo & runs the FLV examples & your CoolDown mp3… But if I open FLVPlayer.html in a browser, when I click Connect it just sits there doing nothing …

  6. Hey Chris, before you hit “connect”, hit CTRL+L to show the Xray debug panel. then hit connect. Hopefully, it’ll give you a status message about what the problem might be.

    • Chris Jolly
    • December 3rd, 2006

    Hi John,

    NOW IT WORKS – GREAT !?!?

    I started to debug your code & got as far as setting a breakpoint in Connect.as, but when I ran the debug version, the green light came on first try… And now the non-debug version also works…

    The only thing I did was to download a new version of the flash debug player – there is an Adobe technote which talks about an issue with Flex Builder 2 – so perhaps this was my problem…

    http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=758bf58b

    In any case, NOW I can get on with the fun part of trying out your player…

    By the way, CTRL+L in my browser (IE7.0) just brings up a file-open pop-up…

    ROCK ON…

    • Chris Jolly
    • December 3rd, 2006

    Hi John,

    I thought you’d like to know that although the flashplayer was a problem, I also can’t make you FLV Player work with the Red5 0.6RC1. When I try to install 0.6RC1 I can’t open http://localhost:5080/ I can open some of the demos but it just doesn’t seem to be installing properly – at least it is not the same behaviour as 0.5…

    No matter – what I’m interested in right now is your FLV player and it works fine with 0.5 on my PC.

    ROCK ON….

  7. yeah, that’s an issue that’s been fixed in the trunk and will be apart of RC2 along with a laundry list of other issues😉

    thanks Chris!

    • Chris Jolly
    • December 3rd, 2006

    Oh now I get it… I looked at the code for XrayLogger.as and see it’s looking for CTRL+SHIFT+L… Tomorrow I will re-install 0.6RC1 and see what XrayLogger says…

  8. LOL sorry, it’s just SHIFT+L, my bad

    • John
    • December 4th, 2006

    I am looking through your code and trying to figure out how to get the duration of the flv video. I see what you are doing withe the metaDataHandler (onMetaData) and it all makes sense to me, but I can’t seem to get it to work. Does this only work with a certian version of FLV? can you suggest any other way to determine the duration of an FLV? Thanks for the help

  9. you need to make sure that the FLV has metadata. If it has metadata, then it works just as it should.

    if you created your FLV with Flash8, then it should be injected for you. If you use Sorenson Squeeze 4.2, it’ll be in there as well.

    • John
    • December 4th, 2006

    ah, so this isn’t something I can count on. I don’t have any control over how the flvs I am going to play are created, so I cannot count on the metadata being set. is there any other way to determine the duration of the flv?

  10. as for doing it server side, maybe FFMpeg could help you out on FLV’s that are uploaded. Other than that, the only tools I know about are client side tools.

    • Nikolay
    • December 12th, 2006

    Hello. I have the problem like Chris Jolly had. Here is what I did:
    1/ installed Red5
    2/ started red5 and tried it’s tests. They worked fine.
    3/ copied FLVPlayer.swf to red5-0.5/webapps/root/demos/
    4/ tried http://localhost:5080/demos/FLVPlayer.swf. The page is displayed, but it the application can not connect.

    using linux ubuntu, red5-05.

    Thank you in advance.

  11. you should be able to use rtmp://localhost/oflaDemo as the connection string (URI) – did you try that?

    try opening the swf in the flash standalone player and see if you can connect that way. If your other apps work, then this one should work without a problem.

    Also, get the latest version of Red5 v0.6RC1:
    http://www.osflash.org/red5/red5downloads#v0.6_rc1

    • Nikolay
    • December 12th, 2006

    Yes, there is rtmp://localhost/oflaDemo in the textbox. Tried to open swf in the flash standalone player and still could not connect.
    I tried Red5 v0.6RC1 but could not compile it (there was a problem when compiling it)

    here is what red5 sais when the FLVPlayer connect button is pressed.

    [java] [WARN] 113066 IoWorker-1:( org.red5.server.net.rtmp.RTMPMinaIoHandler.warn ) Is tcp delay enabled: false
    [java] [DEBUG] 113068 IoWorker-4:( org.red5.server.Server.debug ) Check host and path: localhost/oflaDemo
    [java] [DEBUG] 113068 IoWorker-4:( org.red5.server.CoreHandler.debug ) Connect to core handler ?
    [java] [INFO] 113069 IoWorker-4:( org.red5.io.flv.impl.FLV.info ) File size: 8446642
    [java] [DEBUG] 113162 IoWorker-4:( org.red5.server.adapter.ApplicationAdapter.debug ) appConnect: RTMPMinaConnection from 127.0.0.1:49038 to localhost (in: 3418, out: 3106)
    [java] [DEBUG] 113162 IoWorker-4:( org.red5.server.adapter.ApplicationAdapter.debug ) appJoin: Client: 4 >> [WebScope@8b8a47 Depth = 1, Path = ‘/default’, Name = ‘oflaDemo’]

  12. are you sure it’s not working? That debug seems to indicate that you have connected just fine.

    are you using the version that has the little green light? does it turn green?

    • Nikolay
    • December 12th, 2006

    yes, red5 indicates that connect was successful (like for other red5 examples), but there is nothing displayed in the FLV player and there is no green light to indicate that the connect was successful😦
    What can you suggest?

  13. Try this one instead – I thought I updated that link to the source, but apparently, you have an old version:

    http://www.rockonflash.com/red5/demos/samples/Red5Samples.zip

    • Nikolay
    • December 12th, 2006

    updated, still nothing. May be you can add some log just to console to see what happens and where something fails.
    red5:

    [java] [WARN] 15284 IoWorker-1:( org.red5.server.net.rtmp.RTMPMinaIoHandler.warn ) Is tcp delay enabled: false
    [java] [DEBUG] 15321 IoWorker-4:( org.red5.server.Server.debug ) Check host and path: localhost/oflaDemo
    [java] [DEBUG] 15321 IoWorker-4:( org.red5.server.CoreHandler.debug ) Connect to core handler ?
    [java] [INFO] 15400 IoWorker-4:( org.red5.io.flv.impl.FLV.info ) File size: 8446642
    [java] [DEBUG] 15466 IoWorker-4:( org.red5.server.adapter.ApplicationAdapter.debug ) appConnect: RTMPMinaConnection from 127.0.0.1:51878 to localhost (in: 3360, out: 3106)
    [java] [DEBUG] 15467 IoWorker-4:( org.red5.server.adapter.ApplicationAdapter.debug ) appJoin: Client: 0 >> [WebScope@4204 Depth = 1, Path = ‘/default’, Name = ‘oflaDemo’]

    • Chris Jolly
    • December 14th, 2006

    Hi Nikolay,

    in the end, I gave up with 0.6RC1 for now because it works fine with 0.5 on my machine and at the moment I don’t need the additional features 0.6 provides…

    • Chris Jolly
    • December 14th, 2006

    Hi John,

    I’ve been playing with your code & have been trying to use states & transitions to emulate the way video controls are done in flash. For example, in flash you can hide the controls so that they appear when you mouseOver the video.

    I wondered if you’ve looked at this because I’m finding it difficult to make it work the way I want. For example, if you use the mouseOver event on the video panel, when the controls appear and you mouseOver the control, obviously you’re no longer mouseOver the panel, so it hides the control again…

    I’m sure I can work this out eventually, but it would be a shame to re-invent this wheel if someone had already done this or something similar…

    Thanks & Rock on

  14. Hey Chris, I believe that’s probably a matter of which object you’re listening for mouse events on. Maybe you could just specify a rectangle area that the mouse has to enter rather than an object?

    • Daniel
    • April 15th, 2007

    Hello, well iam newbie on this flex stuff, but i looked what uve done with the flv flex player and its very nice stuff, congrats, since u should know more than me i hope u can help me on this, in your app u have the connect button to do the request to the server, how could i make this automatically, that every times i load the app , brings the videos without pushing the connect button, thanks.

    • Daniel
    • April 15th, 2007

    OK a couple of hours but i finally solve it hahah, here is the answer.. just add a simple line in the initApp function.

    connector.doConnection()

    hah, thanks anyway.

  15. Hi John,

    Nice one! I was able to run your sample successfully.

    I am now importing the project into the eclipse environment. The problem starts when I start to run it from Eclipse when it outputs

    “TypeError: Error #1009: Cannot access a property or method of a null object reference.
    at main/getMediaList()”

  16. Ahh…i finally solved it, its my own fault that i tried running main.mxml instead of FLVPlayer.mxml from Eclipse

  1. November 10th, 2006
  2. November 25th, 2006
  3. November 19th, 2007
Comments are closed.