OpenLaszlo: um relógio legal

ainda navegando pelo forum do OpenLaszlo vendo os posts da galera mostando as aplicações que desenvolveram com OpenLaszlo vi uma outra implementação de relógio digital muito interessante...

[ver o relógio]

fonte forum OpenLaszlo: [link: Cool Clock]
download do fonte: [host:primario] | [host:alternativo]

OpenLaszlo: Leitor RSS + PHP

Navegando pelo forum do OpenLaszlo vi uma implementação de leitor de RSS feito com OpenLaszlo + PHP

um exemplo:


quem tiver interesse ver em: FeedFlash
tópico no forum OpenLaszlo: [link]

Novidade: Plugoo no blog =]

Opa pessoal uma novidade que estou adicionando ao blog, no lado direito =]
Plugoo, vi em outro site na internet e resolvi verificar do que se tratava isso e achei muito interessante, é um meio pelo qual as pessoas que estão acessando o site podem entrar em contato com o "Dono", responsável pelo site e conversar

para outras pessoas que possuem blog ou sites de informações é algo interessante que recomendo dar uma olhada...


Plugoo

OpenLaszlo: serviço de busca de empregos

opa hoje de manha, vou eu no site do OpenLaszlo e eis que vejo uma notícia de uma nova aplicação de busca de empregos que foi desenvolvido a interface utilizando o OpenLaszlo : Monster.com



por curiosidade acessei a aplicação para fazer um teste, como de costume mais uma excelente implementação usando OpenLaszlo =]

mais informações ver em: OpenLaszlo Project Blog
também existe um tópico no forum oficial do OpenLaszlo: [link]

RIA: sinopse de aplicação

bom acredito que muito das dúvidas das pessoas relacionados ao uso de tecnologias RIA como o OpenLaszlo, Flex, AJAX, dentre outras soluções, é que não conseguem ver como que se configura uma aplicação agora usando tais soluções...



Client-Side | Lado do Cliente

- nesse caso temos, a aplicação OpenLaszlo, Flex, AJAX, etc, executam na máquina do cliente, da qual diz respeito os eventos de mouse, teclado, animações manipulação de dados da interface...

- vale lembrar que usando essas tecnologias não é valido perguntar, tem como usar por exemplo EJB? o EJB, controle de sessões, geração de relatórios, essas tarefas são realizadas no...

Server-Side | Lado do servidor

- aqui sim é a parte onde é executado a lógica de negócio, integração com outros serviores, no caso o questionado EJB será manipulado aqui desse lado, esse lado do servidor pode ser um servidor Java, servidor para ASP, PHP, Ruby, .NET ou qualquer outro servidor web que exista no mercado

- e desde será feito o acesso a base de dados usando a tecnologia de sua preferência, no caso do Java normalmente utilizam junto aos projetos o framework de persistência ORM Hibernate...

Comunicação/integração entre os lados da aplicação

- o meio de campo assim digamos, a forma pela qual ambos os lados da aplicação conversa, normalmente nessas aplicações RIA temos o uso de XML para trabalhar com os dados entre ambos os lados, levando em consideração também que o OpenLaszlo, Flex e AJAX trabalham mais facilmente com dados estruturados em tag(XML)

- utilizando Java temos algumas opções para trabalhar com essa parte, DWR que já te fornece toda uma infra estrutura que realiza esse meio de campo de modo "simples" e/ou uso do XStream o qual é uma API de persistência/transporte a qual realiza a transformação do Objeto para XML e de XML para Objeto

Flex: também possui muitos atrativos

muitas pessoas vendo meus posts sobre OpenLaszlo pode até pensar que tenho algo contra o Adobe Flex, muito pelo contratio eu também reconheço que o Flex é uma excelente solução, algumas das capacidades dele podemos ver no respestivo [Link: FlexStyleExplorer]

OpenLaszlo: problemas com acentuação

esse é um dos casos que muitos acabam tendo problemas quando estão trabalhando com o OpenLaszlo, enquanto estão fazendo testes tudo funciona tranquilamente, mas quando começa a usar mais, com uma base de dados e surgem os tais caracteres especiais como os acentuados, ae eis que surge o problema.... no OpenLaszlo mostra normalmente uns quadrados ou até uns ? no lugar do caractere...

mas como resolver?

simples na saída da fonte do XML é preciso tratar o encoding, o .swf executado pelo plugin Flash trabalha com textos usando como base o encoding UTF-8, então é só ajustar o encoding no servidor =]

