Resolvendo erros de permissão ao instalar Yeoman

Ao tentar instalar o Yeoman no Ubuntu 12.04, tive uma série de problemas com permissão. Achei curioso, visto que era uma instalação simples com o npm. O problema, na verdade, era com a minha instalação do nodejs/npm. Eu utilizei o gerenciador de pacotes (apt) pra fazer a instalação destes programas, o que aparentemente não é adequado. Removi o npm/node e reinstalei, seguindo este artigo:

http://www.joyent.com/blog/installing-node-and-npm

Utilizei a primeira solução proposta, que se encontra aqui:

https://gist.github.com/isaacs/579814

Depois disto, tudo funcionou!

AngularJS: Conceitos Principais

Tenho estudado e trabalhado com AngularJS nos últimos meses e, neste post, pretendo abordar os principais conceitos do framework e, também, qual o motivo que me fez utilizá-lo.

Minha trajetória desenvolvendo aplicações web é um pouco diferente da maioria dos desenvolvedores web. Quando comecei a trabalhar profissionalmente, embora conhecesse html, css e javascript razoavelmente, iniciei com projetos Flex. Ainda tenho que manter alguns sistemas legados em Flex, mas de um tempo pra cá ficou claro que desenvolver novas aplicações nesta tecnologia não é uma boa opção (aliás, acho que nem no passado era, embora este seja assunto para outro post).

Com Flex eu sempre procurei estruturar minhas aplicações de maneira adequada. Usando o framework Spring Actionscript eu conseguia utilizar Injeção de Dependências e, somado aos recursos de binding do Flex, era relativamente simples aplicar o padrão MVC. Ao migrar para a tríade html/css/javascript eu tive muita dificuldade para estruturar as aplicações baseadas em ajax adequadamente. Aí que conheci o AngularJS.

Os conceitos que eu considero chave no AngularJS são os seguintes: Data binding, Injeção de Dependências, MVC, diretivas e testabilidade. Segue uma breve descrição a respeito deles e de como o Angular os aplica.

Data binding: data-binding possibilita que os valores do modelo e da view sejam sincronizados. Ou seja, se eu tenho um objeto javascript, ao alterá-lo a minha view prontamente se atualiza, sem a necessidade de manipular o DOM e ajustar os valores. No AngularJS ocorre o chamado two-way data binding, onde tanto uma alteração no modelo atualiza a view quanto uma atualização na view atualiza o modelo (no Flex o binding passou a ser de duas vias - two-way -) somente na versão 4).

Além disto, a técnica utilizada pelo AngularJS não é baseada em eventos para realização do binding. Basicamente, o AngularJS compara a cada ciclo se os objetos foram alterados, caso sim, ele faz a sincronização. Este modelo pode ter algumas restrições de performance, mas nunca tive problemas com isto. A vantagem deste modelo é que não existe nada obscuro, qualquer objeto pode ser passível de ser utilizado no binding (mesmo que seja uma propriedade interna do objeto) ou uma função. Com Flex, fazer binding de propriedades internas dos objetos era eventualmente bem complicado.

Injeção de dependências: há muitos textos sobre Injeção de Dependências, mas de maneira breve, ao utilizar DI, ao invés de instanciar os objetos programaticamente, você simplesmente pede por um determinado objeto. O container (neste caso o AngularJS) decide como construi-lo e o fornece para você. A vantagem desta abordagem é a redução de acoplamento entre os objetos e, consequentemente, maior facilidade para testar os objetos. Os componentes do AngularJS estão disponíveis via DI e você também pode (e deve!) configurar seus objetos para serem injetados.

Um detalhe interessante: normalmente em Java ou em outras linguagens estaticamente tipadas, a DI é feita por padrão pelo tipo do objeto. No caso do AngularJS, como Javascript é uma linguagem dinamicamente tipada, a injeção é feita por meio do nome do objeto.

MVC (Model-View-Controller): aplicações AngularJS tipicamente são construídas usando o padrão MVC. Este padrão visa separar a view do modelo, de modo que caso seja necessário alterar a view (ou ter mais de uma view para o mesmo modelo) seja simples. Mais do que isto, utilizar um padrão como o MVC auxilia outros desenvolvedores a lerem o seu código, desde que eles conheçam o pattern.

