Download source

In this tutorial we are going to show you how to add a combo box to your chat so you can show your status to other logged in users.

If you can connect up to the movie below (light will be green) then login and you will see your name show up in the list with your status next to it. If you change either your name or status it will change automatically. This is what we will go over in this tutorial.

First thing will be to add some components to the stage. The simpleConnect, peopleList, color, chat, and light. Connecting them all up with the simpleConnect component and adding in your connection line.

Be sure to create the directory on the FCS server at this point. We have set ours up on 192.168.0.9.


Name the simpleConnect component connect_cc. We will be accessing one of it's functions later on.


For the combo box, we would want it to match up with the other components, so going into the library under Communication UI Components, take out a FCComboBox and place it on the stage.




In the propery panel insert the appropriate labels for the status you would like (use whatever you like here) to show and name the instance status_lb.

The next thing that we will need to do is change the simpleConnect component code just a bit to add in the label that is in the combobox on the stage. Right click the simpleConnect component and click on Edit or just double click it in the library.

In the first frame of the actions layer go to line 194 line in the actions panel and add:

+"("+_root.status_lb.getValue()+")";



This will add the status next to the name upon the first login.


On line 212 add the same thing. This will be used for when you change your username or status during the chat.

Also, since what we are doing is changing the username you will want to not have it taken from the shared object the next time you come to this page or it will say Username (online) (online).
I'm sure that you would be able to create a code to stop this but the easier way to would just be to not take the username from the shared object. This will also stop the user being logged into the chat automatically. They will be a lurker. For this, just comment out line 79.



Next, going back to the main timeline, add the following line:

status_b.setChangeHandler("loginChange",connect_cc);

This will call the loginChange function that is in the simpleConnect component and change the status of the user automatically.

And that's it. A simple way to add a status function to your chat.

ADDITION
To avoid the status to be displayed in the chat window you can use a server side script to strip it out before it is sent out by the server.
You could for example modify the chat.asc script inside your scripltlib/components folder by adding this function just before the end of the line which reads
trace( "Chat loaded successfully." );

:
// strip out status in username
FCChat.prototype.stripout = function(username) {
   this.statusList = new Array(" (busy)"," (online)"," (lunch)","    (phone)"," (offline)");
   this.statusLength = this.statusList.length;

   // loop through all statuses
   for(i=0; i<this.statusLength; i++) {
   // does username contain a status?
   var challenge = username.indexOf(this.statusList[i]);
   // yes it does
   if (challenge != -1) {
      // strip it
      username = username.split(this.statusList[i]).join("");
      return username;
      break;
      }
   } return username;
}


To call it you should add the following line to the FCChat.prototype.sendMessage method:
cglobal.username = this.stripout(cglobal.username);

I hope this makes sense - don't worry though, you don't have to use the server side stuff, it is optional. If you don't mind displaying the status inside the chat window then just ignore this addition.