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

19jan/110

TTFX Bordeaux #3 : Messaging et Remoting le Jeudi 03 février à 18h30 à l’ENSEIRB

Petit relai d'informations sur cette rencontre des TTFX bordelais.

banniere

Le programme a l'air sympathique:

  • Le FUG, et news du monde Flash
  • Flex, BlazeDS, LCDS et LCCS
  • Flex et le Remoting AMF
  • Flex et le messaging (chat, data push)
  • Flex et le Data Management
  • Flex et LiveCycle Collaboration Service

Cette fois ci Michaël CHAIZE, Platform Evangelist pour Adobe et auteur du blog RIAGORA, vient nous parler échange client-serveur.

Pensez donc à cliquez sur le lien ci dessous pour vous inscrire et réserver vos places :

http://ttfx201102.eventbrite.com/

27août/100

LCCS – Carte Google Maps collaborative synchronisée avec Whiteboard

Ah, si seulement j'avais le temps d'en faire autant que Christophe Coenraets, je ferais sûrement des trucs super cool comme lui ^^. Jour après jour, il nous présente des applications collaboratives basées sur LCCS (LiveCycle Collaboration Service). Après la vidéo-conférence et le morpion, un peu de cartographie cette fois.

L'application est comme d'habitude, multi-plateforme. Ainsi, il l'exécute sur son mobile Android et l'autre personne qui collabore avec lui l'utilise depuis son navigateur. On peut donc créer une session de collaboration, qui est une room LCCS. A partir de ce moment-là, on arrive sur une page avec une carte Google et plusieurs options:

  • Activer le whiteboard pour pouvoir dessiner avec votre collaborateur sur la carte
  • Inviter un utilisateur: L'application envoie un mail à votre contact contenant un lien vers une page web qui contient l'application. Celle-ci vous connectera directement la personne qui vous a invité
  • Activer / Désactiver le partage de webcam.

Pendant ce temps-là, la carte est synchronisée. Si votre collaborateur zoom in/out ou fait un déplacement, vous verrez directement le résultat sur votre carte.


collab-1

Voir l'article original: Multi-User Google Maps Collaboration on Android

Tester l'application dans votre navigateur (ouvrez plusieurs onglets pour tester)

26août/100

LCCS – Jeu de Morpion en réseau (client Android ou web)

Encore une expérimentation sympa de Christophe Coenraets :) . Après le chat vidéo en moins de 30 lignes, il continue à utliser LCCS mais cette fois pour un jeu bien connu, le morpion. Deux joueurs peuvent donc rejoindre une "room" (une "room" au sens LCCS) et jouer au morpion. Une application Air pour Android est aussi disponible, basée sur le même code source. On a ici un bel exemple de ré-utilisation de code. L'application est codée une fois et visible sur 2 écrans.

En plus de cela, chaque utilisateur peut voir la vidéo de son concurrent pendant le jeu. Au moment de la création d'un jeu de morpion, vous pouvez aussi inviter un autre utilisateur à vous rejoindre en lui envoyant un email. Pour cela, l'application utilise la fonctionnalité email native d'Android.

Voilà la vidéo de démonstration:

Si vous souhaitez y jouer, c'est par ici:

Jouer au morpion par LCCS

Et si vous souhaitez voir comment l'application est faîte, vous pouvez même télécharger le code source.

Télécharger le code source de TicTacToe

25août/103

LCCS – Screen Sharing, SDK Javascript, support P2P et RTMFP

Cela faisait longtemps que je n'avais pas regardé les nouveautés de LCCS (Livecycle Collaboration Service, anciennement AFCD, anciennement Cocomo) et depuis quelques mois, ils en ont fait du chemin!

En même temps, on ne voit que peu de billet sur ce service, alors qu'il est vraiment très puissant d'un point de vue fonctionnel. C'est dommage que les evangelists Adobe ne fassent pas plus la promotion de ce produit (car bon, il vendent le service qui est derrière). Je vais essayer de mettre quelques exemples sur mon blog ce soir :)

Si vous voulez les résumés complets des derniers changements, voici les billets des développeurs:

LCCS April Release : Feature Explosion

Screen Sharing and Recording: August Feature Tsunami

