In this labs post we will create a basic recorder application which allows a user to record their local video source, including the ability to check the recording, and then to finally submit the recording. (more…)
So how do you set up your JW Player to stream live content? First you would need to simply broadcast a live stream. This can be done using the Adobe’s Flash Media Live Encoder 3:
Then all you will need to do is update some of the variables in the .html of the JW Player. Make sure to add a livestream variable. In the streamer variable, you would put your Influxis rtmp account in place of the X’s.
Here is an example of what the .html code should look like:
<script type='text/javascript' src='swfobject.js'></script>
<div id='mediaspace'>This text will be replaced</div>
<script type='text/javascript'>
var so = new SWFObject('player.swf','mpl','470','290','9');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('file','livestream.flv');so.addVariable('plugins','livestream-1');so.addVariable('streamer','rtmp://XXXXXXXX.rtmphost.com/AppDirectory');
so.write('mediaspace');
</script>
Highlighted in bold you will see the variables you will need to modify. The “file” variable will be set to the Stream name you defined within the Live Encoder and the “streamer” variable will be set to the FMS URL on the Live Encoder.
Once you have updated the .html, place the file in the same directory as the other files that are included with the JW Player.
Begin broadcasting from the Flash Media Live Encoder and the stream should be picked up by the JW Player.
For more information please refer to JW Player’s development wiki:
Guest blogger Seb Lee-Delisle shares his experience broadcasting a remote FlashBrighton session using Influxis TVStation
We’ve been testing out the new TVStation beta from Influxis to broadcast our weekly FlashBrighton meetings. Most meetings are just streams from our webcam, broadcast into the application – all very straightforward, and you can see the recordings here (click on MEDIA to see the on demand content).
It’s a bit of extra effort but we don’t mind – we’re very lucky in Brighton UK to have a thriving digital media scene so we’re happy to share
On the air
We started off encoding within TVStation itself, but this uses Flash Player’s own rather ugly H.263 encoder, I assume built to be processor friendly rather than high quality. Don’t get me wrong – it’s very cool that Flash has this built in and it’s good enough for things like chat roulette (let’s face it, some things you don’t want in too much resolution), but we wanted something a little nicer.
And thankfully we found it! In the snappily titled Flash Media Live Encoder, or FMLE. It’s a free download, currently only available on Windows but an OSX version is coming soon. It takes your camera and turns it into a high quality stream that can broadcast straight to FMS. In other words, it sends the feed into TVStation. The quality is really really good. Compare the Aral Balkan presentation with some of the more recent ones and you’ll see the difference.
Broadcast your screen
So that’s all fine and easy for simple presentations, but what about if we want to broadcast the screen like in David Arno’s presentation? Well there are a couple of simple apps you can download that turn your screen into a webcam.
The one we use is for the Mac and it’s free – CamTwist – which is actually designed to add weird effects to your camera but we ignore all of that cheezy stuff and just use the desktop feature. To get the best quality, increase the size of the camera in CamTwist’s preferences to match the screen size, we find that 1024 x 768 works well.
As David was using a PC he couldn’t use CamTwist, instead he used ScreenCamera, which is $49 but seemed to work well.
Hooking into Skype
So that’s what we’ve discovered so far, but when we decided to have Branden Hall present remotely from Washington DC to our meeting in Brighton, the technology got a little fiddlier! We knew we could have a Skype conversation with Branden, and then he could use Skype’s screen sharing capabilities.
We then use CamTwist to share my entire screen, including Skype. All good so far! Except that you have to specify a microphone for FMLE to use. In my tests at home, I found that my microphone seemed to pick up both myself and the sound from the other end of Skype which was fine.
But I was worried – at the meeting we’d be playing the sound through large speakers and I thought that there may be some echo for Branden. So I plugged in an external piezo microphone into an external M-Audio sound card and placed it near the speakers.
This microphone is what FMLE was broadcasting, but Skype was using my internal microphone. The speakers were pretty loud so I’m thinking that Skype has got pretty damn clever at reducing the echo!
TIP: Set up a new Skype account just for this purpose – otherwise notifications will pop up as your contacts come on and offline!
Hack-tastic!
So this is how we did it. Don’t get me wrong, this isn’t slick. There’s a hell of a lot of re-encoding going on. And the audio from Branden was decoded, converted into audio, picked up by a mic and then converted back to digital again. And then re-encoded! But it worked and is surprisingly good quality.
We’re looking at ways to do this a little more elegantly, and I’m in collaboration with Influxis to create some new tools that may help us to manage all our streams more efficiently.
Watch this space
Seb Lee-Delisle is an expert in Flash 3D, games and physics. He is the CTO at BAFTA winning digital agency Plug-in Media, a member of the Papervision3D team, and manages user group FlashBrighton.
We’re preparing for the release of our new micro-architecture for Flash Media Server developers. The internal codename for the project was Flux, and after a ton of thought and some magic from our awesome Art Director, Wes, we’re ready to reveal the new identity to all of you – Synx Platform. Why Synx? Because a big part of what the platform does is make synchronized communication between multiple connected clients of Flash Media Interactive Server simple. The core of working with remote SharedObjects is the sync message.
We’ve also simplified the overwhelming number of messages that come back from Flash Media Server as NetStatusEvent objects, making it so that you don’t have to parse a NetStatus code to figure out what FMS is trying to tell you anymore, bringing FMS development in sync with where we think it should be. Simple and powerful.
Let us know what you think of the new identity, and stay tuned – this week’s gearing up to be a big week for FMS developers everywhere.
Here at Influxis, we support all the interactive features that Flash Media Interactive Server provides, but the most common use for FMS is still video streaming. Knowing this, we made streaming even easier with Synx.
Just like before, we use the Synx class to get everything set up and ready to use. For playback, we initialize the Synx class with the URI where our videos are located on FMS. After the platform is initialized, we create an instance of the StreamingConnection class and listen for StreamingEvent.READY.
The setup method is pretty simple, too. We create a Video object, attach the stream object’s NetStream to it, then add it as a child to the application. After that, we use the StreamingConnection’s PlaybackController object, stream.playback, to call the addToPlaylist() method for each video we’d like to play, in order. If we want our entire playlist to loop playback, we set the PlaybackController’s loopPlayback property to true. Finally, to start playback, we call stream.playback.play().
That’s all it takes to build a simple video playback application with the Synx Platform. Next, we’ll discuss building a full video player with Synx, and recording video and audio to FMS from the user’s Camera and Microphone objects.
We are excited to have Adobe MAX in our backyard this year, right here in Los Angeles. So we’re asking around and looking at speakers, and realized ‘where are all our European friends?’
So we started asking around – are you guys coming this year? Many of them could not attend for travel costs, tight economies and what not. So we think, ‘these guys definitely need to be here among the Flash family’. Enter MAX Euro Invasion (#MaxEuroInvasion on Twitter). Not all could come, but several were able to accept our invitation.
Quote from Richard Blakely, Influxis co-founder and CEO:
“Influxis is bringing you what we call for lack of simpler terms #MaxEuroInvasion. This is a group of a few of our Euro friends (really family: Joa Ebert, Andre Michelle, Ralph Hauwert, Seb Lee Delisle, and Mario Klingemann) who we have invited to LA to hang out with us and our larger group of friends (again family) and enjoy the Adobe MAX conference. TRULY, a Flash conference is not the same without these guys, believe me…
So in short there are no apparent plans for these guys to speak yet, although the possibility will certainly exist, or you can just meet one of them. This is a cool thing for everyone and we are honored and humbled to have them as our guests. Looking forward to chilling out again guys, see you in LA at MAX!!”
UPDATE (9/8/09): Joa Ebert, Andre Michelle, Ralph Hauwert, and Seb Lee Delisle will be speaking at the FITC Unconference. Thanks to the gang at FITC!
Seb has been working in digital media for over 15 years and is now Technical Director at Brighton-based Flash specialists Plug-in Media. He combines his eye for design and animation with his understanding of math and physics to give his work that extra flare and sparkle. Over the last 5 years he has specialized in Flash games, working with clients such as BBC, Sony, Philips, Unilever, and Barclays.
Seb’s work with Plug-in Media has pushed the boundaries of 3D and physics simulations in Flash, and he is now on the Papervision3D development team.
He is a regular face on the international Flash conference scene, and has presented at Flash on the Beach, FITC, and FlashForward. He is known for his ability to communicate seemingly complex subject-matter in a friendly and accessible way. He is the manager of FlashBrighton, a Flash platform user group.
Ralph Hauwert is a dutch Flash / Flex expert focused on creating compelling expressive content for the Web.
Ralph is a freelance consultant and developer on rich internet applications and websites, focusing on Flex, AIR and Flash.
Currently his work resides in the field of creating new and innovative experiences online, combining technologies like Papervision3D, AS3, AIR, Cairngorm, to create stunning and well architected applications.
Ralph focuses on innovation and cultivating Flash and Flex competence. He has 9 years of Flash Platform coding experience, has presented at several events like Adobe Live, Spark Europe and the Dutch launch events for Flash 8 and Flash Communication Server.
Ralph is working on Papervision3D as one of the core team members, together with project founder Carlos Ulloa and John Grden. He maintains a weblog at UnitZeroOne which is also his outlet for highend Flash solutions.
Mario Klingemann A.K.A. Quasimondo is what you get when you cross the analytic mind of a coder with the creative fervor of an artist and add a little bit of mad scientist mentality to the mix.
In his aim to surprise himself and his audience he constantly tries to explore uncharted territories in order to discover unseen beauty and unthought ideas.
A key factor in his work is the drive to overcome limitations by creatively repurposing and recombining objects and by this revealing their hidden qualities.
His creations have been exhibited in international art shows and won acclaim among critics as exemplary pieces of net art.
He also shares his explorations and discoveries on design and technology conferences and is lead computational artisan at Aviary.com.
Starting about 10 years ago in Flash4 as an autodidact, Andre Michelle repeatedly pushed the limits of Flash possibilities. He recently gave up his freelancer status to work at Hobnox.com (cologne, germany) as chief developer of an online music application in Flash.
UPDATE: Ted Patrick from Adobe (@adobeted) was also excited about them coming and was able to have Adobe sponsor our friends with free MAX passes as well. Many thanks to Ted and Adobe!
Graeme Bull, FMSGuru.com website owner and FMS tutorial video creator, has kindly provided permission to Influxis to use some of his Flash Media Server tutorial videos in our TVStation 2.0 application demo.
Click below picture to go to the TVStation player. For best viewing, click full screen icon on the video player or toggle the chat/info panel.
Click to See FMSGuru Channel
All videos seen here can also be found on www.fmsguru.com, plus many others.
Graeme’s videos include in this TVStation 2.0 channel include:
Tutorial #3: The basics of NetStreams and playing prerecorded FLV files
Tutorial #8: The basics of the Camera object and sending a live stream to the server
Tutorial #10: Dynamically loading the server settings
Tutorial #13: Taking advantage of the new SWF Verification functionality of FMS3
Tutorial #15: Basics of streaming an MP3 file with Flash Media Server
Tutorial #16: Best Practices for the Basics of Development with Flash Media Server (Part 1)
Tutorial #17: Taking advantage of the native bandwidth checking functionality of FMS3
Tutorial #18: Creating a Basic Chat Application with Flash Media Server and Flash
Tutorial #25: The Basics of Working with FMLE and FMS