Leonardo França http://www.leonardofranca.com.br Consultor e Desenvolvedor Flash Platform (Adobe AIR/Flex/Flash/Flash Media Server/PHP/Java/.NET) Thu, 19 Apr 2012 17:01:17 +0000 en hourly 1 http://wordpress.org/?v=3.3.2 Server-Side ActionScript no Flash Media Server http://www.leonardofranca.com.br/index.php/2012/03/07/server-side-actionscript-no-flash-media-server/ http://www.leonardofranca.com.br/index.php/2012/03/07/server-side-actionscript-no-flash-media-server/#comments Thu, 08 Mar 2012 00:41:05 +0000 Leonardo França http://www.leonardofranca.com.br/?p=2407 Continue reading →]]> Poucos sabem mas o Flash Media Server(versão Interactive) possui uma linguagem de servidor chamada Server-Side ActionScript ou ActionScript Communications(extensão .asc). O que permite recurso poderosos em seus aplicativos multimídia muito além de um simples streaming.
Server-Side ActionScript é o nome que Adobe deu para o JavaScript 1.5, o Flash Media Server possui uma engine de JavaScript para compilar e executar os scripts.
O Server-Side ActionScript é parecido mas não idêntico ao ActionScript 1.0, mas ambos são baseado no ECMAScript(ECMA-262) edition 3 language specification. O Server-Side ActionScript roda sob a engine SpiderMonkey da Mozilla que consta no Flash Media Server enquanto que o ActionScript 1.0 roda sob o AVM1(ActionScript Virtual Machine 1) no Adobe Flash Player. O SpiderMonkey implementa o totalmente o ECMAScript enquanto que a AVM1 do Flash Player não. A grande diferença entre os dois é que o Server-Side ActionScript é case-sensitive.
Portanto para quem já tem conhecimento de JavaScript, pode reaproveita-lo para usar no Flash Media Server, é possível utilizar a maioria dos recursos e ainda contar com os recursos exclusivos do Flash Media Server.

Vamos os primeiros passos para utilizar o Server-Side ActionScript no Flash Media Server. Uma maneira de testar seus scripts é usando o fms_console localizado no caminho:

INSTALATION FOLDER\Adobe\Flash Media Server 4.5\webroot\swfs\fms_adminConsole.swf

Se você tiver o Adobe Flash Professional, pode abrir esse arquivo diretamente apenas dando dois cliques, caso contrario, abra pelo navegador. Ao ser aberto, devemos ter uma tela como essa:

fms_console_tela1

Tela inicial do fms_adminConsole.swf


Basta entrar com o login e senha que você determinou no momento em que estava instalando o Flash Media Server que deveremos entrar para a seguinte tela:
fms_console_tela2

Tela pos-login


Esse será seu melhor amigo ao desenvolver aplicativos com Flash/Flex e Flash Media Server. Por padrão, o Flash Media Server lê o seguinte diretorio:

INSTALATION FOLDER\Adobe\Flash Media Server 4.5\applications

Esse caminho pode ser configurado modificando a linha "VHOST.APPSDIR" no seguinte arquivo:

INSTALATION FOLDER\Adobe\Flash Media Server 4.5\conf\fms.ini

Criaremos um diretorio chamado "teste", e dentro dele um arquivo chamando "main.asc" com o seguinte conteúdo:

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");

Agora no console, carregaremos nossa aplicação criando uma nova instância dela selecionando no combobox:

Na tela seguinte, basta dar um "enter".

Deveremos ter o resultado do nosso trace na caixa de texto como na imagem:

fms_console_tela5

Resultado do trace


Uma recomendação que faço é que você limpe a tela antes de executar novamente o script main.asc, basta clicar no botão Clear Log(1) e depois em Reload Application(2):

Alguns exemplos do que pode ser usado com o Server-Side ActionScript

Constantes

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");
  3. const PI = 3.14;
  4. trace(PI);

