Unionチャットサンプル

http://fla.la/archives/364
Union Platform(5) チャットを作る
解説用コードです。　updated 2009.09.07 alpha4対応
@author Copyright (C) naoto koshikawa, All Rights Reserved.

naoto5959

forked:2
favorite:6
lines:588
license : MIT License
modified : 2009-09-07 10:45:45

Embed: Tweet

package  
{
	import com.bit101.components.*;
	import flash.display.*;
	import flash.events.*;
	import flash.net.*;
	import flash.ui.Keyboard;
	import net.user1.logger.*;
	import net.user1.reactor.*;
	import org.libspark.betweenas3.*;
	import org.libspark.betweenas3.easing.*;
	import org.libspark.betweenas3.tweens.*;
	
	/**
	 * http://fla.la/archives/364
	 * Union Platform(5) チャットを作る
	 * 解説用コードです。　updated 2009.09.07 alpha4対応
	 * @author Copyright (C) naoto koshikawa, All Rights Reserved.
	 */
	public class TryUnion2 extends Sprite
	{
		//----------------------------------------------------------------------
		//  static properties
		//----------------------------------------------------------------------
		//------------------------------
		//  public static properties
		//------------------------------
		/**
		 * 接続先Union Server host
		 */
		public static const UNION_SERVER_HOST:String = "tryunion.com";
		
		/**
		 * 接続先Union Server port 
		 */
		public static const UNION_SERVER_PORT:Number = 9100;
		
		/**
		 * Room ID 
		 */
		public static const ROOM_CHAT:String = "com.asmple.union.chat";
		
		/**
		 * アバターURL
		 */
		public static const AVATAR_URL:String = "http://swf.wonderfl.net/swf/usercode/a/af/afe5/afe5412cf117b348681e9eb6e3595035cabd06e6.swf";
		
		/** 
		 * アバターの向いている方向(上) 
		 */
		public static const DIRECTION_UP:uint = 0;
		
		/**
		 * アバターの向いている方向(右)
		 */
		public static const DIRECTION_RIGHT:uint = 1;
		
		/**
		 * アバターの向いている方向(下)
		 */
		public static const DIRECTION_DOWN:uint = 2;
		
		/**
		 * アバターの向いている方向(左)
		 */
		public static const DIRECTION_LEFT:uint = 3;
		
		//----------------------------------------------------------------------
		//  properties
		//----------------------------------------------------------------------
		//------------------------------
		//  private properties 
		//------------------------------
		/**
		 * ユーザーインターフェース
		 */
		private var _ui:UnionChatUI;
		
		/**
		 * ClientグローバルAttribute　の初期値を格納します。
		 */
		private var _clientData:Object = {};
		
		/**
		 * Reactor
		 */
		private var _reactor:Reactor;
		
		/**
		 * Room Manager
		 */
		private var _roomManager:RoomManager;
		
		/**
		 * ReactorのLogger
		 */
		private var _logger:Logger;
		
		/**
		 * 現在のRoom
		 */
		private var _room:Room;
		
		/**
		 * 自身のClient
		 */
		private var _self:IClient;
		
		/**
		 * avatarのIDs
		 */
		private var _avatars:Object = { };
		
		/**
		 * 現在テキスト入力中かを判別します。
		 */
		private var _isInputText:Boolean;
		
		/**
		 * join or observe
		 */
		private var _attempt:String = "";
		
		//----------------------------------------------------------------------
		//  methods
		//----------------------------------------------------------------------
		//------------------------------
		//  public methods
		//------------------------------
		/**
		 * 一番最初に実行されるメソッドです。
		 */
		public function TryUnion2() 
		{	
			// ユーザーインターフェースを作成します。
			addChild(_ui = new UnionChatUI());
			_ui.currentStatusLabel.text = "connecting...";
			_ui.playLoading();
			
			// Client Attributeの初期値を作成します。
			var initialX:Number = int(Math.random() * _ui.avatarField.width);
			var initialY:Number = int(Math.random() * _ui.avatarField.height);
			var initialDirection:Number = int(Math.random() * 4);
			_clientData = {
				nickname: "guest",
				color: Math.random() * 0x888888,
				avatar: [initialX, initialY, initialDirection, 0].join(",")
			};
			
			// UnionServerへ接続します。
			connect();
		}

/**
		 * UnionServerへ接続します。
		 */
		private function connect():void
		{
			_reactor = new Reactor(null, false);
			_reactor.addEventListener(ReactorEvent.READY, _reactor_readyHandler);
			_reactor.addEventListener(ReactorEvent.CLOSE, _reactor_closeHandler);
			_reactor.connect(UNION_SERVER_HOST, UNION_SERVER_PORT);
		}
		
		/**
		 * UserEventを登録します。
		 */
		private function activate():void
		{
			_ui.stopLoading();
				
			// observeボタンの動作を登録します。
			_ui.observeButton.addEventListener(MouseEvent.CLICK,
				 _ui_observeButton_clickHandler);

// joinボタンの動作を登録します。
			_ui.joinButton.addEventListener(MouseEvent.CLICK,
				 _ui_joinButton_clickHandler);
			
			// updateボタンの動作を登録します。
			_ui.updateButton.addEventListener(MouseEvent.CLICK,
				 _ui_updateButton_clickHandler);
				 
			// メッセージ入力時の動作を登録します。
			_ui.messageField.addEventListener(TextEvent.TEXT_INPUT,
				_ui_messageField_textInputHandler);
			_ui.messageField.addEventListener(KeyboardEvent.KEY_UP,
				_ui_messageField_keyUpHandler);
				
			// アバターフィールドクリック時の動作を登録します。
			_ui.avatarField.addEventListener(MouseEvent.CLICK,
				_ui_avatarField_clickHandler);
		}
		
		/**
		 * UserEventを解除します。
		 */
		private function deactivate():void
		{		
			// observeボタンの動作を解除します。
			_ui.observeButton.removeEventListener(MouseEvent.CLICK,
				 _ui_observeButton_clickHandler);

// joinボタンの動作を解除します。
			_ui.joinButton.removeEventListener(MouseEvent.CLICK,
				 _ui_joinButton_clickHandler);
			
			// updateボタンの動作を解除します。
			_ui.updateButton.removeEventListener(MouseEvent.CLICK,
				 _ui_updateButton_clickHandler);
				 
			// メッセージ入力時の動作を解除します。
			_ui.messageField.removeEventListener(TextEvent.TEXT_INPUT,
				_ui_messageField_textInputHandler);
			_ui.messageField.removeEventListener(KeyboardEvent.KEY_UP,
				_ui_messageField_keyUpHandler);
				
			// アバターフィールドクリック時の解除を設定します。
			_ui.avatarField.removeEventListener(MouseEvent.CLICK,
				_ui_avatarField_clickHandler);
		}
		
		/**
		 * RoomEventのListener登録
		 */
		private function addRoomEventListeners():void
		{
			_room.addEventListener(RoomEvent.OBSERVE, _room_observeHandler);
			_room.addEventListener(RoomEvent.JOIN, _room_joinHandler);
			_room.addEventListener(RoomEvent.CLIENT_COUNT
				, _room_clientCountHandler);
			_room.addEventListener(RoomEvent.SYNCHRONIZE
				, _room_synchronizeHandler);
			_room.addEventListener(RoomEvent.ADD_CLIENT
				, _room_addClientHandler);
			_room.addEventListener(RoomEvent.REMOVE_CLIENT
				, _room_removeClientHandler);
			_room.addEventListener(RoomEvent.UPDATE_CLIENT_ATTRIBUTE
				, _room_updateClientAttributeHandler);
			_room.addMessageListener("chatMessage", chatMessageHandler);
		}
		
		/**
		 * RoomEventのListener解除
		 */
		private function removeRoomEventListeners():void
		{
			_room.removeEventListener(RoomEvent.OBSERVE, _room_observeHandler);
			_room.removeEventListener(RoomEvent.JOIN, _room_joinHandler);
			_room.removeEventListener(RoomEvent.CLIENT_COUNT
				, _room_clientCountHandler);
			_room.removeEventListener(RoomEvent.SYNCHRONIZE
				, _room_synchronizeHandler);
			_room.removeEventListener(RoomEvent.ADD_CLIENT
				, _room_addClientHandler);
			_room.removeEventListener(RoomEvent.REMOVE_CLIENT
				, _room_removeClientHandler);
			_room.removeEventListener(RoomEvent.UPDATE_CLIENT_ATTRIBUTE
				, _room_updateClientAttributeHandler);
			_room.removeMessageListener("chatMessage", chatMessageHandler);
		}
		
		/**
		 * _ui.avatarFieldにアバターを追加します。
		 * @param	client
		 */
		private function addAvatar(client:IClient):void
		{
			var loader:Loader = new Loader();
			loader.contentLoaderInfo.addEventListener(Event.INIT,
				function(event:Event):void {
					var avatar:* = loader.content;
					avatar.color = client.getAttribute("color");
					var values:Array = client.getAttribute("avatar").split(",");
					updateAvatar.apply(null, [avatar, false].concat(values));
					
					_avatars[client.getClientID()] = avatar;
					_ui.avatarField.addChild(avatar);
				}
			);
			
			loader.load(new URLRequest(AVATAR_URL));
		}
		
		/**
		 * _ui.avatarFieldからアバターを削除します。
		 * @param	client
		 */
		private function removeAvatar(client:IClient):void
		{
			var avatar:* = _avatars[client.getClientID()];
			if (!_ui.avatarField.contains(avatar)) return;
			_ui.avatarField.removeChild(avatar);
			delete _avatars[client.getClientID()];
		}
		
		/**
		 * アバターを状態更新します。
		 * @param	avatar
		 * @param	isTween
		 * @param	positionX
		 * @param	positionY
		 * @param	direction
		 * @param	distance
		 */
		private function updateAvatar(
				avatar:*,
				isTween:Boolean,
				positionX:Number, positionY:Number,
				direction:uint, distance:Number):void
		{
			avatar.play();
			switch (direction)
			{
				case DIRECTION_UP:
					avatar.back();
					break;
				case DIRECTION_RIGHT:
					avatar.right();
					break;
				case DIRECTION_DOWN:
					avatar.front();
					break;
				case DIRECTION_LEFT:
					avatar.left();
					break;
			}
			
			if (isTween)
			{
				var tween:IObjectTween = BetweenAS3.tween(
					avatar,
					{x: positionX, y: positionY },
					{x: avatar.x, y: avatar.y },
					distance * 0.005, Sine.easeOut
				);
				tween.play();
			}
			else
			{
				avatar.x = positionX;
				avatar.y = positionY;
			}
		}
		
		/**
		 * Message chatMessageを受け取った際に実行されるハンドラです。
		 * @param	fromClient
		 * @param	message
		 */
		private function chatMessageHandler(
				fromClient:IClient, message:String):void
		{
			var nickname:String = decodeURI(
				fromClient.getAttribute("nickname")
			);
			var color:uint = uint(fromClient.getAttribute("color"));
			message = decodeURI(message);
			_ui.appendMessage(
				"[chatMessage]" + nickname + "(" + fromClient.getClientID() + ")"
				+ "さん「" + message + "」",
				color
			);
		}
		
		//----------------------------------------------------------------------
		//  event handler
		//----------------------------------------------------------------------
		//------------------------------
		//  User Event系
		//------------------------------		
		/**
		 * _ui.observeButtonをクリックした際に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_observeButton_clickHandler(event:MouseEvent):void
		{
			_ui.playLoading();
			removeRoomEventListeners();
			deactivate();
			_attempt = "observe";
			_reactor.disconnect();
			connect();
		}
		
		/**
		 * _ui.joinButtonをクリックした際に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_joinButton_clickHandler(event:MouseEvent):void
		{
			_ui.playLoading();
			removeRoomEventListeners();
			deactivate();
			_attempt = "join";
			_reactor.disconnect();
			connect();
		}
		
		/**
		 * _ui.updateButtonをクリックした際に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_updateButton_clickHandler(event:MouseEvent):void
		{
			var nickname:String = _ui.nicknameField.text;
			var color:uint = _ui.colorChooser.value;
			if (nickname.length == 0)
			{
				_ui.appendMessage("ニックネームは空に出来ません", 0xFF0000);
				return;
			}
			_self.setAttribute("nickname", encodeURI(nickname));
			_self.setAttribute("color", String(color));
		}
		
		/**
		 * _ui.messageFieldにテキストを入力中に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_messageField_textInputHandler(event:TextEvent):void
		{
			_isInputText = true;
		}
		
		/**
		 * _ui.messageFieldにテキストを入力中、キーをアップした際に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_messageField_keyUpHandler(event:KeyboardEvent):void
		{
			if (_ui.messageField.text.length == 0) return;
			if (!_isInputText && event.keyCode == Keyboard.ENTER)
			{
				var message:String = encodeURI(_ui.messageField.text);
				_room.sendMessage("chatMessage", true, null, message);
				_ui.messageField.text = "";
			}
			_isInputText = false;
		}
		
		/**
		 * _ui.avatarFieldをクリックした際に実行されるハンドラ
		 * @param	event
		 */
		private function _ui_avatarField_clickHandler(event:MouseEvent):void
		{
			// 入室していなければ何もしない。
			if (!_self.isInRoom(ROOM_CHAT)) return;
			
			var avatar:* = _avatars[_self.getClientID()];
			var direction:uint;
			var distanceX:Number = event.localX - avatar.x;
			var distanceY:Number = event.localY - avatar.y;
			var distance:Number = Math.sqrt(
				distanceX * distanceX + distanceY * distanceY
			);
			// 小数点を切り捨てる
			distance = int(distance);
			
			// アバターが向く方向を決定
			if (Math.abs(distanceX) <= Math.abs(distanceY))
			{
				if (distanceY < 0) direction = DIRECTION_UP;
				else direction = DIRECTION_DOWN;
			}
			else
			{
				if (distanceX < 0) direction = DIRECTION_LEFT;
				else direction = DIRECTION_RIGHT;
			}
			
			// Client Attributeを更新する。
			var values:Array = [event.localX-16, event.localY-16, direction, distance];
			_self.setAttribute("avatar", values.join(","));
		}
		
		//------------------------------
		//  Reactor系イベント
		//------------------------------
		/**
		 * ReactorとUnion Serverとの接続が完了した際に実行されるハンドラ
		 * @param	event
		 */
		private function _reactor_readyHandler(event:ReactorEvent):void
		{
			_ui.currentStatusLabel.text = "connect";
			_ui.appendMessage("ReadyEvent.READY");
			
			// 自身のClient参照を取得
			_self = _reactor.getClientManager().self();
			_self.setAttribute("nickname", _clientData.nickname);
			_self.setAttribute("color", _clientData.color);
			_self.setAttribute("avatar", _clientData.avatar);
			
			// 自身のnicknameを設定
			_ui.nicknameField.text = _clientData.nickname;
			
			// 自身のcolorを設定
			_ui.colorChooser.value = _clientData.color;
			
			// RoomManager参照を取得
			_roomManager = _reactor.getRoomManager();
			
			_roomManager.addEventListener(
				RoomManagerEvent.CREATE_ROOM_RESULTS,
				_roomManager_createRoomReslutsHandler);
			
			// Roomへの接続が0となっても残す設定
			var roomSetting:RoomSettings = new RoomSettings();
			roomSetting.dieOnEmpty = false;
			
			// 指定したRoom IDを作成する。
			_room = _roomManager.createRoom(ROOM_CHAT, roomSetting);
			addRoomEventListeners();
			
			// logger参照を取得
			_logger = _reactor.getLog();
			_logger.addEventListener(LogEvent.UPDATE, _logger_updateHandler);
		}
		
		/**
		 * ReactorからUnion Serverの接続が切断した際に実行されるハンドラ
		 * @param	event
		 */
		private function _reactor_closeHandler(event:ReactorEvent):void
		{
			_ui.currentStatusLabel.text = "connect closed.";
			_ui.appendMessage("ReadyEvent.CLOSE");
			_ui.currentClientsLabel.text = "occupants:unknown";
			for (var i:uint = 0; i < _ui.avatarField.numChildren; i++)
			{
				_ui.avatarField.removeChildAt(0);
			}
		}
		
		/**
		 * RoomManagerからRoomの作成結果が通知された際に実行されるハンドラ
		 * @param	event
		 */
		private function _roomManager_createRoomReslutsHandler(
				event:RoomManagerEvent):void
		{
			var status:String = event.getStatus();
			_ui.appendMessage("RoomManagerEvent.CREATE_ROOM_RESULTS:" + status);
			if (event.getStatus() == Status.SUCCESS
				|| event.getStatus() == Status.ROOM_EXISTS) 
			{
				if (_attempt == "observe") _room.observe();
				else if (_attempt == "join") _room.join();
				else activate();
			}
		}
		
		/**
		 * LoggerからLogの登録が通知された際に実行されるハンドラ
		 * @param	event
		 */
		private function _logger_updateHandler(event:LogEvent):void
		{
			var level:String = event.getLevel();
			if (level == Logger.DEBUG || level == Logger.INFO) return;
			_ui.appendMessage(level + ":" + event.getMessage(), 0xFF0000);
		}
		
		/**
		 * Roomへobserveした際に実行されるハンドラ
		 */
		private function _room_observeHandler(event:RoomEvent):void
		{
			_ui.currentStatusLabel.text = "observe";
			_ui.appendMessage("RoomEvent.OBSERVER");
			_ui.stopLoading();
			activate();
		}
			
		/**
		 * Roomへjoinした際に実行されるハンドラ
		 */
		private function _room_joinHandler(event:RoomEvent):void
		{
			_ui.currentStatusLabel.text = "join";
			_ui.appendMessage("RoomEvent.JOIN");
			_ui.stopLoading();
			activate();
		}
		
		/**
		 * Room内のClient数が更新された際に実行されるハンドラ
		 * @param	event
		 */
		private function _room_clientCountHandler(event:RoomEvent):void
		{
			_ui.appendMessage("RoomEvent.CLIENT_COUNT");
			_ui.currentClientsLabel.text = "occupants:" + event.getNumClients() + "人";
		}
		
		/**
		 * Room内の情報が同期された際に実行されるハンドラ
		 * @param	event
		 */
		private function _room_synchronizeHandler(event:RoomEvent):void
		{
			_ui.appendMessage("RoomEvent.SYNCHRONIZE");
			
			for each (var client:IClient in _room.getClients())
			{
				addAvatar(client);
			}
		}
		
		/**
		 * Room内にClientが追加された際に実行されるハンドラ
		 * @param	event
		 */
		private function _room_addClientHandler(event:RoomEvent):void
		{
			_ui.appendMessage("RoomEvent.ADD_CLIENT");
			addAvatar(event.getClient());
		}
		
		/**
		 * Room内からClientが削除された際に実行されるハンドラ
		 * @param	event
		 */
		private function _room_removeClientHandler(event:RoomEvent):void
		{
			_ui.appendMessage("RoomEvent.REMOVE_CLIENT");
			removeAvatar(event.getClient());
		}
		
		/**
		 * Room内のClient Attributeが更新された際に実行されるハンドラ
		 * @param	event
		 */
		private function _room_updateClientAttributeHandler(event:RoomEvent):void
		{
			_ui.appendMessage("RoomEvent.UPDATE_CLIENT_ATTRIBUTE");
			var attribute:Attribute = event.getChangedAttr();
			_ui.appendMessage(" id:" + event.getClientID() 
				+ ", name:" + attribute.name 
				+ ", oldValue:" + attribute.oldValue
				+ ", value:" + attribute.value
			);
			
			var avatar:* = _avatars[event.getClientID()];
			if (!avatar) return;
			switch (attribute.name)
			{
				case "color":
				{
					avatar.color = uint(attribute.value);
					break;
				}
				case "avatar":
				{
					var values:Array = attribute.value.split(",");
					updateAvatar.apply(null, [avatar, true].concat(values));
					break;
				}
			}
		}
	}	
}
//--------------------------------------------------------------------------
//  以降ヘルパークラス
//--------------------------------------------------------------------------
import com.bit101.components.*;
import flash.display.*;
import flash.text.*;
import flash.events.*;
import org.libspark.betweenas3.*;
import org.libspark.betweenas3.easing.*;
import org.libspark.betweenas3.tweens.*;
/**
 * Union Chat User Interface
 * @author Copyright (C) naoto koshikawa, All Rights Reserved.
 */
