quinta-feira, 23 de junho de 2011

Browser detect...

Aproveitando o embalo do Save As..., vamos avançar um pouco com Javascript + Genexus, desta vez detectando o navegador que o usuário está utilizando.

A operação de detecção do browser não é muito importante no Genexus, visto que a própria ferramenta já trata isso automaticamente.  Acontece que nossa curiosidade nos leva a programar outros recursos disponíveis diretamente em Javascript, e com isso, esbarramos na compatibilidade do navegador.

Javascript é a linguagem para programação no navegador, e entre seus recursos temos a classe Navigator, que apresenta informações a respeito do browser.  A tabela a seguir apresenta as informações retornadas por essa classe.

Opera
navigator.appCodeName:  Mozilla
navigator.appName: Opera
navigator.appVersion:  9.80 (Windows NT 6.1; U; en)
navigator.cookieEnabled:  true
navigator.platform: Win32
navigator.userAgent:  Opera/9.80 (Windows NT 6.1; U; en) Presto/2.8.131 Version/11.11
Chrome
Browser CodeName: Mozilla
Browser Name: Netscape
Browser Version: 5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.30 (KHTML, like Gecko) Chrome/12.0.742.100 Safari/534.30
Cookies Enabled: true
Platform: Win32
User-agent header: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.30 (KHTML, like Gecko) Chrome/12.0.742.100 Safari/534.30
Internet Explorer
Browser CodeName: Mozilla
Browser Name: Microsoft Internet Explorer
Browser Version: 5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; eMusic DLM/4; InfoPath.1; .NET4.0C; .NET4.0E)
Cookies Enabled: true
Platform: Win32
User-agent header: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; eMusic DLM/4; InfoPath.1; .NET4.0C; .NET4.0E)
Firefox
Browser CodeName: Mozilla
Browser Name: Netscape
Browser Version: 5.0 (Windows)
Cookies Enabled: true
Platform: Win32
User-agent header: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:2.0.1) Gecko/20100101 Firefox/4.0.1

Para obter os valores é necessário programar o código a seguir no Genexus em um controle Textblock, marcado com a propriedade HTML.

Detectando o Navegador

O processo de detecção em Genexus envolve a obtenção do valor do navigator.appName e seu tratamento dentro da área de Events do painel. Em outras palavras, obter via Javascript o tipo de browser e passar para o Genexus tratar em sua área de código.

Para fazer isso, podemos programar, no Event Start um processo que carrega o tipo de navegador em uma variável, seria melhor colocar isso no Login do sistema, pois, desta forma teriamos o valor para futuras referencias dentro do sistema. Então, em nosso exemplo temos um WebPanel que realiza o login do usuário, e uma variável chamada &NavTipo que fica com visible=0;


Um Textblock (tipo HTML) é usado para programarmos o código em Javascript que intercepta o navegador.
Ao informar seu usuário e senha e em seguida pressionar-se o botão confirmar, o sistema devolverá o tipo de browser que o usuário está utilizando.

A programação Javascript + Genexus oferecem desafios bem interessantes e com certeza permite a construção de interfaces avançadas.  Se você não entendeu direito como funcionou a parte referente à gravação da variável Genexus, recomendo ler um pouco a respeito do Javascript DOM.

Boa programação!



Save As...

Que tal abrir uma janela popup e em seguida realizar uma operação de salvar um arquivo TXT, previamente carregado nessa janela. Numa dessas operações automáticas que devemos fazer para agradar nossos usuários, tivemos essa necessidade, visto que a operação exigia que um arquivo TXT fosse gerado no Gx e em seguida armazenado no diretório local do usuário.

Infelizmente esse modelo de programação, javascript, limitou a solução ao navegador Internet Explorer, e os demais não se deram muito bem com esse recurso, creio que isso afeta um pouco a segurança, mas pelo menos alguma coisa.
 
Para que o código funcione é necessário criar um WebPanel com um componente EmbPage e um Textblock, sendo que este último deve estar no formato HTML.

