by Seantron « Influxis Labs

Archive for the ‘by Seantron’ Category

Influxis + AIR for Android = Awesome!

Wednesday, July 21st, 2010

Today Mashable posted an article on how AIR for Android can help Android compete with Apple’s Facetime Mobile Video Chat system which you can find here:

http://mashable.com/2010/07/20/android-video-calling/

Of course we need to wait for Android devices that not only have forward cameras (EVO) but also access to FroYo (Android OS 2.2). But once that happens you can port your own Video Chat code you’ve been using for years with FMS to AIR for Android within 5 minutes!

First, open your Video Chat App and change the Publish Settings to AIR Android. Then add this to your VideoChatApp-app.xml:
<android>
<manifestAdditions>
<manifest>
<data><![CDATA[
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
]]></data>
</manifest>
</manifestAdditions>
</android>

And that’s it! You’ve got your Flash based version of Facetime, but it’s a little bit better, because ours goes to the Web as well. Pretty awesome right? I’ll be updating tomorrow with code for RTMP based Mobile Video Chat and RTMFP based Mobile Video Chat, Multicasting, Audio Chat (Skype), and Text Chat.

Stay tuned!

Tags: Android, Facetime, flash, Mobile Video Chat, Seantron
Posted in FMS Articles, Influxis, News, Research & Development, Tutorials, by Seantron | No Comments »

Smashstream and the future of Flash Media Streaming.

Monday, June 28th, 2010

For a while now, I’ve been talking about the awesome new Real Time Media Flow Protocol (RTMFP), and how it’s a major evolution for the Flash Player. Unfortunately, Peer to Peer server systems are not the easiest things to be blown away by. Who really knows how amazing a Distributed Hash Table is? Or that NetGroups are essentially using a Ring Topology? Answer: less than 100 people.

(more…)

Tags: app, flash, multicast, p2p, peer to peer streaming, real time media flow protocol, rtfmp demo, rtmfp, video chat
Posted in FMS Articles, Influxis, News, Research & Development, by Seantron | 1 Comment »

Game Development with FMS series: The Client Object.

Friday, February 26th, 2010

Welcome to the first in (hopefully) a long series of posts on the secrets of making games with Flash Media Server. Flash Media Server is typically not mentioned when the Flash Gaming Community talks about Multiplayer Development. I’m here to change that, and in order to understand what FMS is able to do, you MUST understand the Client Object.

I’ve noticed that most Flash Developers have gotten into the habit of doing something like this when they are setting up their NetConnection:

nc = new NetConnection( );
nc.client = this;
nc.connect (rtmpAddress);
nc.addEventListener (NetStatusEvent.NET_STATUS, fmsNCStatus);

Actually, a lot don’t even know about the nc.client = this; I think.

It’s time to take our ritalin and put the knives away, because school is in session! First of all, what the hell is the client?

client

property

client:Object [read-write]

Language Version :

ActionScript 3.0

Runtime Versions :

AIR 1.0, Flash Player 9

Indicates the object on which callback methods should be invoked. The default is this NetConnection instance. If you set the client property to another object, callback methods will be invoked on that object.

Um, yeah, that’s whatever, right? Well, it’s actually awesome sauce, the keywords are Callback Methods Invoked, but wait, callbacks from where? The server yo, the freakin’ server that’s where, and no, we are not using Shared Objects. I’ll explain why not later.

Since most flash devs have developed an allergy to AS1 I am going to provide a code template for you that you can use in most cases. You might actually learn to kinda like AS1/JavaScript 1.5, because it’s way easy.

application.onAppStart = function()
{
	this.maxClients = 8;
};
 
application.onConnect = function(currentClient, username)
{
	 	var nClients = application.clients.length;
 
	 	if( nClients + 1 &gt; application.maxClients )
		{
		 	trace("Too many users, rejecting client.");
		 	this.rejectConnection( currentClient);
		 } else {
			 trace("Allow User");
			 currentClient.name = username;
			 application.acceptConnection( currentClient );
		}
		currentClient.transmitChat = function(textChat)
		{
			application.broadcastMsg("receiveTextChat", currentClient.name, textChat);
		}
};
 
