Curso básico de DWR Christiano Milfont Frameworks Ajax Tipos de Frameworks Anatomia do Framework DWR Configuração Creators e Converters DWRUtils Aplicações com a teoria
Frameworks Ajax
Um Framework Ajax utiliza as tecnologias: CSS (camada de formatação da apresentação); XHTML (camada de estrutura da apresentação); XML (dados a serem manipulados) e JSON (outra especificação do formato dos dados); Javascript (camada de controle) por meio de DOM (modelo de árvore de objetos) e com o objeto XMLHttpRequest (que fornece conexões assíncronas). Extende essa tecnologias padrões com componentes de eventos, efeitos, Drag'n'Drop, entre outros. O benefício de se usar um Framework Ajax é o encapsulamento da complexidade de manipulação das tecnologias necessárias, fornecendo um só mecanismo Cross Browser que permita a utilização do ajax com acessibilidade semelhante ao ambiente desktop, além de facilitar o tratamento dos dados nas as camadas físicas entre o lado cliente e o lado servidor.  Frameworks Ajax
Tipos de Frameworks Ajax Javascript Multipurpose: frameworks que fornecessem componentes sobre o conjunto de todas as tecnologias web no lado cliente e mecanismos de acesso ao lado servidor, como o encapsulamento do tratamento dos dados. Javascript Remote: frameworks que são especialistas no encapsulamento do mecanismo de troca de objetos entre as camadas físicas.  Javascript Specialized: frameworks que são especialistas em somente um determinado comportamento ou mecanismo do conjunto de tecnologias web, como por exemplo: especialistas em efeitos ou somente na extensão do javascript.
Javascript Multipurpose Frameworks... Javascript Remoting Frameworks... Javascript Specialised Frameworks... Tipos de Frameworks Ajax
Anatomia do DWR O DWR habilita a interação entre o Java no servidor e o Javascript no Browser,  encapsulando a tradução dos objetos entre esses ambientes físicos diferentes. O DWR realiza a tradução dos objetos com base na especificação JSON (Javascript Object Notation). JSON é um formato leve de troca de dados baseado em um subconjunto da especificação Javascript mas independente de linguagens.
Anatomia do DWR JSON  (Javascript Object Notation) http://www.json.org/
Anatomia do DWR JSON  http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf "An ECMAScript object is an unordered collection of properties each with zero or more attributes..." Standard ECMA-262 - 3r d Edition - December 1999
Anatomia do DWR
Configuração Acrescenta biblioteca dwr.jar ao projeto  Mapeamento dos seus POJOS no dwr.xml Mapeamento do servlet no web.xml Importa o Engine e interfaces nas páginas Faz as chamadas aos objetos mapeados Manipulação dos POJOS
Acrescenta biblioteca dwr.jar ao projeto  Configuração
Criar arquivo dwr.xml em WEB-INF e mapear as classes Configuração
Mapeamento do servlet no web.xml  Configuração
Importar o Engine e interfaces nas páginas Configuração
Faz as chamadas aos objetos mapeados e manipula o resultado Configuração
Creators e Converters <allow>  Seção no dwr.xml para a definição das classes criadas e convertidas   <create creator=&quot;...&quot; javascript=&quot;...&quot;/> Definição para as classes que necessitam de execução de seus métodos. Geralmente usado para fachadas da camada de controle. <convert converter=&quot;...&quot; match=&quot;...&quot;/> Conversor que fará a tradução das camadas físicas entre o cliente e Servidor
Creators e Converters <create creator=&quot;...&quot; javascript=&quot;...&quot; scope=&quot;...&quot; /> “ creator”: Atributo obrigatório que representa o tipo de Creator, geralmente usamos o tipo “new” que usa o operador “new” do Java. “ javascript”: Atributo que representa o nome da classe no javascript. “ scope”: Atributo opcional que representa o scope definido na especificação de servlet, os valores possíveis são: “application”, “session”, “request” e “page”
Creators e Converters <create creator=&quot;...&quot; javascript=&quot;...&quot; scope=&quot;...&quot;> <param name=&quot;...&quot; value=&quot;...&quot;/> <auth method=&quot;...&quot; role=&quot;...&quot;/> <exclude method=&quot;...&quot;/> <include method=&quot;...&quot;/> </create> “ param”: Elemento usado para definir configurações do creator usado, no tipo “new” serve para definir a classe. “ auth”: Elemento que habilita o nível de controle de acesso do JEE. “ include e exclude”: Elementos que habilitam ou desabilitam respectivamente, métodos da classe usada no creator.
Creators e Converters <convert converter=&quot;...&quot; match=&quot;...&quot;/> “ converter”: Atributo que representa o tipo de conversor, o mais comum é o Bean que segue a especificação “Java Bean”. “ match”: Atributo que representa a classe que será convertida, algumas classes da API já são convertidas por padrão e não precisam ser anotadas.
Creators e Converters
DWRUtils Conjunto de funções javascript definidas no utils.js que ajudam na manipulação dos objetos com o DWR. Existem 4 funções básicas, getValue, getValues, setValue e setValues que são as funções usadas para popular os forms a partir dos beans e vice-versa. Funcionam com todos os elementos HTML com exceção de tabelas, listas e imagens. Para a edição de tabelas e listas existem outras funções como: addRows() e removeAllRows() para tabelas e addOptions e removeAllOptions() para listas.