class UnionChatUI extends Sprite
{
	//----------------------------------------------------------------------
	//  static properties
	//----------------------------------------------------------------------
	//------------------------------
	//  public static properties
	//------------------------------
	/** ステージの横 */
	public static const STAGE_WIDTH:Number = 465;
	
	/** ステージの縦 */
	public static const STAGE_HEIGHT:Number = 465;
	
	//----------------------------------------------------------------------
	//  properties
	//----------------------------------------------------------------------		
	//------------------------------
	//  public properties
	//------------------------------
	private var _loadingCircle:Shape;
	/** ローディング中のサークル */
	public function get loadingCircle():Shape
	{
		return _loadingCircle;
	}
	
	private var _loadingTween:IObjectTween;
	/** ローディング中のサークルのトゥイーン */
	public function get loadingTween():IObjectTween
	{
		return _loadingTween;
	}
	
	private var _messageField:TextField;
	/** メッセージ入力フィールド */
	public function get messageField():TextField
	{
		return _messageField;
	}
	
	private var _colorChooser:ColorChooser;
	/** ユーザの色設定 */
	public function get colorChooser():ColorChooser
	{
		return _colorChooser;
	}
	
	private var _nicknameField:TextField;
	/** ユーザの名前 */
	public function get nicknameField():TextField
	{
		return _nicknameField;
	}
	