application.onDisconnect = function(currentClient)
{
	application.broadcastMsg("clientDisconnect", currentClient.name);
};

That is all the server side code you need for a basic chat application (I know, why is every example a chat?). On starting the app we limit the clients that can connect to 8, this will be very useful for gaming, because we’ll be looking at this later as a ChatRoom. And we’ll later setup another FMS based Application that will be our Authoritative Game Server which will keep track of the Games being played, and which ones are available for more players, or the ability to make your own Private Game. That will be gone over later in the series.

Back to the server code above, most of what we are looking at is inside the application.onConnect. That is the method that is called whenever anyone connects to the Server, and they pass in currentClient (The Current Client Object attached to the person connecting), and their username (A String that you get from your Client Application). Here’s how you would call that from your AS3:

public function initFMS(rtmpAddress:String, name:String):void{
        //Here we instantiate our ClientObject
 
         clientObject = new Object();
 
        //Here we setup our Callback Methods
 
	clientObject["receiveTextChat"] = remoteTextChat;
	clientObject["clientDisconnect"] = remoteClientDisconnect;
 
	//And finally our NetConnection
 
	nc = new NetConnection();
	nc.client = clientObject;
        nc.connect (rtmpAddress, name);
	nc.addEventListener (NetStatusEvent.NET_STATUS, fmsNCStatus);
}
 
public function transmitChat(textChat:String):void
{
	nc.call("transmitChat", null, textChat);
}
 
private function remoteTextChat(username:String, textChat:String):void
{
	currentTextChat = username+": "+textChat+"\n";
	trace(currentTextChat);
	dispatchEvent(new Event(FMSConnectorExample.CHATRECEIVED));
}

Here’s what is going on, clientObject["receiveTextChat"] = remoteTextChat; sets up the Callback function that will be called from the server. The transmitChat method in the AS3 is doing a nc.call(”transmitChat”, null, String(textChat)); which calls what we setup on the server. The server code is:

currentClient.transmitChat = function(textChat)
{
application.broadcastMsg(”receiveTextChat”, currentClient.name, textChat);
}

This is where it gets cool, because application.broadcastMsg is calling receiveTextChat on all of the connected client’s clientObject. So what that does is allow for each client to call the server, pass a string, and then the server broadcasts the string back to all the clients with the sender’s name. Nice right?

Well, that’s cool and all, but how does this apply to games? With this Template you could send Player State Updates, Entire Objects that have Events/Positional Data/Names anything you want really. Just remember the more information you send the slower and more bandwidth intensive it gets. This is also how RTMFP/Flash P2P works as well. It’s all about the client object.

Next post will build off of this code, and will show you a basic game example via RTMP AND RTMFP.

Please leave comments on whether or not this was helpful, or if I need to take it even slower. I’ll be happy to answer as many questions as I possibly can.

Download the code for this tutorial:

ClientObjectServersideExample

Tags: flash, fms, gaming
Posted in FMS Articles, Tutorials, by Seantron | 4 Comments »

Project Variant and a question to the community.

Wednesday, September 23rd, 2009

Last week I posted on twitter a link to this vid:

What the hell was that? The most boring music video ever with the music too loud and a bunch of black at the end (sorry, I made that after a long night of coding at the wee hours of 5AM)?

Yeah, pretty much.

Yes, that was Actionscript 3 driving that hardware accelerated 3d engine. Yes, that was a modified version of the AVM2 or Tamarin VM. Yes, that was 200 Frames Per Second, with a pretty decent amount of polys. Now for what it wasn’t: that was not the flash player rendering that. The awesome Irrlicht 3d engine was doing all of the heavy lifting on that.

Basically, Tamarin set up the Irrlicht 3d engine to run, which was a successful proof of concept that yes, AS3 could be the scripting language for a 3d engine which could rival Unity 3d. Awesome! It also allowed for you to use the Flash Projector to output an executable of your AS3 driven version of Irrlicht, and thus mimics the Adobe Integrated Runtime (a.k.a. AIR) model. That’s doubly awesome! Right?

So? Um, what’s the problem Brosef Stallin?

Have you happened to use Tamarin lately? If you haven’t. . . let me help you get started:

First link is a pdf explaining what the AVM2 does.

Then build it (note: this is the easiest part).