Expressões Regulares

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");
  3. myRe = /d(b+)d/g;
  4. myArray = myRe.exec("cdbbdbsbz");
  5. trace(myArray);

Funções

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");
  3. function teste()
  4. {
  5.     return "to na funcao o/";  
  6. }
  7. trace(teste());
  8.  
  9. function factorial(n)
  10. {
  11.    if ((n == 0) || (n == 1))
  12.       return 1;
  13.    else
  14.    {
  15.       var result = (n * factorial(n-1) );
  16.       return result;
  17.    }
  18. }
  19. trace(factorial(5));

Objetos

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");
  3. var obj = {id:"teste",data:2,status:"ONLINE",type:"admin"}
  4. trace(obj);
  5. for(s in obj)
  6. {
  7.     trace(s +" - "+obj[s]);
  8. }

Array

PLAIN TEXT
JAVASCRIPT:
  1. // ActionScript Communications Document
  2. trace("init app...");
  3. var arr = ["leo", "carol", "pam", "perla","carlinha"];
  4. trace(arr);
  5. function removeValueFromArray(arr, value)
  6. {
  7.     var len = arr.length;
  8.    
  9.     for(var i = len; i> -1; i--)
  10.     {
  11.         if(arr[i] === value)
  12.         {
  13.             arr.splice(i, 1);
  14.         }
  15.     }
  16.     return arr;
  17. }
  18. trace(removeValueFromArray(arr,"pam"));

Aviso importante, use esses recursos SOMENTE em ambiente de desenvolvimento. Em ambiente de produção, você derrubará todo mundo que estiver conectado à sua aplicação. :P

Referência:
Documentação do Adobe Flash Media Server

]]> http://www.leonardofranca.com.br/index.php/2012/03/07/server-side-actionscript-no-flash-media-server/feed/ 4 Nova logo para o Flex http://www.leonardofranca.com.br/index.php/2012/02/11/nova-logo-para-o-flex/ http://www.leonardofranca.com.br/index.php/2012/02/11/nova-logo-para-o-flex/#comments Sat, 11 Feb 2012 15:29:21 +0000 Leonardo França http://www.leonardofranca.com.br/?p=2396 Continue reading →]]> Apache FlexA nova logo do Apache Flex foi escolhida no final de janeiro. O número de inscrições recebidas pela comunidade foi impressionante. O concurso recebeu um total de 54 inscrições, incluindo agências e pessoas individuais, alguns até mandaram mais de uma logo e teve até sugestão de mascote para o Flex.
Dentre todas, foram para a final a logo de Adrian's (#42) e Julien's (#49) design
see more in Apache Flex Blog

]]> http://www.leonardofranca.com.br/index.php/2012/02/11/nova-logo-para-o-flex/feed/ 6 SharedObject com Flash Media Server http://www.leonardofranca.com.br/index.php/2012/01/02/sharedobject-com-flash-media-server/ http://www.leonardofranca.com.br/index.php/2012/01/02/sharedobject-com-flash-media-server/#comments Tue, 03 Jan 2012 01:24:06 +0000 Leonardo França http://www.leonardofranca.com.br/?p=2047 Continue reading →]]> SharedObject é um recurso que dar ao Flash Player a capacidade de salvar dados localmente para poder ser usado posteriormente em sua aplicação, a grosso modo é como um cookie. Com o Flash Media Server, foi introduzido a possibilidade de usar o SharedObject Remote, no qual os dados são salvos no servidor Flash Media Server e compartilhados para todas as instâncias de uma conexão entre o Flash Player e o Flash Media Server. Isso possibilita a criação de aplicativos em real time como Dashboards, chats e o que mais a imaginação permitir.

O uso do SharedObject Remote pode ser usado de duas maneiras em conjunto com o Adobe Flash Media Server.

  • Somente pelo lado cliente, através do Flash Player/AIR
  • Em conjunto com ActionScript Communication, linguagem de servidor do Flash Media Server