	private var _udpateButon:PushButton;
	/**
	 * ユーザ設定の変更ボタン
	 */
	public function get updateButton():PushButton
	{
		return _udpateButon;
	}
	
	private var _observeButton:PushButton;
	/**
	 * Roomへobserveするボタン
	 */
	public function get observeButton():PushButton
	{
		return _observeButton;
	}
	
	private var _joinButton:PushButton;
	/**
	 * Roomへjoinするボタン
	 */
	public function get joinButton():PushButton
	{
		return _joinButton;
	}
	
	private var _currentStatusLabel:Label;
	/**
	 * 現在の状態を表示
	 */
	public function get currentStatusLabel():Label
	{
		return _currentStatusLabel;
	}
	
	private var _currentClientsLabel:Label;
	/**
	 * 現在のクライアント数を表示
	 */
	public function get currentClientsLabel():Label
	{
		return _currentClientsLabel;
	}
	
	private var _avatarField:Sprite;
	/**
	 * アバターフィールド
	 */
	public function get avatarField():Sprite
	{
		return _avatarField;
	}
	
	private var _messageList:TextField;
	/**
	 * メッセージフィールド
	 */
	public function get messageList():TextField
	{
		return _messageList;
	}
	
	//----------------------------------------------------------------------
	//  methods
	//----------------------------------------------------------------------
	//------------------------------
	//  public methods
	//------------------------------
	/**
	 * constructor
	 */
	public function UnionChatUI() 
	{
		buildUI();
	}

/**
	 * ローディングサークルを再生します。
	 */
	public function playLoading():void
	{
		addChild(_loadingCircle);
		_loadingCircle.visible = true;
		_loadingTween = BetweenAS3.tween(_loadingCircle,
			{ rotation:0 }, { rotation:360 }, 
			1.2, Sine.easeInOut
		);
		_loadingTween.stopOnComplete = false;
		_loadingTween.play();
	}
	