Duas variáveis são utilizadas para indicar o local onde o arquivo se encontra e também para determinar um nome default para a criação no diretório local do usuário.

&NomeGravar    = "teste.txt"  // nome do arquivo a ser gravado
&LocalArquivo  = "teste.txt"   // local onde se encontra o arquivo a partir da raiz do sistema

O resultado é a apresentação do dialogo de salvamento do windows.


O efeito é muito interessante, pena que não foi uma solução completa.


terça-feira, 14 de junho de 2011

3 Anos, isso é incrivel!

Vejam que coisa impressionante, hoje fazem exatamente 3 anos da primeira postagem no Blog Genexando, não sou nada ligado a datas mas fui conferir, e por incrivel que pareça a primeira foi a três anos atras.

Refletindo um pouco acho que isso quer dizer:

1. Fiquei mais velho 3 anos, e nem vi passar, :(

2. Apesar de ter ficado 3 anos mais velho, ainda acho que programar computador é legal, :)

3. O Lula não é mais o presidente, :), mas a Dilma ficou, :(, pensando melhor, acho que não faria muita diferença, :)

4. Acho que nenhum imposto novo foi criado nesses três anos, mas não tenho certeza, :)

5. O Didi ainda possui um programa na Tv, :), pensando melhor acho que todos os apresentadores de programas da minha época de infância ainda estão com programas na Tv (Didi, Hebe, Gugu, Xuxa), reparando melhor nisso, veja que todos tem 4 letras, com excessão ao Ratinho. :)

Enfim, tantas coisas legais, algumas iguais, aconteceram nesses três anos, mas sabe de uma coisa, acho que valeu a pena.  Achava que não daria conta de escrever alguns posts, mas foi uma experiência bem legal.

Valeu a força!