Vejamos o primeiro caso:

Através do lado cliente, através do Flash Player/AIR

Caso você não tenha conhecimento para usar a linguagem Server-side do Flash Media Server, é possível utilizar o SharedObject Remote somente pelo ActionScript 3.0. Vamos a um exemplo clássico sharedBall, onde o objetivo é compartilhar as posições da bolinha a atualizar nos outros clientes conectados a mesma instância.

  • Vá até o diretório de instalação do Flash Media Server e procure pela pasta "applications", lá crie um diretório chamado "sharedBall", dentro dele um arquivo chamado "main.asc"
  • Abra o main.asc no seu editor de textos de preferencia ou pelo próprio Flash e digite: trace("sharedBall...");
  • Vamos testar esse arquivo, abra o console do Flash Media Server, geralmente fica localizado no diretorio de instalação/webrrot/swfs. Você pode abrir pelo browser ou o swf diretamente.
  • Clique no botão "View Applications" e em seguida procure o nome "sharedBall" no combobox logo no canto inferior esquerdo onde está escrito "New Instance..."
  • Selecione "sharedBall" e deveremos ter na aba Live Log algo como na imagem abaixo:

  • No Flash, criei uma bola com as ferramentas de desenho e converti para MovieClip dando o nome de "mc_ball".
  • Estamos prontos para começar a integração entre o Flash e o Flash Media Server. Crie um layer para o ActionScript e abra o editor apertando F9 ou "Window->Actions"
  • Nosso código começa com a conexão com o servidor Flash Media Server
PLAIN TEXT
ACTIONSCRIPT3:
  1. import flash.net.NetConnection;
  2. import flash.events.NetStatusEvent;
  3.  
  5.  
  6. function init():void
  7. {
  8.     nc = new NetConnection();
  9.     nc.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStatus);
  10.     nc.connect("rtmp://localhost/sharedBall");
  11. }
  12.  
  13. function handlerNetStatus(evt:NetStatusEvent):void
  14. {
  15.     trace(evt.info.code);
  16. }
  17.  
  18. init();

Feito isso, podemos testar o swf apertando Ctrl+Enter, se tudo correr bem, deveremos ter a seguinte mensagem no output do Flash:

NetConnection.Connect.Success

Com a conexão feita, podemos instanciar o nosso SharedObject Remote para compartilhar as posições de x e y da bolinha.

PLAIN TEXT
ACTIONSCRIPT3:
  1. if(evt.info.code == "NetConnection.Connect.Success")
  2.     {
  3.         so = SharedObject.getRemote("so",nc.uri,false);
  4.         so.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStatus);
  5.         so.addEventListener(SyncEvent.SYNC, handlerSync);
  6.         so.connect(nc);
  7.     }

O handlerSync é responsável por atualizar os dados de x e y pegaremos do SharedObject Remote:

PLAIN TEXT
ACTIONSCRIPT3:
  1. function handlerSync(evt:SyncEvent):void
  2. {
  3.     mc_ball.x = so.data.x;
  4.     mc_ball.y = so.data.y;
  5. }

Daremos a opção de ao clicar na bolinha, que ela possa ser arrastável, em seguida atualizaremos as posições de x e y no SharedObject Remote:

PLAIN TEXT
ACTIONSCRIPT3:
  1. mc_ball.addEventListener(MouseEvent.MOUSE_DOWN, handlerSharedBall);
  2. mc_ball.addEventListener(MouseEvent.MOUSE_UP, handlerSharedBallOut);
  3.  
  4. function handlerSharedBall(evt:MouseEvent):void
  5. {
  6.     this.addEventListener(Event.ENTER_FRAME, update);
  7.     mc_ball.startDrag();
  8. }
  9.  
  10. function handlerSharedBallOut(evt:MouseEvent):void
  11. {
  12.     mc_ball.stopDrag();
  13. }
  14.  
  15. function update(evt:Event=null):void
  16. {
  17.     so.setProperty("x",mc_ball.x);
  18.     so.setProperty("y",mc_ball.y);
  19. }