	/**
	 * ローディングサークルを停止します。
	 */
	public function stopLoading():void
	{
		_loadingCircle.visible = false;
		_loadingTween.stop();
	}
	
	/**
	 * メッセージリストに追加します。
	 */
	public function appendMessage(text:String, color:uint = 0x000000):void
	{
		_messageList.htmlText += '<font size="10" color="#' 
			+ color.toString(16) + '">' + text + "</font><br>";
		_messageList.scrollV = _messageList.maxScrollV;
	}
	
	//------------------------------
	//  private methods
	//------------------------------
	/**
	 * User Interfaceを作成します。
	 */
	private function buildUI():void
	{
		createLoadingCircle();
		createMessageField();
		createUserSetting();
		createRoomButton();
		createField();
		createMessageList();
	}
	
	/**
	 * ロード中を示す画像を表示します。
	 */
	private function createLoadingCircle():void
	{
		_loadingCircle = new Shape();
		
		var radian:Number;
		var radius:Number = 25;
		var posX:Number;
		var posY:Number;
		for (var i:uint = 0; i < 10; i++)
		{
			radian = (Math.PI * 2) * (i/10) - Math.PI;
			posX = Math.cos(radian) * radius;
			posY = Math.sin(radian) * radius;
			_loadingCircle.graphics.beginFill(0xFFFFFF, 1.0 - (i/10) + 0.1);
			_loadingCircle.graphics.drawCircle(posX, posY, 5);
		}
		_loadingCircle.x = STAGE_WIDTH / 2;
		_loadingCircle.y = STAGE_HEIGHT / 2;
		_loadingCircle.visible = false;
		addChild(_loadingCircle);
	}
	