Then add your own Native Classes to it. Welcome to Manifest/Make file hell.

Or, just use the awesome project Red Tamarin to get yourself up and running. You should look at Zwetan’s blog as well for some tasty morsels of knowledge (a seriously smart dude).

Other sources of interest on this subject include: RedRocketServer, Campell Anderson’s Blog, and the Mod-Actionscript Project.

So, if you didn’t notice the pattern here, let me spell it out for you.

1. The AVM2 is in C++, and there is very very very little documentation on it. The Red Tamarin project does the best job at this point of getting you in to the AVMPLUS and Shell libraries (check the avmcore.cpp and avmcore.h to find some morsels of goodness, and then the src/shell/avmshell.h).

2. While it was cool that Adobe released the AVM2 to the public, they didn’t release the rest of the Flash Player to you. It’s like trying to learn how an automobile engine works with just the transmission (I don’t know I’m not a car guy). You don’t have any access to the display/GUI at all. It’s almost a dead end.

3. The only way to compile your .AS code with the avmplus.exe is via the command line open source Flex Compiler. Which is very scary to a lot of people. Yeah, I could write a python script or something for you, but it will still not be pretty. And it would be too much work for all but the most Obsessive Hackers out there.

4. Did I mention we had to modify the AVM2 for all of this? So that means this will not work in the Holy Grail. . . the Flash Player. Although, I could use the QT Framework and bust out a cross platform browser plug in that would run Irrlicht in the browser via your AS3 script. But that’s a plug in that people have to download! Gasp! And then the whole reason for using flash kinda goes out the window right? We give up the godlike(all together now) Flash Penetration Rate for a 3d engine that can output more then 20,000 polygons without having to jump through hoops of fire.

Now, I’m going to go interactive on you! Get ready yo. . . a question!

What do you guys think? Would you like Variant to be built out? Would you use it if I spent my precious (imagine my adorable family crying right now) time on this? Could we get someone from Adobe to weigh in on this? I know that I could build this out for the new version of AIR that is going to be released with a Native Code API. Do you guys even freakin’ care about high resolution/high framerate 3d in flash? Would you like a new IDE like Unity 3d but with the option to treat every 3d object like a MovieClip?

Please, feedback is welcome. Oh, and do you want the .exe example that is shown in the video to play with?

Good night and good luck.

P.S.

If you were interested in the AVM2 and would like to follow Red Tamarin please follow @zwetan

And if you are interested in Red Rocket Server, please follow @campbell

They deserve twitter love, they are awesome.

Tags: AVM2, flash, Hacking the Flash Player, Tamarin
Posted in Research & Development, by Seantron | 12 Comments »

Multipass framework to be unveiled @ FITC Unconference @ Adobe MAX

Thursday, September 10th, 2009

Just wanted to give everyone a heads up that Multipass will be launched at my new Presentation: Become a FMS Samurai with Multipass at FITC’s Unconference. It’s going to be 30 minutes of FMS sweetness.

It’s truly an honor to be presenting with such an amazing line up that includes:

Seb Lee-Delisle

Joa Ebert

Andre Michelle

Ralph Hauwert

Chuck Freedman

Grant Skinner

Colin Moock

Phillip Kerman

Ryan Stewart

and many more!

May the force be with you.

Posted in Influxis, News, by Seantron | 1 Comment »

MultiPass FMS Framework Sneak Peek

Friday, August 14th, 2009

We here at Influxis understand that Flash Media Server isn’t the easiest thing to pick up, so what have we done to show you we truly have your back?

Random Flash peeps behold!

MultiPass

The Flash Media Server Framework for Rapid Prototyping and Flash Multiplayer Game Development.

Sounds pretty sweet, eh? What’s that, you want to see an example? Sure thing, check it:

public class SimpleChatExample extends Sprite
{
private var multipass:MyMultipass;
private var lock:Boolean = false;
 
public function SimpleChatExample()
{
enterButton.label = "enter";
enterButton.addEventListener(MouseEvent.CLICK, enterChat);
}
 
private function enterChat(e:MouseEvent):void
{
if(username.text != ""){
multipass = new MyMultipass();
multipass.addEventListener(MyMultipass.READY, initChat);
stage.addEventListener(KeyboardEvent.KEY_DOWN, sendChat);
}
}
 
private function initChat(e:Event):void
{
addEventListener(Event.ENTER_FRAME, statusUpdate);
//Here is where the Magic Starts!
//Set your UserName!
multipass.api.userName = username.text;
//Attach Your Chat Room
multipass.api.attachChatController();
//Listen For Other Client's Updates
multipass.api.addEventListener(MultiPass.CHATUPDATE, updateChat);
//Connect your RTMP!
multipass.api.connectFMS("rtmp://yourRtmpAddress.com/MultiPass/");
}
 
private function sendChat(e:KeyboardEvent):void
{
if(e.keyCode == Keyboard.ENTER)
{
output.appendText(username.text + " : " + input.text + "\n");
multipass.api.chatController.sendTextChat(input.text);
input.text = "";
}
}
 
private function updateChat(e:Event):void
{
output.appendText(multipass.api.chatController.message + "\n");
}
 
private function statusUpdate(e:Event):void
{
fmsStatus.text = multipass.api.status;
 
}
 
}
}

That is all the code it takes to make a fully operational Simple Chat Room system.

Basically, what MultiPass is doing is it’s going to be the FMS Controller for you. It’s completely separate from the View. Also with MultiPass the horror of having to code Actionscript 1 serverside is taken care of for you.

That’s not all! MultiPass also will connect all of the various bits and pieces of FMS Prototype for you, so no more issues with calling your play function before bwDone() or anything like that.

Think of it like this: if you want to add a Room List to that simple Chat Room you would do something like

multipass.api.attachRoomList();
multipass.api.addEventListener(MultiPass.ROOMUPDATE, updateMyRoom);

Easy right? Next week I’m going to have my first Multiplayer game example “How to make a Multiplayer Racing Game”.

If you have any questions or ideas feel free to follow me on twitter:

www.twitter.com/seantron

Posted in by Seantron | 1 Comment »

Flash & Flex Developers Magazine to be FREE!!

Monday, July 27th, 2009

The August/September 2009 issue (Volume 2, Issue 6) of FFD Magazine will mark a transition for the publication. It is the last printed edition of this great publication. Check for the issue Borders or Barnes & Noble stores.

Starting in September 2009, FFD Magazine will become a 100-percent digital publication. The coverage will not change, only the format. Also there will be one significant change – the magazine will be free!

If you are not the Flash and Flex Developer’s Magazine newsletter subscriber – do it now and you will get the September issue straight to your inbox.

Download Free Archive issues

ARE YOU A DEVELOPER WITH A STORY?

Want to submit an article for Flash & Flex Developers Magazine?

Contact:
Ewa Samulska, Marketing and Editorial Manager
Email: ewa.samulska@ffdmag.com
Phone: 1-917-338-3631
Website: www.ffdmag.com
Twitter: http://twitter.com/flashandflexmag

Tags: developer, FFDMAG, flash, flash magazine, flex, free
Posted in News, Tutorials, Uncategorized, by Seantron | No Comments »

Massiva3d Tutorial Version 1 (the basics)

Monday, May 11th, 2009

Massiva3d is written to take a lot of the headaches out of creating your own 3d MMO system. Unfortunately, 3d is difficult, especially in Flash. So, if you are just learning Away3d or Papervision this might be an intermediate to advanced level tutorial. This is also written specifically for the Developers that are going to build their own world. I will be writing more tutorials in the future on how the 3d assets should be made/implemented, but for now, I’m just trying to lay out enough to get you started.

What you will need

An Influxis hosting account (any size will do).
You will need Flash CS4 to open the FLAs. The reason for that is Massiva3d uses the Flash10 branch of Away3d.
If you have 3d Studio Max you will need this: http://drawlogic.com/2007/07/30/as3-geom-class-exporter-for-3ds-max-for-pv3d-sandy-and-away3d/
If you don’t have 3d Studio Max you will need this: http://www.blender.org/ (or a script for your favorite 3d that will export your model to .AS3)
Once you have Blender installed, you’ll need this: http://www.rozengain.com/blog/2008/01/02/export-your-blender-objects-straight-to-away3d-papervision3d-and-sandy/ This will allow you to export your model directly to AS3 code that you will import into either your AvatarAssets or CityAssets.fla. I suggest using this way as opposed to importing a DAE/Collada file due to how much XML is needed to be parsed in Collada files. They are bloated and slow.

