Mostrando postagens com marcador Struts 2. Mostrar todas as postagens
Mostrando postagens com marcador Struts 2. Mostrar todas as postagens

17 de jun. de 2009

Open Flash Chart - Utilizando JOFC para executar em um projeto Struts 2

No primeiro post sobre o Open Flash Chart 2 eu mostrei como fazer um primeiro exemplo utilizando um html simples e um arquivo JSON para gerar um gráfico em Flash. Neste post vou demonstrar a utilização do JOFC2 que é uma API para utilização do OFC 2 com java. O arquivo open-flash-chart.swf já deve ter sido colocado na raiz do projeto web do appfuse conforme descrito no primeiro post sobre esse assunto.

Passo a passo:
1) Faça o download do JOFC neste link.

2)Crie uma User librarie no struts com a biblioteca do JOFC e adicione como dependência do seu projeto do Appfuse. Para executar esse passo no eclipse vá em Window > Preferences vá em User libraries de Java e adicione uma nova librarie chamada Jofc2 e nesta librarie adicione o jar do Jofc e a dependência XStream conforme a imagem abaixo.



Não se esqueça de adicionar essa nova librarie como dependência no seu projeto do Appfuse, para isso clique com o botão direito do mouse sobre o nome do projeto no eclipse e depois properties , procure java build path e adicione a librarie como dependência no projeto.

3)Crie uma Action e registre no struts.xml

Para criar a action vá na estrutura do projeto sob a estrutura do projeto do appfuse src>main>java , selecione o diretório das actions e com botão direito do mouse selecione new>Class e crie uma action chamada JOFC2Action conforme o código mostrado abaixo(os imports foram omitidos para simplificar):

package br.com.maweb.webapp.action;

import...

public class JOFC2Action extends BaseAction {

 private static final long serialVersionUID = 4486376620652216855L;

 public String processaOFC() {
  Chart chart = new Chart();
  chart.setTitle(new Text("Java OFC test"));
  chart.setBackgroundColour("#FFFFFF");
  
  LineChart lc = new LineChart();
  lc.setText("Text 1");
  lc.addDots(new Dot(7, "#0000FF", 2, 2));
  lc.addValues(5, 6, 7, 8, 7);
  
  LineChart lc2 = new LineChart();
  lc2.setColour("#000000");
  lc2.setText("Text 2");
  lc2.addDots(new Dot(2, "#FF0000", 2, 2));
  lc2.addValues(1, 2);
  
  BarChart bc3 = new BarChart(BarChart.Style.NORMAL);
//  bc3.setAlpha(0.3f);
  Bar b2 = new Bar(5.0);
  Bar b3 = new Bar(6.0);
  Bar b4 = new Bar(4.0);
  bc3.addBars(b2, b3, b4);
  
  
  chart.addElements(bc3, lc, lc2);
  
  YAxis ya = new YAxis();
  ya.setGridColour("#DDDEE1");
  ya.setColour("#96A9C5");
  ya.setOffset(false);
  chart.setYAxis(ya);
  
  XAxis xa = new XAxis();
  xa.setGridColour("#DDDEE1");
  xa.setColour("#96A9C5");
  chart.setXAxis(xa);
  
  chart.setFixedNumDecimalsForced(true);
  chart.setDecimalSeparatorIsComma(true);
  
  
  String grafico = chart.toString();
  try {
   grafico = URLEncoder.encode(grafico, "UTF-8");
  } catch (UnsupportedEncodingException e) {
   // TODO Auto-generated catch block
   e.printStackTrace();
  }
  getRequest().getSession().setAttribute("grafico", chart.toString());
  return SUCCESS;
 }

}



Esta Action do struts 2 faz a geração de um gráfico DEMO para utilizarmos no exemplo e coloca o resultado gerado que é um JSON na sessão com a chave grafico que será recuperada depois. Após gerar a action temos que registrá-la no struts.xml do projeto conforme trecho de código abaixo:


    /jofc2.jsp



Isso fará que um acesso a url http://localhost:8080/jofc2.html execute a action e após isso irá direcionar para a página chamada jofc2.jsp que criaremos no próximo passo.