exemplos:
- PHP
$XML = "<tag>á é í ó ú ç ã õ ... </tag>"; 
echo utf8_encode( $XML );

- Java
no java tem uma característa um pouco diferente, para resolver os problemas de encoding resolvi criando 2 métodos...

String text = "<tag>á é í ó ú ç ã õ ... </tag>";

* para tratar os caracteres para enviar ao OpenLaszlo:

  public static String toISO88591(String text) throws Exception{
    byte p[] = text.getBytes("UTF-8");
    return new String(p, 0, p.length, "ISO-8859-1");
  }

* para tratar os caracteres recebidos do OpenLaszlo:

  public static String toUTF8(String text) throws Exception{
    byte p[] = text.getBytes("ISO-8859-1");
    return new String(p, 0, p.length, "UTF-8");
  }

OpenLaszlo: finalmente um livro =]

sim, enfim eis que surge um livro sobre o OpenLaszlo e nada mais nada menos que da série ... In Action =]



Manning: Laszlo in Action


sobre os autores: um deles é fundador da Laszlo Systems, empresa que criou a primeira versão do hoje então OpenLaszlo( Max Carlson ), Norman Klein um consultor da Laszlo Systems com mais de 20 anos de experiência em engenharia de software e Glenn MacEwen relacionado a universidade de Queen's University do Canada.

ps.: isso sim eu considero uma ótima notícia =]

OBS.: Ainda em fase de formulação / escrita =(, previsão de finalização para Agosto de 2007

OpenLaszlo: integração com FusionCharts

bom como sempre em aplicações soluções de gráficos são necessárias em algum momento para exibir dados de algo importante de modo que, facilite a compreenção dos mesmos...
em um post no Portal Java referente ao assunto de um usuário que não estava conseguindo
integrar o FusionCharts internamente em uma app Openlaszlo, fui verificar do que se tratava...

encontrei um tópico sobre o assunto no forum oficial do Openlaszlo: [ Embedding Fusion Charts], onde tinha um exemplo de como realizar tal integração, fiz um teste local com o OpenLaszlo 3.3.3 e verifiquei que funcionou...

ver um exemplo: [link]
download do exemplo: [link:forum] [link:alternativo]

ps.: nesse tópico do forum possui mais informações sobre o assunto, deem uma verificada =]

OpenLaszlo: outra mini aplicação voltada para o Portal Java

mais uma mini aplicação OpenLaszlo feita para o Portal Java, agora para o bloco das ultimas postagens no forum, atualização a cada 2 minutos, podendo ser configurado para o mínimo de 1 minuto, também possui a capacidade de configurar como irá abrir o link para o post, [self] ou [blank], padrão [self], tamanho da fonte padrão em 10px, mas pode ser alterado no intervalo de 9 a 12px, essa aplicação também possui uma novidade que é a tecla 'R' para atualizar os dados...

Obs.: use a tecla 'ESC' para acessar as configurações



download do fonte: [link]

OpenLaszlo: exemplo de organização de projeto

bom agora para exemplificar, já temos o exemplo da mini aplicação OpenLaszlo a qual mostra os dados do status do Portal Java.com e atualiza em certo intervalo de tempo, essa nova aplicação a interface é exatavamente a mesma, o que muda dela é a sua organização do projeto, a qual diferentemente da versão anterior que era tudo em um único .lzx, agora está separada em classes para possibilitar o reuso dos componentes gerados em outras aplicações...



como comentei, visualmente essa nova versão é exatamente igual a diferença está na forma que foi estruturada quanto ao código... compare ambas as versões para ver a estrutura...

download da versão anterior: [link]
download da versão estruturada em classes: [link]

com isso pode-se até traçar um paralelo das vantagens de uma programação mais organizada, quando se pensa em reuso, manutenção e até expansão de aplicação =]

OpenLaszlo: usando o relógio do Openlaszlo dentro de outra aplicação

Muitas pessoas já viram o relógio do OpenLaszlo que é usando na página principal do Laszlo-Explorer onde vemos esses tipo de relógio sendo usado dentro de uma aplicação OpenLaszlo, mas como fazer para usar esse relógio?


Download do exemplo: [link]

Observação: usa a classe do relógio disponível no Laszlo-Explorer, porém com uma costumização para funcionar diretamente, não fiz nenhum teste usando mais de 1 relógio na mesma aplicação...