Voici les grands points:

  • Server-to-Server HTTP APIs: Permet à un serveur (le votre) de contrôler ce qui se passe dans les "rooms" de votre application ainsi que de l'administrer sans passer par du code client
  • Flash Player 10.1 libraries: Grâce aux API Flash Player 10.1, de nouvelles fonctionnalités sont possibles comme
    • Peer2Peer entre utilisateur (sans faire passer la donnée par LCCS)
    • Audio / Video multicast: Partager un flux audio ou vidéo à plusieurs utilisateurs
  • Large room support: Vos "rooms" ont maintenant une capacité plus grande. Pour l'instant limitée à 5000 utilisateurs mais les responsables de LCCS reconnaissent que l'on pourrait mettre bien plus que cela
  • Buddy List presence: Permet à un utilisateur d'avoir une liste d'amis qu'il suit et dont il peut suivre la présence facilement
  • JavaScript SDK: Vous voulez intégrer du collaboratif dans votre site HTML sans tout refaire en Flash? Pas de souci, vous pouvez maintenant commander le SDK à travers une API JavaScript.
  • Partage d'écran (Screen Sharing): C'est une fonctionnalité qui n'était pour l'instant présente que dans Adobe Connect. Vous pouvez maintenant partager votre écran aux autres utilisateurs de votre room très facilement. Notez que cette fonctionnalité se fait grâce à l'extension Adobe ConnectNow que l'utilisateur doit installer (installation transparente)
  • Screen Recording and Playing: Encore mieux que de simplement diffuser ce qui se passe sur votre écran, vous pouvez enregistrer le flux pour le rejouer par la suite

Et pour finir, une petite vidéo pour montrer le partage d'écran:

Screen Sharing Feature In Flash Now Available For Everyone! from Tom Krcha on Vimeo.

23juil/100

AIR pour Android – Vidéo conférence en 30 lignes de code avec LiveCycle Collaboration Services

Christophe Coenraets est on fire en ce moment et sort une application Air pour Android presque tous les jours :P . La dernière est une application de chat vidéo utilisant le service LiveCycle Collaboration Services.
Pour ceux qui ne connaissent pas LCCS (anciennement AFCS, anciennement Cocomo), vous trouverez plus d'informations sur le site officiel:

LiveCycle Collaboration Services @ Adobe

Pour résumer, LCCS propose d'utiliser des services Adobe en mode hébergé (SaaS). LCCS est aussi accompagné d'un SDK complet permettant d'intégrer facilement un chat vidéo, un tableau blanc, un partage de fichiers, … Il permet ainsi de gérer facilement les concepts de "room" et d'utilisateur. Beaucoup de traitement étant fait server-side par les systèmes de gestion sans que vous le sachiez.

Bref, LCCS était un projet qui était déjà intéressant pour du Desktop mais grâce à Air pour Android, (qui est une des prochaines versions de Air et pas un nouveau SDK), vous pouvez profiter de base du SDK livré avec LCCS.

Et c'est ce que fait CC dans sa vidéo de chat vidéo sur Android:

Comme je le disais un peu plus haut, LCCS vient avec un SDK complet, qui permet de s'affranchir de beaucoup de code. Dans le cas de cette application, seules 30 lignes de code on été nécessaires pour initier la connexion à la conférence et afficher un pod vidéo:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:cs="AfcsNameSpace" currentState="logon" fontSize="28">

 <fx:Script>
 [Bindable] private var roomURL:String = "http://connectnow.acrobat.com/YOUR_ROOM_NAME";

 protected function connect():void {
  auth.userName = userName.text;
  currentState = "default";
  session.login();
 }
 </fx:Script>

 <s:states>
  <s:State name="default"/>
  <s:State name="logon"/>
 </s:states>

 <fx:Declarations>
  <cs:AdobeHSAuthenticator id="auth"/>
 </fx:Declarations>

 <s:TextInput id="userName" includeIn="logon" top="200" horizontalCenter="0"/>
 <s:Button label="Connect" click="connect()" includeIn="logon" top="250" horizontalCenter="0" height="50" width="150"/>

 <cs:ConnectSessionContainer id="session" roomURL="{roomURL}" authenticator="{auth}" autoLogin="false" width="100%" height="100%" includeIn="default">
  <cs:WebCamera top="10" left="10" bottom="10" right="10"/>
 </cs:ConnectSessionContainer>

</s:Application>

Voilà de quoi donner des idées !