4)Crie uma página chamada jofc2.jsp. No projeto do eclipse sob a pasta src/main/webapp crie uma página chamada jofc2.jsp com o seguinte código(as tags html, head e script foram alteradas para compatibilidade com o post neste blog e vc deve corrigí-las antes de executar o exemplo):

html>
head>
 
script type="text/javascript" src="swfobject.js">/script>
script type="text/javascript">
swfobject.embedSWF(
  "open-flash-chart.swf", "my_chart", "550", "300",
  "9.0.0", "expressInstall.swf",
{"data-file":"json.jsp"});
/script>
script type="text/javascript">
swfobject.embedSWF(
  "open-flash-chart.swf", "chart", "550", "300",
  "9.0.0", "expressInstall.swf",
{"data-file":"json.jsp"});
/script>
 
/head>
body>
 
 

Separador de gráfico

/body> /html>


Nesta página declaramos o elemento do Open Flash Chart e fazemos referência a uma página onde o json deve ser recuperado chamada json.jsp.

5)Crie uma página para colocar o JSON gerado chamada json.jsp . Crie uma página jsp com o nome json.jsp no mesmo diretório da página jofc2.jsp que irá recuperar a string JSON colocada pela action na sessão:

<%=session.getAttribute("grafico")%>


O código desta página é só esta linha mesmo. O interessante é que esta foi a única notação que funcionou para o Open Flash Chart, experimentei as notações do JSTL como c:out ou mesmo ${session.grafico} que imprimem EXATAMENTE a mesma String JSON e simplesmente não funciona. Acredito que seja alguma coisa no engine do JSTL do Jetty que cause a incompatibilidade.