Segue o código completo:

PLAIN TEXT
ACTIONSCRIPT3:
  1. import flash.net.NetConnection;
  2. import flash.events.NetStatusEvent;
  3. import flash.net.SharedObject;
  4. import flash.events.SyncEvent;
  5. import flash.events.MouseEvent;
  6. import flash.events.Event;
  7.  
  9. var so:SharedObject;
  10.  
  11. function init():void
  12. {
  13.     nc = new NetConnection();
  14.     nc.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStatus);
  15.     nc.connect("rtmp://localhost/sharedBall");
  16. }
  17.  
  18. function handlerNetStatus(evt:NetStatusEvent):void
  19. {
  20.     trace(evt.info.code);
  21.     if(evt.info.code == "NetConnection.Connect.Success")
  22.     {
  23.         so = SharedObject.getRemote("so",nc.uri,false);
  24.         so.addEventListener(NetStatusEvent.NET_STATUS, handlerNetStatus);
  25.         so.addEventListener(SyncEvent.SYNC, handlerSync);
  26.         so.connect(nc);
  27.     }
  28. }
  29.  
  30. function handlerSync(evt:SyncEvent):void
  31. {
  32.     mc_ball.x = so.data.x;
  33.     mc_ball.y = so.data.y;
  34. }
  35.  
  36. mc_ball.addEventListener(MouseEvent.MOUSE_DOWN, handlerSharedBall);
  37. mc_ball.addEventListener(MouseEvent.MOUSE_UP, handlerSharedBallOut);
  38.  
  39. function handlerSharedBall(evt:MouseEvent):void
  40. {
  41.     this.addEventListener(Event.ENTER_FRAME, update);
  42.     mc_ball.startDrag();
  43. }
  44.  
  45. function handlerSharedBallOut(evt:MouseEvent):void
  46. {
  47.     mc_ball.stopDrag();
  48. }
  49.  
  50. function update(evt:Event=null):void
  51. {
  52.     so.setProperty("x",mc_ball.x);
  53.     so.setProperty("y",mc_ball.y);
  54. }
  55.  
  56. init();

Veja uma demostração em funcionamento:

Compre o Arquivo fonte de exemplo por R$4,99

Mais códigos e PDFs clique aqui.

]]> http://www.leonardofranca.com.br/index.php/2012/01/02/sharedobject-com-flash-media-server/feed/ 1 Flex com PHP usando ZendAMF – Zend_Db http://www.leonardofranca.com.br/index.php/2011/12/27/flex-com-php-usando-zendamf-zend_db/ http://www.leonardofranca.com.br/index.php/2011/12/27/flex-com-php-usando-zendamf-zend_db/#comments Tue, 27 Dec 2011 23:35:08 +0000 Leonardo França http://www.leonardofranca.com.br/?p=1996 Continue reading →]]> O artigo Adobe Flex com PHP usando ZendAMF - primeiros passos teve como objetivo exemplificar a integração do Flex com PHP para quem já tinha sistemas desenvolvidos usando o AMFPHP, por isso não usei as classes para acesso a banco de dados do ZendFramework. Neste artigo mostrarei o mesmo exemplo mas usando exclusivamente ZendFramework.

Pegarei o mesmo exemplo utilizado no artigo anterior, só modificando a classe PHP para usar as classes de abstração de banco de dados do ZendFramework. Começaremos com nosso gateway.php

PLAIN TEXT
PHP:
  1. <?php
  2. require_once 'Zend/Config.php';
  3. require_once 'Zend/Db.php';
  4. require_once 'Zend/Amf/Server.php';
  5. require_once 'Zend/Amf/Exception.php';
  6. require_once 'Zend/Amf/Server.php';
  7. $server = new Zend_Amf_Server();
  8. $server->setProduction(false);
  9. $server->setClass('Contato');
  10. echo($server->handle());
  11. ?>