[Código] Exemplo de uso:
<canvas
    title="Exemplo de uso do relógio OpenLaszlo">
    
    <!-- incluindo a classe -->
    <include href="class/relogio"/>
    
    <simplelayout axis="y" spacing="20"/>
    
    <clock name="myclock" local="true" x="40" />
    <text multiline="true">
        Usando o relógio do Openlaszlo<br/>
        dentro de uma outra aplicação<br/>
        OpenLaszlo...
    </text>
</canvas>

OpenLaszlo: um exemplo completo de mini aplicação

bom base no exemplo de uso do LzTimer, alguns amigos sugeriram fazer uma mini aplicação com OpenLaszlo que também listasse o login dos usuários logados no Portal Java.com e também possibilitasse algum tipo de configuração, bom estão lá vai um exemplo de mini aplicação com OpenLaszlo =]

Observação: para acessar a parte de configuração precione a tecla ESC para exibi a tela de configuração, e ESC novamente para voltar a tela com as informações... também foi definido um tempo inicial de atualização de dados em 5 minuto, possibilitando uma configuração para o valor, sendo o mínimo de 1 minuto de tempo de espera. ( A fonte de dados desse app é um .php )

* tamanho da aplicação: 104 kB


Código fonte da mini aplicação: [link]

Modelo dos XML das fontes de dados:
* ds_status
<pjonline>
   <membros>?</membros>
   <visitantes>?</visitantes>
   <total>?</total>
</pjonline>

* ds_user
<list>
   <item number="1" user="usuário A" />
   <item number="2" user="usuário B" />
   <item number="3" user="usuário c" />
   <item number="4" user="usuário D" />
   ...
</list>


OpenLaszlo: exemplo de LzTimer

um exemplo simples de como criar uma aplicação do genero Timer, para a cada intervalo de tempo realizar algum tipo de processamento, no caso este exemplo mostra o status em tempo real das pessoas que estão acessando ao Portal Java.com



Código fonte da aplicação: [link]
<canvas
    title="Portal Java Who is Online"
    width="200" proxied="false">
    
    <attribute name="flag" value="true" type="boolean" />
    
    <!-- dataset da aplicação -->
    <dataset
        name="ds"
        src="http:whoisonline.php"
        querytype="post"
        request="false"
        proxied="false"/>
    <!-- trata o evento de recebimento de dados pelo dataset -->    
    <handler reference="ds" name="ondata"><![CDATA[
        // verifica o tratamento de tempo para executar a cada 1 segundo
         if( typeof this.del == "undefined" ) {
            this.del = new LzDelegate( this, "atualizaInfo" );
            LzTimer.addTimer( this.del, 1000 );
        } else {
            LzTimer.resetTimer( this.del, 1000 );
        }
    ]]></handler>    
    <!-- método que trata a inicialização da aplicação -->
    <method name="init"><![CDATA[
        this.atualizaInfo();
    ]]></method>
    <!-- método para atualizar -->
    <method name="atualizaInfo"><![CDATA[
        if( this.flag ) {
            // requisita os dados para o servidor
            this.ds.doRequest();
        }
    ]]></method>    
    <!-- @BEGIN: definição visual -->
    <simplelayout axis="y" spacing="5"/>
    <text><u><b> Pessoas on-line: </b></u></text>
    <view>
        <text>Membros: </text>
        <text x="65" datapath="ds:/pjonline/membros/text()"/>
    </view>
    <view>
        <text>Visitantes: </text>
        <text x="65" datapath="ds:/pjonline/visitantes/text()"/>
    </view>
    <view>
        <text>Total: </text>
        <text x="65" datapath="ds:/pjonline/total/text()"/>
    </view>
    
    <button x="20" name="btn" text="Parar">
        <handler name="onclick"><![CDATA[
            if( canvas.flag ) {
                canvas.btn.setAttribute( "text", "Atualizar" );
                canvas.flag = false;
            } else {
                canvas.btn.setAttribute( "text", "Parar" );
                canvas.flag = true;
                canvas.ds.doRequest();
            }
        ]]></handler>
    </button>
    <!-- @END: definição visual -->    
</canvas>

Formato do XML recuperado com as informações:
<pjonline><membros>4</membros><visitantes>185</visitantes><total>189</total></pjonline>


Linux time line

bom a título de curiosidade uma imagem interessante relacionado as distros linux existentes até o ano de 2006

OpenLaszlo: exemplo de campo com Mascara