ps. a Xuxa não foi da minha época de infância, ok!, :(

segunda-feira, 13 de junho de 2011

Interfaces web na base do fórceps!

Você sabe o que é fórceps?  Calma, não é um novo acrônimo na informática, nem mesmo significa alguma tecnologia nova relacionada a TI, ou mesmo um novo modelo de roteador.

Durante muito tempo minhas interfaces web não respondiam de forma adequada, e os valores apresentados não eram corretos, isto apesar de serem geradas sem erros. Ou seja, construir uma interface gráfica web em Genexus parecia, de vez em quando, um parto mal resolvido, não que eu saiba direito o que significa isso, mesmo porque esse assunto é mais relacionado com as meninas, mas imagino que deve doer pra caramba. 

Então, como dominar esse assunto e sofrer menos com as dores de parto, ou pior, apelando para o fórceps, ou seja, vai meio que na marra! Abaixo apresento meu manual para um parto sadio.

URL ou Formulário
Para responder essa pergunta é necessário primeiro entender como ocorre o mecanismo de comunicação entre o cliente e o servidor no protocolo HTTP. Como assim? Existem dois tipos de chamadas que podem acontecer entre um cliente a um servidor web. Pelo endereço de URL ou via FORM.
A chamada com URL acontece quando digitamos um um endereço válido no navegador, como por exemplo: http://www.google.com, ou quando estamos em um programa, ao selecionar uma opção no menu do sistema.


A chamada via FORM, por sua vez, ocorre quando preenchemos algum controle Edit em um formulário na interface web e  em seguida pressionamos algum botão que faz com que o controle seja enviado ao servidor, esse botão normalmente é do tipo SUBMIT. A própria interface do Google possui um formulário, e ao pressionar o botão Pesquisa Google, por exemplo, estamos realizando um acesso ao programa do Google, através de uma chamada de Formulário.

Na nomenclatura oficial do WWW, a chamada via URL é denominada GET, e a via Formulário é denominada POST, salvo os detalhes de configurações que podem ser feitas, alterando um pouco isso.

GET

Sempre a primeira chamada a um programa acontece pela URL, e é denominada GET.  Sua principal característica é a passagem de parâmetros, que acontece no próprio ‘endereço’ do programa. Para isso usa-se uma interrogação (?) para separar o nome do programa da lista de parâmetros. O GxTechnical, por exemplo, cria chamadas com um montão de parâmetros separados por virgula (,).


Existem nessa chamada dois elementos fundamentais, o programa (ou script) que é informado antes da interrogação, http://www2.gxtechnical.com/portal/hgxpp001.aspx, e os parâmetros que consiste na lista após a interrogação, 15,1,400,O,S,0,PAG;CONC;2;22;D;33688;1;PAG;,

POST

A chamada que acontece pelo envio de um formulário, é denominada POST, e têm por característica principal a passagem de parâmetros de forma interna, ou seja, os valores não são facilmente perceptíveis ao usuário, é como se ficassem ocultos. Os dados são encapsulados (embutidos) no pacote enviado ao servidor.

Genexus

Genexus realiza ambos os processos de comunicação de forma automática. A primeira chamada a um programa sempre acontece sempre no formato GET e, na seqüência, após a manipulação de um formulário apresentado por este programa, ocorrem chamadas POST, tanto nos objetos Transação quanto WebPanel.
Então vamos de fato aos eventos ‘Start’ e ‘Refresh’, que ocorrem na abertura da Transação ou WebPanel. Qual a seqüência em que são executados e seus significados, em função do tipo de chamada no servidor?

Chamada GET
É realizada na primeira chamada a um programa, e nesse caso, ocorre uma seqüência simples de eventos até que a página seja completamente construída no servidor e enviada ao usuário.


Nesta chamada o servidor executa as ações programadas no evento Start, em seguida as que se encontram no Refresh e finalmente para cada linha da tabela referenciada na interface o evento Load.
Chamada POST
Esta é a chamada realizada quando o usuário provoca um evento na interface previamente apresentada, por exemplo, quando pressiona o botão Confirmar, ou quando seleciona uma linha com evento associado em um controle Grid.

Nessa chamada ocorrem duas ações antes do evento Refresh, sendo a primeira a leitura de todas as variáveis que se encontram no formulário, ou seja, os conteúdos fornecidos pelo usuário ficam conhecidos do programa, antes disso os valores considerados são os definidos em Start.  Em seguida, após conhecer os valores digitados, ocorre o Evento provocado pelo usuário, ou seja, se foi o botão Confirmar, ocorrem às ações que foram programadas no evento Enter, e assim por diante.

Finalmente, após essas duas ações terem sido consideradas inicia-se a carga da database, ou seja, o evento Refresh e Load.

Podemos entender então que até o evento Refresh ser executado, as ações anteriores diz respeito ao conhecimento dos valores default e informados pelo usuário, consistindo em uma fase de definições.  E ainda que antes do Refresh, não temos ainda a configuração exata que a interface deverá trabalhar, visto que os valores manipulados ainda não foram totalmente conhecidos. 

Portanto, o melhor lugar para se pensar na construção da interface gráfica é o evento Refresh, ao invés do evento Start.  O evento Load seria muito interessante também, mas não se esqueça que se houver alguma tabela base associada à interface, o evento se transforma em um for...each, ou seja, é executado mais de uma vez. 

Então agora fica mais compreensível a sequencia do parto: 

  1. Start possui apenas valores default.
  2. Para construir uma interface que tenha um comportamento condizente com a operação do usuário inicie a programação da mesma a partir do evento Refresh.
  3. Genexus não possui um evento posterior ao Load, isso poderia ser incluído na ferramenta, vamos incluir na lista do Genexus dos Sonhos!
  4. E por favor, quando o assunto tem mesmo a ver com nomes de criança, não se inspire na novela das 8, no jogador de futebol da moda, ou em nomes famosos, rs....
Conclusão

Bom, agora se voce de fato ficou interessado em assuntos relacionados a partos, inclusive leu esse post achando que eu ia falar a respeito de contrações, dilatação, cesariana, ..., recomendo um site na web: http://www.gestantes.net/ ou mesmo http://www.amigasdoparto.com.br/.