(I’m currently creating an Air App that will allow you to convert your .OBJs/3dsMax/DAE to AS3, so soon you will not need Blender specifically).

The Asset Workflow

There are 4 swfs (AvatarAssets.swf, CityAssets.swf, ExternalAssets.swf, Massiva3d.swf) and 2 XML files (Massiva.xml, Settings.xml) that makeup Massiva3d. Here is a brief explanation of each file:

AvatarAssets – This is the file that you will output with your Animated Avatars and your Avatar Skins/Materials. The Avatar Assets were seperated from the city assets for loading purposes. This will also include the 2d version of all of your Avatars.
CityAssets – This is the file that you will output with your City/Environment 3d Assets/Materials in. Your CityAssets will be loaded in the background while the user is selecting/personalizing their Avatar (thus making a shorter load process for your App).
ExternalAssets – This is the file that includes all of the art assets for the app. I have included everything you need in the FLA, so just restyle the assets to your liking and output the SWF. All of your changes will be seen instantly.
Massiva3d.swf – This is the engine (you may want to wrap this in a preloader depending on how many Avatar/City assets you will be loading).
Settings.xml – this is the file that includes your RTMP path.
Massiva.xml – this is the file that points to all of your AvatarAssets/CityAssets. The City Assets will be able to be positioned via this file as well.

AvatarAssets.swf/FLA

Please open the AvatarAssets.fla in Flash CS4, and go to the library. There you will see all how I setup all of the Skins/Materials for the 3d avatars and all of the 2d assets for each different avatar (all of the .PNG files are for the Billboarded version of the avatar).

If you open Massiva.xml and scroll down to the area that has these lines:

Notice that the 2d = “Woman1″ is pointing to the Linkage that I setup for the Woman1.png in the AvatarAssets.fla. That is how you set up the Billboarded version of your avatar.

Now please open the AvatarAssets.as file found in the src folder, and you will notice a bunch of imports and some public vars. What I am doing with this, is allowing the files to be pointed to and instantiated by the Massiva3d.swf via the XML (<female avatar = “src.ExternalAni8″).

Now the hard part. If you haven’t created an animated 3d asset with Away3d there is a good tutorial on how to do that here: http://away3d.com/tutorials/tutorial-how-to-use-the-animator-class. I’ve also included my own Avatar files that you may use in your own App. If you do decide to create your own Animated Avatars I have created the ExternalAni.as files as a template for you to use. I have setup the Avatar files to assign their own Material inside the ExternalAni.as Files.

For the moment the Animator that you create has to be named ani, and only 2 AnimationSequences are seen by Massiva3d. Idle and Walk (Idle will be played when your avatar is not moving, and walk of course will be played as your Avatar is walking).

Massiva3d creates 2 avatars for you once your assets are loaded. It instanciates your 3d Animated Avatar, and it creates a Sprite2d out of the .PNG file that you include in your AvatarAssets library. Why it does this is it loads the 2 versions into a Level of detail object. Why I’ve set that up is, if the avatar is far away from the user the Level Of Detail Object will switch out the 3d Avatar to the Sprite2d (which frees up all of those used Tris, and doesn’t bog down the client’s system).

This also leads to one of Massiva’s most powerful features: Proximity based billboarding. What this does, is if the Frames Per Second of the client drops too low Massiva will start to switch out the Avatars from 3d to 2d based on Proximity to the User’s Avatar. This system will basically keep swapping out the 3d avatars to 2d Avatars until the system is at a level that is can handle it. I set this up due to the natural tendancy for users to cluster close together. This would kill the flash player usually, think of 15 Avatars at 300-500 triangles a piece all clustering together. Depending on the system, flash is able to deal with 1500-2000 tris in such an environment (I say that due to the camera movement, and the lack of static assets).

*Note: when creating 3d Avatars for Massiva3d (or Flash 3d in general) you really REALLY need to take into account how many Polys/Tris you are alloted for each Avatar. I suggest less then 500 tris per avatar (yep, that’s 250 Polygons), you might be able to get away with more, but it’s going to be a CPU hog.*