Tw Dwr 2007 Ap01

  • 1.
    Curso básico deDWR Christiano Milfont Frameworks Ajax Tipos de Frameworks Anatomia do Framework DWR Configuração Creators e Converters DWRUtils Aplicações com a teoria
  • 2.
  • 3.
    Um Framework Ajaxutiliza as tecnologias: CSS (camada de formatação da apresentação); XHTML (camada de estrutura da apresentação); XML (dados a serem manipulados) e JSON (outra especificação do formato dos dados); Javascript (camada de controle) por meio de DOM (modelo de árvore de objetos) e com o objeto XMLHttpRequest (que fornece conexões assíncronas). Extende essa tecnologias padrões com componentes de eventos, efeitos, Drag'n'Drop, entre outros. O benefício de se usar um Framework Ajax é o encapsulamento da complexidade de manipulação das tecnologias necessárias, fornecendo um só mecanismo Cross Browser que permita a utilização do ajax com acessibilidade semelhante ao ambiente desktop, além de facilitar o tratamento dos dados nas as camadas físicas entre o lado cliente e o lado servidor. Frameworks Ajax
  • 4.
    Tipos de FrameworksAjax Javascript Multipurpose: frameworks que fornecessem componentes sobre o conjunto de todas as tecnologias web no lado cliente e mecanismos de acesso ao lado servidor, como o encapsulamento do tratamento dos dados. Javascript Remote: frameworks que são especialistas no encapsulamento do mecanismo de troca de objetos entre as camadas físicas. Javascript Specialized: frameworks que são especialistas em somente um determinado comportamento ou mecanismo do conjunto de tecnologias web, como por exemplo: especialistas em efeitos ou somente na extensão do javascript.
  • 5.
    Javascript Multipurpose Frameworks...Javascript Remoting Frameworks... Javascript Specialised Frameworks... Tipos de Frameworks Ajax
  • 6.
    Anatomia do DWRO DWR habilita a interação entre o Java no servidor e o Javascript no Browser, encapsulando a tradução dos objetos entre esses ambientes físicos diferentes. O DWR realiza a tradução dos objetos com base na especificação JSON (Javascript Object Notation). JSON é um formato leve de troca de dados baseado em um subconjunto da especificação Javascript mas independente de linguagens.
  • 7.
    Anatomia do DWRJSON (Javascript Object Notation) http://www.json.org/
  • 8.
    Anatomia do DWRJSON http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf &quot;An ECMAScript object is an unordered collection of properties each with zero or more attributes...&quot; Standard ECMA-262 - 3r d Edition - December 1999
  • 9.
  • 10.
    Configuração Acrescenta bibliotecadwr.jar ao projeto Mapeamento dos seus POJOS no dwr.xml Mapeamento do servlet no web.xml Importa o Engine e interfaces nas páginas Faz as chamadas aos objetos mapeados Manipulação dos POJOS
  • 11.
    Acrescenta biblioteca dwr.jarao projeto Configuração
  • 12.
    Criar arquivo dwr.xmlem WEB-INF e mapear as classes Configuração
  • 13.
    Mapeamento do servletno web.xml Configuração
  • 14.
    Importar o Enginee interfaces nas páginas Configuração
  • 15.
    Faz as chamadasaos objetos mapeados e manipula o resultado Configuração
  • 16.
    Creators e Converters<allow> Seção no dwr.xml para a definição das classes criadas e convertidas <create creator=&quot;...&quot; javascript=&quot;...&quot;/> Definição para as classes que necessitam de execução de seus métodos. Geralmente usado para fachadas da camada de controle. <convert converter=&quot;...&quot; match=&quot;...&quot;/> Conversor que fará a tradução das camadas físicas entre o cliente e Servidor
  • 17.
    Creators e Converters<create creator=&quot;...&quot; javascript=&quot;...&quot; scope=&quot;...&quot; /> “ creator”: Atributo obrigatório que representa o tipo de Creator, geralmente usamos o tipo “new” que usa o operador “new” do Java. “ javascript”: Atributo que representa o nome da classe no javascript. “ scope”: Atributo opcional que representa o scope definido na especificação de servlet, os valores possíveis são: “application”, “session”, “request” e “page”
  • 18.
    Creators e Converters<create creator=&quot;...&quot; javascript=&quot;...&quot; scope=&quot;...&quot;> <param name=&quot;...&quot; value=&quot;...&quot;/> <auth method=&quot;...&quot; role=&quot;...&quot;/> <exclude method=&quot;...&quot;/> <include method=&quot;...&quot;/> </create> “ param”: Elemento usado para definir configurações do creator usado, no tipo “new” serve para definir a classe. “ auth”: Elemento que habilita o nível de controle de acesso do JEE. “ include e exclude”: Elementos que habilitam ou desabilitam respectivamente, métodos da classe usada no creator.
  • 19.
    Creators e Converters<convert converter=&quot;...&quot; match=&quot;...&quot;/> “ converter”: Atributo que representa o tipo de conversor, o mais comum é o Bean que segue a especificação “Java Bean”. “ match”: Atributo que representa a classe que será convertida, algumas classes da API já são convertidas por padrão e não precisam ser anotadas.
  • 20.
  • 21.
    DWRUtils Conjunto defunções javascript definidas no utils.js que ajudam na manipulação dos objetos com o DWR. Existem 4 funções básicas, getValue, getValues, setValue e setValues que são as funções usadas para popular os forms a partir dos beans e vice-versa. Funcionam com todos os elementos HTML com exceção de tabelas, listas e imagens. Para a edição de tabelas e listas existem outras funções como: addRows() e removeAllRows() para tabelas e addOptions e removeAllOptions() para listas.