Executando o link no seu navegador, deve aparecer a seguinte mensagem:

Zend Amf Endpoint

Em seguida, modificaremos em nossa classe principal, que efetuará as operações de listar, inserir, apagar e atualizar os dados do nosso banco:

PLAIN TEXT
PHP:
  1. <?php
  2. /*
  3.  * author Leonardo França
  4.  * site http://www.leonardofranca.com.br
  5.  */
  6.  
  7. class Contatos  
  8. {
  9.     private $db;
  10.     private $config;
  11.     private $select;
  12.     private $stmt;
  13.    
  14.     function __construct()
  15.     {
  16.         $params['host'] = 'localhost';
  17.         $params['dbname'] = 'java';
  18.         $params['username'] = 'root';
  19.         $params['password'] = '';
  20.         $database['adapter'] = 'Mysqli';
  21.         $database['params'] = $params;
  22.         $data['database'] = $database;
  23.        
  24.         $this->config = new Zend_Config($data);
  25.         $this->db = Zend_Db::factory($this->config->database);
  26.     }
  27.    
  28.     public function getData()
  29.     {
  30.                try
  31.            {
  32.             $this->select = $this->db->select();
  33.             $this->select->from('tabela',array('id','nome','email'));
  34.             $this->stmt = $this->select->query();
  35.             $result = $this->stmt->fetchAll();
  36.             return $result;
  37.         }
  38.         catch (Exception $e)
  39.             {
  40.                     throw new Exception($e->getMessage());
  41.             }  
  42.     }
  43.    
  44.     public function insertData($data=array())
  45.     {
  46.             try
  47.         {
  48.             $dados = array(
  49.                 'nome'          => $data['nome'],
  50.                 'email'         => $data['email']
  51.             );
  52.             $retorno = $this->db->insert('tabela', $dados);
  53.             return $retorno;
  54.         }
  55.         catch (Exception $e)
  56.         {
  57.             throw new Exception($e->getMessage());
  58.         }
  59.     }
  60.    
  61.     public function deleteData($data=array())
  62.     {
  63.         try
  64.         {
  65.             $retorno = $this->db->delete('tabela', 'id = '.$data['id']);
  66.             return $retorno;
  67.         }
  68.         catch (Exception $e)
  69.         {
  70.             throw new Exception($e->getMessage());
  71.         }
  72.  
  73.     }
  74.    
  75.     public function updateData($data=array())
  76.     {
  77.     try
  78.         {
  79.             $dados = array(
  80.                 'nome'          => $data['nome'],
  81.                 'email'         => $data['email']
  82.             );
  83.             $where['id = ?'] = $data['id '];
  84.             return $this->db->update('tabela', $dados, $where);
  85.         }
  86.         catch (Exception $e)
  87.         {
  88.             throw new Exception($e->getMessage());
  89.         }
  90.     }
  91.    
  92. }
  93. ?>

No ActionScript só precisaremos mudar o que será passado para o PHP, ao inves de VOs, mandaremos Arrays:

PLAIN TEXT
ACTIONSCRIPT3:
  1. public function insertData():void
  2.             {
  3.                 var contatosVO:Array = [];
  4.                 contatosVO['nome']= input_nome.text;
  5.                 contatosVO['email'] = input_email.text;
  6.                 ro.insertData(contatosVO);
  7.             }

Referências:
http://framework.zend.com/manual/en/zend.db.adapter.html