O fato de possuir data binding e DI facilita muito a construção de aplicações MVC. Além disso há diretivas especificas para este fim, de modo que as aplicações ficam muito bem estruturadas.

Diretivas: As diretivas possibilitam estender o código HTML de maneira simples. É por meio destas que são criados componentes baseados em html. O AngularJS faz parsing do documento html, procura cada diretiva e inicializa ela de acordo com o código que você configura. As diretivas ainda possibilitam que você programe de maneira mais declarativa.

Dentro das diretivas é onde você manipula o DOM, se necessário. Nunca faça isto nos controladores. Para manipular, você pode utilizar a API do Angular que basicamente é um jquery simplificado. Se o jquery tiver sido adicionado, o AngularJS usa ele ao invés desta API simplificada.

Testabilidade: Escrever testes com o AngularJS é muito fácil. Primeiro porque a arquitetura dele tem baixo acoplamento (devido à DI) e, segundo, porque ele acompanha o Karma – uma excelente ferramenta para executar testes. O comum é utilizar o Karma associado ao Jasmine para escrever os testes. Após utilizar o AngularJS eu realmente passei a escrever muito mais testes e, atribuo principalmente a isto, a melhor qualidade dos meus códigos.

Pra não parecer um fanboy desesperado por conseguir novos adeptos, vou listar as duas principais desvantagens do AngularJS:

Falta de documentação: Refiro-me a documentação oficial, visto que ainda não li os livros disponíveis (estão na minha lista!). Como é um framework bastante novo, é natural que não tenha muita documentação. Apesar disto, quando precisei, pude ler o código do framework sem muita dificuldade.

Conceitos complexos: talvez falar em data-binding, DI, MVC e herança por protótipos (que vem do javascript na verdade) seja algo um pouco complexo para alguns devs. Entretanto eu acredito que buscar compreender estes conceitos valha a pena para quem deseja criar programas mais complexos.

Concluindo e terminando este post, tenho gostado muito do Angular. Certamente há muito mais a ser escrito a respeito dele, tratei apenas do que considero fundamental. Pretendo escrever mais para os milhões de leitores deste blog. :-D

Conhecimento Eletrônico rejeitado por falta de informações de seguro

Se você tem aplicativos que sincronizam com a sefaz para emissão de conhecimento eletrônico (CTe) e subitamente eles passam a ser rejeitados com o status 665 e a mensagem:

Rejeição: As informações do seguro da carga devem ser preenchidas para o modal rodoviário

não se assuste, veja no portal da fazenda, norma técnica 2013.001:

http://www.cte.fazenda.gov.br/listaConteudo.aspx?tipoConteudo=Y0nErnoZpsg=

Que agora (abril de 2013) realmente este campo passa a ser obrigatório para cte normal ou de substituição (0 ou 3).

A obrigatoriedade é, em homologação, a partir de 15/04/2013 e, em produção, a partir de 15/05/2013.

Cuidado ao comprar produtos LG

Comprei um notebook da LG há pouco mais de 1 ano e, desde então, venho tendo problemas devido a baixa qualidade do produto e o péssimo suporte. O notebook que comprei é o A520PBE51P1, que posteriormente foi trocado pelo A530-T.BE76P1 - que também apresenta problemas de hardware. Fiz uma reclamação aqui, quem tiver interesse dê uma olhada:

http://www.reclameaqui.com.br/3872545/lg-electronics/problemas-nos-notebooks-lg-a520pbe51p1-e-a530-t-be76p1/

Enfim, estou decepcionado com a marca e fica o post pra registrar isto. Cuidado com a LG! Já tive notebooks da Dell e HP antes e nenhum deles me deu tanto trabalho.

Using commas instead of dots to represent decimal numbers in Flex NumericStepper

When we need to specify a decimal number here in Brazil (and in many other countries) we usually do not use dots. We use commas. So, instead of writing U$1.26 to represent one dollar and twenty-six cents, we write U$1,26.

The problem is that when we're using a Flex NumericStepper there isn't a place to set this. The only way I've found to get NumericStepper working with commas was to change the behaviour of the NumericStepper's TextInput. So I've created a different TextInput, called BrazilianNumberTextInput. Here it is:

package com.blogspot.wagnermezaroba.components
{
  import mx.controls.TextInput;

  public class BrazilianNumberTextInput extends TextInput {
   
      override public function get text():String {
          var t:String = super.text;
          if ( t != null )
              t = t.replace(/\./g, '').replace(/,/g, '.');
          return t;
      }
  }
}

What I've done is simple. I replaced all the dots for nothing (that was the desired effect that we needed) and all the commas for dots. So NumericStepper will be able to parse the values. But we need to set NumericStepper to use our new TextInput component. I've done this in my css file:

mx|NumericStepper {
  textInputClass: ClassReference("com.blogspot.wagnermezaroba.components.BrazilianNumberTextInput");
}

It's an ugly solution. But I haven't found any solution on the internet and so far I do not believe there is a different way to go.

And that's it. If you're going to use it, it would be good to set the restrict property, to constrain the user input and allow just numbers and commas.

Enter working as Tab in a Flex DataGrid

If you're using a Flex DataGrid with the editable property set to true, the default behaviour of the Tab key is moving from one editable cell to another one while the Enter key move from one row to another one. There isn't any DataGrid option to easily make Enter key behaves like Tab key. And you can't override the KEY_DOWN event handler method of the DataGrid directly. However, you can register your own handler with a higher priority than the default DataGrid handler. By doing this, your handler will be called before DataGrid handler giving you the possibility to customize the action of the pressed keys. That's what we're going to do.

In your own handler you can check if the pressed key is Enter and than simply stop the propagation of the KeyboardEvent. Ok, this disables the default Enter event. But how can we make Enter works as Tab? We can just dispatch a fake KEY_FOCUS_CHANGE event. And that's it! Let's see the code:

public class CustomDataGrid extends DataGrid {

   public function CustomDataGrid() {
       super();
   }
 
   /*
    * After Flex register its own handler in the createItemEditor method,
    * we register our event listener with a higher priority (100).
    */
   override public function createItemEditor(colIndex:int, rowIndex:int):void {
       super.createItemEditor(colIndex, rowIndex);          
       DisplayObject(itemEditorInstance).addEventListener(KeyboardEvent.KEY_DOWN, onEditorKeyDown, false, 100);
   }

   /*
    * If the pressed key is Enter, stop the propagation and
    * dispatch a fake Tab Event.
    */  
   protected function onEditorKeyDown(event:KeyboardEvent):void {
       if (event.charCode == Keyboard.ENTER && event.keyCode != 229) {
           event.stopImmediatePropagation();
           dispatchEvent(new FocusEvent(FocusEvent.KEY_FOCUS_CHANGE, true, false, null, event.shiftKey, Keyboard.TAB));
       }
   }
}

Be careful with itemRenderers and itemEditors

If you are using a custom itemRenderer or itemEditor, I recommend you to pay attention to the events they dispatch. They can dispatch extra events that make your Enter key not behaves exactly like the Tab key, specially if you're listening to the ITEM_EDIT_END event. It depends on the case, but if you're having problems with this use the same technique to interrupt not convenient events on your itemEditor or itemRenderer.

And that's it!

Zope 3 no Ubuntu Jaunty -(9.04)

Comecei a estudar Zope recentemente e, quando fui instalar o Zope 3 no Ubuntu 9.04 tive um pequeno contratempo. Não sei se é algo comum, mas não achei uma resposta na web (procurei tão pouco que pode ser que tenha). Basicamente, após ter instalado o pacote zope3 e ter criado uma instância do zope da seguinte maneira:

$sudo /usr/lib/zope3/bin/mkzopeinstance

eu tentava subir o Zope com:

$sudo /etc/init.d/zope3

e a instância simplesmente falhava. Então tentei subir a instância diretamente com:

$sudo /local_da_minha_instancia/test/bin/zopectl fg

E foi acusado um erro no arquivo /local_da_minha_instancia/test/etc/zdaemon.conf. Basicamente faltava colocar um % em frente ao define da segunda linha. Coloquei e resolveu meu problema.

Acredito que esse arquivo seja gerado automaticamente, daí o erro. De qualquer maneira deixo relatado aqui pra quem tiver o mesmo problema (ou uma explicação melhor pra ele!).


Abraço.