CityAssets.swf/FLA

This is pretty much setup the same way as the AvatarAssets.fla was setup. I just want to go over a little of the XML in Massiva.xml and how it correlates to CityAssets.

The world is made up 9 planes. And each of these planes are assigned their material in order via the materials stored with linkages in the CityAssets.swf library.

These lines should be pretty self-explanitory. I will explain the 2d property next.

This is a cool feature that is in Massiva3d. If you keep the building property blank, and you set 2d to “yes” this will create a Sprite2d asset for you. That line is creating a tree. Sprite 2ds are great for anything that you don’t want to waste Polys on. Background assets like, Trees, Flowers, Mountains, Clouds, would all look great using this technique.

Another cool feature of Massiva3d is that any of the 3d City Assets will have a rudimentary Collision Detection in place. Unfortunately the 2d assets have no collision detection at the moment. I will be implementing Jiblib’s collision dectection shortly.

External Assets

This FLA includes all of the artwork that implements the User Interface. Since this is a beta release there is very little built in to move around the assets at the moment. I will be rolling out advanced controls over the placement shortly.

That concludes the overview for Massiva3d. If you have any questions or any requests please feel free to e-mail:

massiva3d (at) influxis (d0t) com

Posted in Research & Development, Tutorials, by Seantron | 1 Comment »

The Stratus Sessions vol. 1

Thursday, December 18th, 2008

Seantron

Adobe Labs has just released the beta of Stratus which is the highly anticipated launch of the RTMFP protocol. RTMFP (Real Time Media Flow Protocol) is a Peer 2 Peer technology built on top of UDP (User Datagram Protocol or as I like to call it Unreliable Data Protocol, joking! Well. . . maybe not). This is a big step forward for FMS (since Stratus has to use FMS to connect the peers), for Multiplayer Gaming, and VoIP applications.

I’ve been researching Stratus for the last few days now, and I wanted to share my findings. Hopefully this will help get some of you adventurous types up and running. You can get your Developer Key from here.

This level of difficulty is around Intermediate to Advanced, I’m going to do my best to make it as plain as possible, so good luck. I am going to just go through the steps of setting it up, and explain as I go.

Click here to start presentation.

Click here for code.

Posted in Research & Development, by Seantron | 5 Comments »

FMS, Flash Lite 3, Nokia, and the Security Sandbox of fun

Tuesday, October 21st, 2008

I know a lot of you have wanted to play with Flash Lite 3 and experience the joys of seeing your work on a mobile device, but who has the time? Well, apparently, I do.

It’s theorectically easy to get FMS and Flash Lite 3 up and running. Why I say theorectically is because I’ve already had issues with getting my Nokia N95 up and streaming. I’ve also heard that it is a problem localized to Nokia phones. Here’s the issue: you would think to move over your application into your Phone Memory(C:)/Data/Other folder, and just fire it up from your Gallery section. Wrong (cue silly trombone music) thanks for playing. If you were like me, you would’ve been staring at the loading screen for what seemed to be hours thinking to yourself, “I know I’m in Albuquerque, but this connection is ridiculous!”

Well, it’s beyond ridiculous, the connection doesn’t exist. In order to allow flash player to connect to the Mobile interweb on a Nokia you have to press Up, Up, Down, Down, Left, Right, Left, Right, B, A, Select, Start (if you got that joke, congratulations, you are old like me). Here’s the actual secret mojo that you have to perform: create a new folder labeled Trusted in your C:/Data/Other and place your .swf in there. Then (if you’ve done everything correctly), you should be asked which connection the device should use to access the internet. And voila! You are almost done.

This code that I am including is only the client side. What you’ll need to do is also do some server side magic (bandwidth profiling manually due to the native bandwidth check not working with Flash Lite 3), and developing video for the right bitrates.

If anyone is interested in the clientside stuff, leave some comments, and I’ll post that at a later date.

Download tutorial FLV

Tags: Flash Lite 3, fms, Nokia, Security Sandbox
Posted in FMS Articles, Research & Development, Tutorials, by Seantron | 1 Comment »

Influxis Flash Media Interactive Server 3.5 Hosting Specialists