Sunday 2 January 2011

SFS1X: Simple Connect

Hello again. In this tutorial I'll explain how to make a simple Flash application that connects to your server.


You can download the source code of this tutorial here.


First open your Flash and create a new Flash File (ActionScript 2.0).
Create a new Dynamic TextField (using the Text Tool, shortcut key: T) and give it the instance name "status" without the quotes. (Like the following image)


Now the code. Add this simple code to the first frame:

import it.gotoandplay.smartfoxserver.*
stop();

var ip:String = "127.0.0.1";
var port:Number = 9339;
var zone:String = "simpleChat";

status.text = "Connecting..."

var smartfox:SmartFoxClient = new SmartFoxClient()
smartfox.debug = true
smartfox.connect(ip, port)

smartfox.onConnection = function (success)
{
 if (success)
 {
  status.text = "Successfully connected!"
 }
 else
 {
  status.text = "Can't connect!"
 }
}

Here's the explanation of the code:

import it.gotoandplay.smartfoxserver.*

This line imports the SmartFoxClient class.

stop();

This line stops the animation.

var ip:String = "127.0.0.1";

This line sets the variable ip. This variable represents the ip of the machine where the sfs is running, that the Flash application will connect. If the sfs is running in your pc, you can let the ip as 127.0.0.1, but if the sfs isn't running in your pc or you want to publish the Flash application on the web, you need to set the ip as your external ip (the one given from http://www.whatismyip.com/)

var port:Number = 9339;

This line sets the variable port. This variable represents the port where sfs is running (the one configured in the config.xml between the and )

var zone:String = "simpleChat";

This line sets the variable zone. This variable represents the name of the Zone you want to connect. For further explanation about what is a Zone, please check the sfs docs (http://www.smartfoxserver.com/docs/docPages/config/basics.htm#zone)

status.text = "Connecting..."

This line tells the status textField to show the text "Connecting..."

var smartfox:SmartFoxClient = new SmartFoxClient()

This line creates a new instance of the SmartFoxClient object.

smartfox.debug = true

This line sets smartfox's debug flag to true. This way smartfox will output everything that it sends to the server and receives from it. Very useful when developing as it helps solving bugs.

smartfox.connect(ip, port)

This line is the most important in this example. It is the one that makes the SmartFoxClient connect to the previously set ip and port.

smartfox.onConnection = function (success)
{
 if (success)
 {
  status.text = "Successfully connected!"
 }
 else
 {
  status.text = "Can't connect!"
 }
}

This function handles the onConnection event. The onConnection event is fired when it successfully connected or when the connection timed out. It returns a boolean (success) that is true when it successfully connected and is false when it failed connect. When it successfully connects, the status textField shows "Successfully connected" but when it can't connect, it shows "Can't connect".

Tip: Don't forget to set the Local playback security to Access network only. For more information about this, you can check this tip.


You can download the source code of this tutorial here.


And that's all. I hope you enjoyed this tutorial. If you have any questions, fell free to ask me (by commenting or by dropping me a pm in the sfs forums).


Stay tuned for the  next tutorial ;-)

1 comment:

  1. Hi Rjgtav! I am now following your guide to make this flash application. but when I press "check syntax", it said "cannot found smartfoxclient".

    here's the video: http://youtu.be/-pFJLFf1r44

    please help me!!! thanks x 100!

    ReplyDelete