algo útil e que normalmente iremos nos deparar é com a necessidade de um campo com mascara para entrada de data, hora, CEP, CPF, entre outros tipos de entradas formatadas...

neste exemplo é um bem simples de como implementar um campo de mascara para CPF
onde a mascara é: xxx.xxx.xxx-xx, porém este exemplo não trata a entrada de teclado a qual também poderia ser incluída de modo simples


[Fonte]

<canvas width="200">
<view width="115" height="20" bgcolor="gray">
        <inputtext
            name="field"
            bgcolor="white"
              x="1" y="1"
              width="$once{parent.width-2}"
              height="$once{parent.height-2}" maxlength="14">
              
              <method name="init"><![CDATA[
                  super.init();
              ]]></method>
              <method event="onkeydown" args="akeycode"><![CDATA[
                Debug.write( String.fromCharCode(akeycode) + " : " + akeycode + " >> " + this.getText() );
                
                // tecla backspace
                if( akeycode != 8 ) {
                    
                    switch( this.getText().length ) {
                        case 3:
                            this.addText( "." );
                            break;
                        case 7:
                            this.addText( "." );
                            break;
                        case 11:
                            this.addText( "-" );
                            break    
                    }
                var lastP = this.getText().length;
                this.setSelection( lastP, (lastP+1) );                  
                }           
                ]]></method>
              <!-- @END: métodos do inputtext -->
          </inputtext>
</view>
</canvas>

OpenLaszlo vs Flex: Hello World

um teste por curiosidade entre OpenLaszlo e Flex no famoso programa Hello World, gerando um binário .swf em ambos para ver o tamanho do binário resultante( apenas a título de curiosidade )

OpenLaszlo:
<canvas>
    <text>Hello World!</text>
</canvas>
.swf = 72 KB

Flex:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Text x="10" y="10" text="Hello World"/>
</mx:Application>
.swf = 115 KB Õo

ambos usando o formato genérico de código sem agregar nada além do famoso texto "Hello World" na aplicação... incrível a diferença de tamanho entre ambos.

Nota: resolvi fazer o mesmo teste que foi descrito no [blog]

OpenLaszlo: distribuição SOLO

Muitos perguntam como integrar o OpenLaszlo a outras tecnologias Web, até mesmo se perguntam se isso é possível, sim é possível integrar uma aplicação OpenLaszlo com uma aplicação PHP no próprio servidor PHP, ou com ASP, no servidor IIS, ou com .NET em um servidor .NET, usando a distribuição da aplicação chamada de SOLO, que gera uma saída como muitos costuma a se referir: "como a do Flex"

SOLO > Standalone OpenLaszlo Output

mais informações ver os links:
SOLO is simple
SOLO is simple, part two
Chapter 22. Proxied and SOLO Applications
Passing Parameters to SOLO applications

OpenLaszlo: achei um lugar onde tem o antigo plugin IDE4Laszlo

Para o pessoal que estava acessando o site do Eclipse e não encontrava o plugin IDE4Laszlo, hoje lendo um material sobre OpenLaszlo achei um link para o local que mantem o antigo plugin do IDE4Laszlo...

Laszlo Ide for Eclipse

veja também um tutorial introdutório sobre OpenLaszlo( em inglês )[link], relativamente atual esse tutorial: 11 de Outubro de 2006

OpenLaszlo: usar Include ou Import, qual a diferença?

Algo interessante relacionado ao OpenLaszlo na hora de desenvolver aplicações mais otimizadas está relacionado no uso das referentes tags: include ou import ambas possuem a mesma finalidade de incluir um recurso, ou .lzx, para ser utilizado na aplicação OpenLaszlo, porém a tag include irá incluir o recurso, ou as classes no tempo de compilação, caso seja uma aplicação SOLO irá compilar tudo para um único binário final .swf, caso seja utilizado a tag import, essa tag irá incluir o recurso em runtime, caso em uma aplicação SOLO irá gerar mais de um SWF final, um .swf da parte principal da aplicação e outros .swf dos recursos e classes, utilizando dessa forma otimizamos de certa forma a performance e uso dos recursos e classes, reduzindo o tamanho inicial do swf carregado na máquina do usuário, com isso reduzindo o tempo de acesso à aplicação...

ver os respectivos links sobre o assunto:
performance-tuning
tag import
tag include
SOLO is simple, part two
Import Statement
Dynamic Libraries
Chapter 14. Program Structure