Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

AFCS – Tutorial Introduction à AFCS avec Flex (7 – Utilisation du Shared Manager UserManager)

Suite du tutorial

1. AFCS - Tutorial Introduction à AFCS avec Flex (1)
2. AFCS - Tutorial Introduction à AFCS avec Flex (2 - Préparer la room et Flex Builder)
3. AFCS - Tutorial Introduction à AFCS avec Flex (3 - Les composants de base Pods)
4. AFCS - Tutorial Introduction à AFCS avec Flex (4 - Authentification et Session)
5. AFCS - Tutorial Introduction à AFCS avec Flex (5 - Types de Droits Utilisateur)
6. AFCS - Tutorial Introduction à AFCS avec Flex (6 - Architecture Globale d'AFCS)

Traduction de Introduction to Adobe Flash Collaborative Services par Romin Irani.

Dans l'article précédent, j'évoquais les Shared Manager, ces classes qui vont vous permettre d'administrer votre room facilement. Voyons maintenant l'un d'entre eux, la classe UserManager. Cette classe est présente dans le package com.adobe.rtc.sharedManagers.

Ce que l'on va faire, est simplement d'afficher la liste des utilisateurs qui sont dans la room. Auparavant, on utilisant le Pod "Roster" pour cela, mais ici on va partir de la base.

L'exemple suivant montre comment utiliser les classes de bases pour votre composant.

Voici le code Flex:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:rtc="AfcsNameSpace" creationComplete="initApp()">
<mx:Script>
	<![CDATA[
		import com.adobe.rtc.events.SessionEvent;
		import mx.controls.Alert;
		import com.adobe.rtc.events.AuthenticationEvent;

		public function initApp():void {
 			auth.addEventListener(AuthenticationEvent.AUTHENTICATION_SUCCESS,onAuthenticationResponse);
 			auth.addEventListener(AuthenticationEvent.AUTHENTICATION_FAILURE,onAuthenticationResponse);
 			afcsSession.addEventListener(SessionEvent.SYNCHRONIZATION_CHANGE,onSessionEventResponse);
 			afcsSession.addEventListener(SessionEvent.ERROR,onSessionEventResponse);
 		}

		public function onSessionEventResponse(event:Event):void {
 			if (event.type == SessionEvent.SYNCHRONIZATION_CHANGE) {
  				if (afcsSession.isSynchronized) {
   					//Now we are connected and the Pods have synchronized themselves, so switch to main Screen
   					//Switch to Collaborative Pods i.e. ConnectSessionContainer
   					vsMain.selectedIndex = 1;
   				}
  				else {
   					//We are disconnected now
   					afcsSession.roomURL = null;
   					vsMain.selectedIndex = 0;
   				}
  			}
 			else if (event.type == SessionEvent.ERROR) {
  				var sError:SessionEvent = event as SessionEvent;
  				Alert.show(sError.error.name + " : " + sError.error.message);
  			}
 		}

		public function onAuthenticationResponse(event:AuthenticationEvent):void {
 			if (event.type == AuthenticationEvent.AUTHENTICATION_SUCCESS) {
  				trace("Authentication Succeeded");
  			}
 			else if (event.type == AuthenticationEvent.AUTHENTICATION_FAILURE) {
  				Alert.show("Authentication Error : " + event.toString());
  			}
 		}

		public function login():void {
 			auth.userName = username.text;
 			auth.password = password.text;
 			if (rolename.selectedLabel == "Guest") auth.password = null;
 			afcsSession.login();
 		}

		public function logout():void {
 			afcsSession.logout();
 		}
	]]>
</mx:Script>
<rtc:AdobeHSAuthenticator id="auth"/>
<mx:ViewStack id="vsMain" width="100%" height="100%">
	<mx:Form>
		<mx:FormHeading label="AFCS 101 Login"/>
		<mx:FormItem label="UserName:">
			<mx:TextInput id="username"/>
		</mx:FormItem>
		<mx:FormItem label="Password:">
			<mx:TextInput id="password" displayAsPassword="true"/>
		</mx:FormItem>
		<mx:FormItem label="Role:">
			<mx:ComboBox id="rolename">
				<mx:dataProvider>
					<mx:Array>
						<mx:String>User</mx:String>
						<mx:String>Guest</mx:String>
					</mx:Array>
				</mx:dataProvider>
			</mx:ComboBox>
		</mx:FormItem>
		<mx:FormItem>
			<mx:Button label="Login" click="login()"/>
		</mx:FormItem>
	</mx:Form>
	<rtc:ConnectSessionContainer id="afcsSession" roomURL="http://connectnow.acrobat.com/fnicollet/flexTutorialFR" authenticator="{auth}" autoLogin="false" width="100%" height="100%">
		<mx:VBox width="100%" height="100%">
			<mx:Button label="Logout" click="logout()"/>
			<mx:Label text="Welcome {afcsSession.userManager.getUserDescriptor(afcsSession.userManager.myUserID).displayName}!"/>
			<mx:Label text="Current Room Users:"/>
			<mx:List id="userList" dataProvider="{afcsSession.userManager.userCollection}" labelField="displayName" width="20%"/>

		</mx:VBox>

	</rtc:ConnectSessionContainer>
</mx:ViewStack>

</mx:Application>

Voyons voir ce qui est important dans ce code:

• Dans le ConnectSessionContainer principal, on a un élément dont le data provider est fixé à afcsSession.userManager.userCollection.
• Notez que l'on utilise la classe singleton userManager, qui, comme mentionné plus tôt, peut être accédée par l'instance de session, afcsSession dans notre cas
• Une fois que vous avez récupéré une instance de userManager, vous pouvez appeler les méthodes appropriées.

Lancez plusieurs instances de cette application, et vous verrez différents utilisateurs (ouvrez cette page dans plusieurs onglets par exemple):

Flex Source Code Download: Télécharger le code source complet de l'application