Mais códigos e PDFs clique aqui.

]]> http://www.leonardofranca.com.br/index.php/2011/12/27/flex-com-php-usando-zendamf-zend_db/feed/ 0 LCCS e PHP com ZendAMF http://www.leonardofranca.com.br/index.php/2011/11/16/lccs-e-php-com-zendamf/ http://www.leonardofranca.com.br/index.php/2011/11/16/lccs-e-php-com-zendamf/#comments Wed, 16 Nov 2011 23:16:52 +0000 Leonardo França http://www.leonardofranca.com.br/?p=1981 Continue reading →]]> O Adobe LiveCycle Collaboration Service possui em seu SDK, exemplos de integração com as principais linguagens de programação web do mercado como PHP, Java, Python, etc.
Na documentação da Adobe, é recomendado o uso do AMFPHP ou o PHP puro mesmo, mas nada impede de usar tranquilamente em conjunto com o ZendFramework (usando ZendAMF)
Ryan Stewart escreveu dois artigos mostrando a implementação com PHP e REST.

Uma observação sobre o artigo de Ryan, no Flex 4, Adobe passou a usar o swfobject, então o modo de pegar os parâmetros via URL e passar para o SWF fica desse modo:

PLAIN TEXT
JAVASCRIPT:
  1. var xiSwfUrlStr = "playerProductInstall.swf";
  2. var flashvars = {};
  3. {
  4.     flashvars.roomURL = swfobject.getQueryParamValue("roomURL");
  5.     flashvars.authToken = swfobject.getQueryParamValue("authToken");
  6. }
  7. var params = {};

No SDK do LCCS, existe um arquivo chamado lccs.php, basta copiar para o mesmo diretório em que você já usa suas classes. Em seguida, adicionar o include no arquivo gateway.php

PLAIN TEXT
PHP:
  1. <?php
  2. require_once 'Zend/Amf/Server.php';
  3. require_once 'lccs.php';
  4. require_once 'Test.php';
  5.  
  6. /** Bootstrap */
  7.  
  8. // Instantiate server
  9. $server = new Zend_Amf_Server();
  10. $server->setProduction(false);
  11. $server->setClass('Test');
  12. // Handle request
  13. echo($server->handle());
  14. ?>

E está é uma simples classe para teste chamando o método que retorna o token para autenticação.

PLAIN TEXT
PHP:
  1. <?php
  2.  
  3. class Test
  4. {
  5.     private $account;
  6.     private $room;
  7.     private $devUsername;
  8.     private $devPassword;
  9.     private $secret;
  10.  
  11.     //$accountURL = "https://collaboration.adobelivecycle.com/$account";
  12.     private $accountURL;
  13.     private $roomURL;
  14.    
  15.     function __construct()
  16.     {
  17.         //for LCCS
  18.         $this->account = "Your SDK account username from LCCS developer portal";
  19.         $this->room    = "The room you want to connect to";
  20.         $this->devUsername = "Your LCCS developer account username";
  21.         $this->devPassword = "Your LCCS developer account password";
  22.         $this->secret  = "The shared secret from the LCCS developer portal";
  23.  
  24.         //$accountURL = "https://collaboration.adobelivecycle.com/$account";
  25.         $this->accountURL = "http://connectnow.acrobat.com/$this->account";
  26.         $this->roomURL = "$this->accountURL/$this->room";
  27.     }
  28.    
  29.     public function getToken($data=array())
  30.     {
  31.         try
  32.         {
  33.             $this->account = new RTCAccount($this->accountURL);
  34.             $this->account->login($this->devUsername,$this->devPassword);
  35.             $session = $this->account->getSession($data['room']);
  36.             $displayName = $data['displayName'];
  37.             $username = $data['username'];
  38.             $role = $data['role'];
  39.             $token = $session->getAuthenticationToken($this->secret, $displayName, $username, $role);
  40.             return $token;
  41.         }
  42.         catch (Exception $e)
  43.         {
  44.             throw new Exception($e->getMessage());
  45.         }
  46.     }
  47. }
  48. ?>

]]> http://www.leonardofranca.com.br/index.php/2011/11/16/lccs-e-php-com-zendamf/feed/ 0