	/**
	 * 共有するMessageを入力するフィールドを作成します。
	 */
	private function createMessageField():void
	{
		_messageField = createTextField(this, 0, STAGE_HEIGHT - 19)
		_messageField.type = TextFieldType.INPUT;
		_messageField.width = STAGE_WIDTH - 1;
		_messageField.height = 18;
	}
	
	/**
	 * ClientのAttributeを更新するUIを作成します。
	 */
	private function createUserSetting():void
	{
		_colorChooser = new ColorChooser(this, 0, STAGE_HEIGHT - 40, 0x000000);
		
		var nicknameLabel:Label = new Label(this,
			_colorChooser.width + 5, STAGE_HEIGHT - 40, "nickname:");
		nicknameLabel.setSize(45, 10);
		
		_nicknameField = createTextField(this,
			nicknameLabel.x + nicknameLabel.width + 5, STAGE_HEIGHT - 40, 10, "");
		_nicknameField.type = TextFieldType.INPUT;
		_nicknameField.width = 100;
		_nicknameField.height = 18;
		
		_udpateButon = new PushButton(this, 
			_nicknameField.x + _nicknameField.width + 5, 
			STAGE_HEIGHT - 40, "Update Attribute");
	}
	
	/**
	 * Roomボタンを作成します。
	 */
	private function createRoomButton():void
	{
		var margin:Number = 5;
		_observeButton = new PushButton(this, margin, margin, "observe");
		_observeButton.setSize(60, 20);
		_joinButton = new PushButton(this, 
			_observeButton.x + _observeButton.width + margin,
			margin,
			"join"
		);
		_joinButton.setSize(60, 20);

var label:Label = new Label(this,
			_joinButton.x + _joinButton.width + margin,
			margin, "status:"
		);
		label.setSize(40, 10);
		
		_currentStatusLabel = new Label(this,
			label.x + label.width + margin,
			margin, ""
		);
		_currentStatusLabel.setSize(100, 20);
		
		_currentClientsLabel = new Label(this,
			_currentStatusLabel.x + _currentStatusLabel.width + margin,
			margin, "occupants:unknown"
		);
	}
	