6)Configure o projeto do Appfuse para não utilizar o decorator para a página do json. O projeto do Appfuse com struts 2 utiliza o Sitemesh para configurar as páginas, na página json.jsp não queremos que o template default seja utilizado pois queremos somente a String JSON para configuração do gráfico por isso deve-se acrescentar ao arquivo decorators.xml uma linha excluindo a página json.jsp da aplicação do template, segue código do arquivo decorators.xml.

    
        /40*.jsp
        /*ajax=true*
        /scripts/dojo/*
        /struts/dojo/* 
        /resources/*
        /json.jsp
     
    
        /*
    



7)Disponibilizar as libs do jofc para o maven: Registrar repositório e incluir dependências no pom.xml do projeto. Como ainda não encontrei um repositório público do maven com as bibliotecas necessárias para rodar o JOFC 2 disponibilizei no meu servidor da maweb. Por isso para poder baixar as libs do projeto e a dependência temos que registrar no pom.xml do projeto onde estas libs podem ser encontradas. Faremos isso declarando um novo repositório que irá apontar para www.maweb.com.br e registrando as libs que precisamos. Edite o pom.xml adicionando o trecho de código a seguir do repositório e das 2 libraries necessárias respectivamente:


     maweb
     http://www.maweb.com.br/mvn_repo


    jofc2
    jofc2
    1.0-0


     xstream
     xstream
     1.3.1



8)Disponibilizar na sua aplicação o javascript do JOFC (swfobject.js). O approach que utilizo neste tutorial depende de um javascript chamado swfobjec.js que vem no pacote do download do JOFC 2 e portanto copie este arquivo para o mesmo diretório das páginas criadas acima no projeto. Pronto, finalmente estamos prontos para rodar o exemplo para isso abra um console do seu sistema operacional e navegue para o diretório raiz do seu projeto, onde tem o pom.xml e rode o jetty utilizando o comando:
mvn jetty:run


Depois é só acessar a aplicação passando pela action conforme descrito no último passo abaixo. 9) Acessar a aplicação utilizando a url http://localhost:8080/jofc2.html , você deverá ver uma página com um gráfico simples renderizado conforme imagem mostrada abaixo:



Este é um gráfico de demostração para atingir o objetivo deste post, em um ambiente de projeto profissional pode-se utilizar um interceptor do struts para gerar o JSON o que facilitará quando precisarmos ter mais de um gráfico em uma página. Vários outros tipos de gráficos mais complexos podem ser gerados com esta API conforme mostrado nas páginas oficiais do projeto com exemplos em PHP neste link.

[]s

11 de jun. de 2009

Appfuse - Script para criação de projeto Appfuse / Struts2

Escrevi este post com o intuito de acelerar a criação de projetos do Appfuse que fossem funcionais no ambiente eclipse. O Appfuse é um excelente projeto que ajuda na integração de vários projetos opent source e com isso acelera o início do ciclo de desenvolvimento. Para criar um projeto com Appfuse é utilizado o maven e portanto para executar o script deste post o maven deve estar configurado no seu ambiente e deve ter um JDK 1.5 ou superior configurado.

Após alguma experiência com o Appfuse cheguei a um padrão na criação de projetos e portanto para acelerar o procedimento consolidei em um script.

O script cria um projeto de testes e para mudar o pacote e nome do projeto criado basta alguma edição no script. O script está bem documentado e é auto-explicativo. É um script que foi testado no ambiente linux com java 6 e para reutilizá-lo basta uma rápida adaptação para utilizar o JDK de sua preferência, o JDK deve ser 1.5 ou superior. Segue o script.

PATH=/home/mmaia/tools/jdk1.6.0_13/bin:${PATH}
export PATH
echo ${PATH}

#cria o projeto, o maven deve estar configurado no ambiente para funcionar.
mvn archetype:create -DarchetypeGroupId=org.appfuse.archetypes -DarchetypeArtifactId=appfuse-basic-struts -DremoteRepositories=http://static.appfuse.org/releases -DarchetypeVersion=2.0.2 -DgroupId=br.com.maweb -DartifactId=TestesJOFC2

#entra no diretório do projeto criado
cd TestesJOFC2

#baixa o código do core do appfuse para possibilitar evolução no seu projeto posteriormente.
mvn appfuse:full-source

#baixa todas as dependências para o repositório do maven executa todos os testes unitários do projeto.
mvn

#baixa parte web do projeto
mvn war:inplace

#remove no linux libraries para rodar aplicativo com container jetty de forma expandida o que facilita durante o desenvolvimento por refletir mais diretamente as alterações.
rm -r src/main/webapp/WEB-INF/lib/
rm -r src/main/webapp/WEB-INF/classes/struts.xml

#configura projeto para ser importado pelo eclipse.
mvn eclipse:eclipse


Após a execução do script o projeto criado pode ser importado como um projeto do eclipse normalmente. Abra o pom.xml do projeto criado e configure a os dados de usuário e senha da base de dados que irá ser utilizada no projeto sendo a default a mysql com usuário root e sem senha, se tiver dificuldades veja este post. Após configurar a base de dados então em um comando de linha para testar basta inicializar o jetty utilizado no desenvolvimento com o seguinte comando:

mvn jetty:run


Para ver o projeto acesse com o browser http://localhost:8080 e utilize usuário/senha = user/user.

Bem se o script não foi alterado teremos um projeto chamado TestesJOFC2 que é um projeto de testes para uma librie de geração de gráficos chamada Open Flash Chart que descrevo em outro post.

[]s

24 de mar. de 2009

Appfuse - Utilizar tooltip do struts 2 causa um erro com Dojo

Recentemente um problema simples me tomou algumas horas de pesquisa e o problema, como usual, era simples de ser resolvido.
Utilizando Struts 2 do Appfuse para desenvolvimento de uma aplicação quando colocava um tooltip no formulário percebia um erro mostrado pelo firebug no firefox o tooltip era:


E o erro mostrado pelo firebug:
dojo is not defined:dojo.requ...);dojo.require("dojo.fx.html"); 

Fiz uma postagem na lista de discussão do appfuse em : http://www.nabble.com/Using-struts-2-tooltip-causes-error!-td22669446s2369.html
E a solução do problema foi bem simples e envolve 2 passos:
1) Mudar a extensão do mapeamento do struts 2 de .html que é o default do appfuse pois isso causa conflito com dojo. (Esse passo eu já havia feito no meu projeto).
2) Adicionar a tag s:head do struts ao head html da página.
O problema foi resolvido, no meu caso, só com a s:head adicionada. Bem simples e me tomou um tempo considerável.
[]s

18 de mar. de 2009

Struts 2 - Customizando elementos de form

Esta semana precisei fazer uma customização no padrão de forms que utilizo. Basicamente o que estava ocorrendo era que eu precisava mudar o padrão de mensagens de erro do struts 2 utilizando o tema xhtml para não aparecer a mensagem de erro no campo diretamente só em uma lista em cima do formulário desejado e com um ícone mostrando o campo no form. 
Fiquei mais uma vez muito satisfeito com a solução do struts 2 para definição destes padrões. Basicamente o struts 2 utiliza uma estrutura de templates e temas que nos dá uma enorme flexibilidade na manipulação destes forms. A documentação do struts tem várias informações sobre isso nos links: 


Como não conheco linguagens de templates eu levei cerca de 3 horas e 30 minutos entre o início da minha pesquisa para modificar os templates até conseguir o que queria. 
Como ainda não tive tempo para colocar uma formatação decente para apresentação de código fonte, principalmente html, deixo aqui o link do fórum do javaranch onde iniciei um tópico de discussão sobre este assunto e postei todo o código e procedimento que adotei até conseguir chegar a uma solução final, tá tudo explicado lá no fórum(em inglês). 
Basicamente o que mudou com este código foi do seguinte padrão(imagem abaixo): 
No final ficou no seguinte padrão(imagem abaixo):
Struts 2 rocks!
[]s

10 de mar. de 2009

Struts 2 - Como fazer upload

Segue um passo a passo de como fazer upload utilizando o Struts 2. A documentação oficial sobre este assunto pode ser encontrada em : http://struts.apache.org/2.1.6/docs/handling-file-uploads.html .  O processo é bastante simplificado pois o Struts 2 utiliza um Interceptor (fileUpload)  e a librarie Jakarta Commons FileUpload, esta semana precisei revisar este tópico, então segue aqui um rápido passo a passo:
1) A primeira coisa é mudar o s:form adicionando o enctype, fica assim: 

O que possitilita o upload é a entrada: enctype="multipart/form-data" que foi adicionado no form.

2) Utilizar um campo s:file no jsp
s:file name="foto" label="Sua foto"

3) Criar uma Action para receber a requisição. E registrá-la no struts.xml, ou conforme o tipo de configuração que estiver utilizando, o struts 2 tem um plugin "Zero Configuration" ou pode utilizar anotations também como opções. Como estamos utilizando o Interceptor para fazer o upload tudo o que tive que fazer na action foi declarar as seguintes propriedades e seus respectivos métodos setXXX

private File foto;
private String fotoFileName;
private String fotoContentType;

4) No método da action para tratar o arquivo escrevi o seguinte código: 
//pega ServletContext para definir um diretório para a foto.
   ServletContext sContext = ServletActionContext.getServletContext();
   //checa se o arquivo não é nulo.
   if(foto != null)
   {
    //direciona as fotos para este diretório.
    String diretorioFotos = sContext.getRealPath("/WEB-INF/fotos");
  
    //Cria o diretório se o mesmo não existir.
    File dirPath = new File(diretorioFotos);
       if (!dirPath.exists())
       {
        log.debug("diretorio nao existe criando==>> " + diretorioFotos);
           dirPath.mkdirs();
       }
  
       //salva a foto com o nome do e-mail do usário para evitar duplicidade.
    File arquivoSalvo = new File(diretorioFotos, getRequest().getSession().getAttribute("email").toString() + "." + getExtensaoArquivo());
  
    foto.renameTo(arquivoSalvo);
    log.debug("Content type: " + fotoContentType);
   }

E pronto, este é o processo básico para upload utilizando Struts 2 . Não entrei em detalhes de configurações que podem ser feitas como : tamanho máximo de arquivo, extensões válidas, etc. Para mais informações sobre estas questões ver as referências no site do struts 2 em(versão 2.1.6): 

e