	/**
	 * ユーザのアバターが活躍する（？）フィールドを作成します。
	 */
	private function createField():void
	{
		_avatarField = new Sprite();
		_avatarField.graphics.beginFill(0xEEEEEE);
		_avatarField.graphics.drawRoundRect(0, 0, 455, 300, 10, 10);
		_avatarField.x = 5;
		_avatarField.y = 30;
		_avatarField.mouseChildren = false;
		addChild(_avatarField);
	}
	
	/**
	 * メッセージを表示するフィールドを作成します。
	 */
	private function createMessageList():void
	{
		_messageList = createTextField(this, 5, 335);
		_messageList.width = 455;
		_messageList.height = 80;
		_messageList.wordWrap = true;
		_messageList.multiline = true;
	}
}	
/**
 * TextFieldの作成ヘルパーです。
 */
function createTextField(
		container:DisplayObjectContainer, positionX:Number, positionY:Number,
		size:Number = 10, text:String = "", borderColor:uint = 0x000000,
		backgroundColor:uint = 0xFFFFFF
		):TextField
{
	var textField:TextField = new TextField();
	textField.defaultTextFormat = new TextFormat("_等幅", size);
	textField.type = TextFieldType.DYNAMIC;
	textField.border = true;
	textField.borderColor = borderColor;
	textField.background = true;
	textField.backgroundColor = backgroundColor;
	textField.x = positionX;
	textField.y = positionY;
	textField.width = textField.height = 0;
	textField.text = text;
	container.addChild(textField);
	return textField;
}

Code Fullscreen

Preview Fullscreen