Considero o finado Megaupload e similares iguais a um camelô que vende DVD pirata no centro da cidade. Ambos representam a mesma filosofia, copiam obras sob leis de copyright e faturam sem pagar royalties.

Isso é pirataria ☠, Don Vito Corleone disse uma vez:

Não me importa como um homem ganha sua vida, desde que não atrapalhe meus negócios.

Logo depois ele levou tiros e foi parar no hospital, mensagem de vida para demonstrar que mesmo no crime existe ética e posicionamento. Quando você relega a defesa de seus princípios essa omissão retorna contra você.

Eu não vou exaltar o que o grupo #anonymous fez, estão defendendo quem não merece e isso ajuda a atrapalhar o entendimento já confuso sobre a diferença entre pirataria e compartilhamento.

Sobre o que penso sobre compartilhamento está resumido numa entrevista que dei para o Uol em 2007. Tem quase tudo lá.

Pirataria vs Compartilhamento

Eu como anarco, considero o compartilhamento justo e salutar, ninguém tem dinheiro ou disposição suficiente de comprar todas as obras que existem sejam de que campo de conhecimento for, isso é até impossível. O problema com o digital é a tênue fronteira entre  ”emprestar” a cópia que comprei legalmente com um amigo e espalhar uma obra fazendo que ninguém precise comprar.

Corrijo-me, o problema não é com o digital, é com a distribuição. Vejamos:

Na época da fita cassete a indústria até mantinha incentivos para que as pessoas compartilhassem suas cópias, o mesmo aconteceu com o cd facilitando a cópias e barateando o custo de copiar, ainda assim isso não ameaçou os negócios. Era muito trabalhoso, voce fazia cópias e teria que se encontrar com o amigo para entregar, o boca-a-boca necessário para ajudar no marketing era lento. Nosso P2P da época.

Com a internet a distribuição ficou gratuita, não temos mais necessidade de encontro físico, Era do napster e depois kazaa. Aí a indústria começou a amargar diminuição de vendas.

Depois surgiram tecnologias que facilitariam o P2P como o torrent, utopia anarquista.

Atravessadores?

Hoje eu considero as empresas tradicionais da indústria do entretenimento como atravessadores modernos, talvez caixeiros-viajantes. O problema que acontece em qualquer Era é substituir um modelo já estabelecido com ruptura brusca sem uma alternativa viável para os antigos donos do dinheiro. A mesma internet que facilita novos modelos de  negócios destrói os antigos como as carroças que desapareceram ou profissões como acendedor de lampião do século 19.

Qual a solução? Até lá muitos processos acontecerão, mas defender estruturas atravessadoras como o Megaupload não é a solução.

tl;dr

Eu defendo compartilhamento e que se criem leis para  legislar os limites do que seja compartilhar, não defendo pirataria, que se prenda aqueles que desobedecem as leis. Sou anarco, não anomista.

https://twitter.com/#!/cmilfont/status/162167850633662464

O livro O Culto do Amador de Andrew Keen é um ótimo e péssimo livro dependendo da visão de quem ler, na minha opinião. Ótimo livro para entendermos como pensa uma pessoa da segunda onda sobre choque de ondas e péssimo para quem tem mentalidade de segunda onda e quer entender os fenômenos que nos assolam.

Como um defensor da Terceira Onda eu não considero certo ou errado a concepção que as pessoas tem do mundo e de eventos e ações que parecem ser erradas para elas. O problema é que essas mesmas pessoas considerem erradas a visão das outras culturas e é isso o cerne desse livro.

Quando o autor trata sobre a morte da música em dois capítulos por causa do compartilhamento, praticamente é a idéia geral em todo o livro, ele esquece que a música já existia antes da revolução industrial, modelo que ele defende e acha correto.

Se perceberem, as pessoas com mentalidade de primeira onda acham que a música morreu e foi pasteurizada após o surgimento da rev. industrial. Esse choque de culturas é natural e esperado.

O autor não considera é que a troca de arquivos ou de “músicas” não está matando a música, está matando aquilo que entendemos como indústria musical, que para ele é o formato que dá sustentação para que surjam artistas, como foi educado a compreender.

O autor não investiga os fatos que estão destruindo modelos de negócios típicos da segunda onda, ele está preocupado como mantê-los. O modelo de negócios nessa onda são baseados em Hits. Como o custo de distribuição e produção é enorme, só existem duas classes: O astro e o desconhecido não-publicado.

A nova onda permite agora, por causa da cauda longa, que pessoas antes impedidas pela limitação de recursos sejam publicadas num Lulu.com ou Youtube.

O conceito de ProAm ou Prosumidor é virulamente atacado no livro por considerar que isso vai afastar ou denigrir o trabalho profissional quando na verdade o que ocorre é que agora qualquer pessoas tem o direito – ou privilégio – de poder exercitar ou praticar determinada ação  e não que o profissional esteja impedido de exercer.

A visão de segunda onda é baseada no comando-controle e na concepção de que existem entidades ou departamentos, como governos e universidades, que controlam e decidem quem pode exercer determinado conhecimento após um processo burocrático de investigação. A idéia de que as pessoas tem liberdade de praticarem livremente e que o indivíduo tem escolhas é um desses fatores de choque que são defendidos no livro em favor da onda anterior.

A premissa de credibilidade que antes era imposta por um terceiro agente agora é dado ao indivíduo e a multidão que ele participa. Antes você tinha que ser escolhido por uma editora para publicar um livro e isso definia o conceito de sucesso per si, agora você pode simplesmente escrever o que bem entender, publicar e “ineditamente” ser comprado sem ter gasto 1 centavo em marketing. Essa concepção de valor também é criticada no livro.

Agora o que mais é sacrificado na visão do autor é o conceito de Crowdsourcing. Sabemos que uma multidão pode ser facilmente controlada, isso existe em todas as ondas e não será maior porque a credibilidade de algo é definido por essa multidão. O que investigamos é que modelos de negócios com base em Crowdsourcing vão surgir invariavelmente, quer queiramos ou não. Nada do que fizermos vai evitar, apenas – no máximo – retardar, como foram todas as ações que a primeira onda tentou nesses últimos 300 ou 400 anos.

Eu acho um livro válido para se ter em minha biblioteca para ser a antítese de outras obras e explicação de ações que surgirão e se intensificarão nos próximos anos.

Vocês já devem ter notado que estamos vivendo em um momento de transição na história da humanidade com profundas mudanças da sociedade, ao mesmo tempo e em todos os campos de conhecimento.

Proliferam-se Buzzwords como Marketing 2.0, gestão 2.0, Governo 2.0 e outras pseudas-definições em determinados campos culturais para representar as mudanças sociais que teoricamente foram influenciadas pelas melhorias das comunicações, em especial as facilidades da internet e no que se convencionou de chamar Web 2.0.

Alguns autores já tentaram descrever esses fenômenos mas não chegaram a uma explicação homogênia, um exemplo poderia citar O Mundo é Plano do jornalista Thomas L. Friedman que não conseguiu ser coeso em sua explicação e dá muitas voltas com algumas passagens confusas, apesar de coletar casos interessantes que ele identificou como sendo um fenômeno de achatamento do globo pelas facilidades das comunicações.

Talvez para compreendermos esse momento atual precisaremos de um conjunto de obras que juntas possam conseguir expor de forma clara os princípios e valores que moldam essas mudanças.

Antes de tudo temos que falar no casal Alvin e Heidi Toffler. Foram eles que formataram as bases dessa transição em suas obras, com destaque para o livro A Terceira Onda que é um aperfeiçoamento do pensamento de outra obra do casal chamada O Choque do Futuro.

No livro A Terceira Onda o casal Toffler definiu conceitos como Prosumer que explicam porque a Time elegeu “You” como a pessoa do ano em 2006. Nessa obra os autores explicam as diferenças entre essas ondas culturais e porque estamos vivendo em um momento de transição pós-industrial.

As 3 ondas são identificadas como a sociedade agricultural, industrial e revolução pós-industrial.

Primeira Onda

A primeira onda é formada por agricultura e extrativismo, vindo desde a época posterior ao neolítico, quando o homem era caçador-coletor, passando por medievalismo até a renascença.

Basicamente é uma sociedade centrada no campo e na agricultura, até pode encontrar esporadicamente obras e casos típicos das outras ondas, mas não passa de capricho ou excentricidade e não forma da cultura. A idéia aqui é sobrevivência.

A Segunda Onda

A segunda onda é baseada no industrialismo, iluminismo, na dicotomia burguesia vs proletário até meados da década de 50 do século 20 – quando os serviços ultrapassaram a indústria na geração de valor.

Antes de avançarmos na terceira onda é importante o entendimento das ondas anteriores e compreender como esse pensamento foi solidificado na cultura em geral.

A segunda onda é basicamente o período industrial e não há obra melhor para entender essa onda do que Os Magnatas. Aqui verificamos que a a revolução industrial foi impulsionado no Vale do rio Connecticut com base na intercambialidade de peças na fabricação de armas, descobrimos que o pai da administração moderna, Frederick W. Taylor, obteve sucesso profissional como engenheiro e não por suas teorias administrativas, que não passavam de pseudo-ciência.

A segunda onda foi basicamente a onda da massificação em todos os sentidos: produção, distribuição, consumação, educação, recreação, entretenimento baseado em Hits, entre outras coisas. O próprio modelo exigiu uma estrutura de comando-controle para organizar toda a infraestrutura necessária de – principalmente – atravessadores que eram necessários para fazer a máquina funcionar. Uma palavra que resume a geração é: “Burocracia”.

Essa massificação no cerne da segunda onda produziu regimes totalitários como o marxismo, fascismo, nazismo e variações como as ditaduras da América Latina, de Liberais [Chile] a conservadoras [Argentina e Brasil]. Não importa o sinal ideológico, no final todos acabam defendendo medidas semelhantes mas com propósitos diferentes.

Descobrimos em obras como Extraordinary Popular Delusions and the Madness of Crowds e The Crowd: A Study of the Popular Mind [não sei se esses livros possuem traduções] que as multidões são facilmente manipuláveis e quando o homem faz parte de um grupo deixa de raciocinar como indivíduo e passa a considerar opiniões alheias como verdadeiras por pressão social, mesmo que contradigam o que pensa.

A Terceira Onda

A terceira onda é justamente a era que vivemos com novidades como o Terceiro setor, foco em  serviços, tecnologia altamente desenvolvida, geração digital, compartilhamento sem imposição e conceito de liberdade nunca antes imaginado ou tolerado pela humanidade.

O casal Toffler, nas obras seguintes, destilam argumentos e teorias em determinados campos de conhecimento com base no pensamento da Terceira Onda, o qual aconselho lerem primeiro para estabelecer a base necessária para melhor aproveitar e entender os outros livros como Guerra e Anti-guerra, Powershift: as Mudanças do Poder, Criando uma Nova Civilização e Riqueza Revolucionária: o Significado da Riqueza no Futuro.

Avançando na Terceira Onda, analisamos que James Surowiecki em A Sabedoria das Multidões considera que há decisões sábias a partir de uma massa de pessoas quando é satisfeita a fórmula: diversidade de opinião + independência + descentralização + agregação. Essa teoria é a base de modelos como Crowdsourcing.

A massificação não é combatida na terceira onda, mas transformada em compartilhamento e identificação de nichos que era inviáveis nas ondas anteriores.

A idéia de compartilhamento na terceira onda- como visto em Wikinomics de Don Tapscott – é contrária aos princípios da segunda onda, o controle sobre os ativos da empresa não deve ser o foco dos negócios e sim extrair ativos de bens que teoricamente não estão sendo bem aproveitados. Entender que os melhores nem sempre estão dentro da sua organização e se beneficiar com o trabalho de interessados fora da empresa.

Aqui vale salientar que o compartilhamento da nova onda sofre interferência dos amadores na produção que antes era exclusividade e reconhecimento dos profissionais. Lembram do Prosumer dito no início desse artigo?

Em A Cauda Longa, Chris Anderson demonstra na economia que a Terceira Onda é a era dos nichos com o poder da massificação aliado a facilidade de comunicação, antes o que era inviável economicamente agora é possível. A segunda onda foi marcada pela cultura de Hits, ou seja, como era inviável produzir e distribuir todo mundo, apenas os melhores recebiam investimento.

O que era melhor era definido pelo filtro da indústria, esse filtro era baseado no que agradava a maioria, onde vimos em Sabedoria das Multidões que sempre é a média da massa.  Essa média poderia significar algo bom quando respeita a fórmula de decisões sábias ou algo desastroso quando saisfaz as condições como ditas por Le Bon ou Mackay.

Obras como Here Comes Everybody: The Power of Organizing Without Organizations de Clay Shirky e Free do Chris Anderson vem elucidar porque empresas como Facebook que são praticamente virtuais valem mais do que uma fábrica da Coca-cola com seus operários e coisas palpáveis, pelo menos para nós que somos “contaminados” com a visão da segunda onda.

A idéia do grátis hoje se contrapõe ao “não existe cafezinho grátis” da segunda onda por causa da distribuição. Produtos antes não interessantes agora são facilmente distriuídos e encontrados sem a necessidade de gastos com marketing e distribuição típicos da segunda onda e da cultura de Hits.

O Choque de Gerações

Os Toffler identificaram em suas obras que a geração de uma onda domina o mundo economicamente, mas não domina politicamente até que a onda se torne madura.

Verificamos que a burguesia (2ª onda) dominou o poder econômico mas não o poder político que continuou nas mãos da aristocracia (1ª onda) por muito tempo, da mesma forma que a geração digital (3ª onda) domina o poder econômico mas não o poder político que continua nas mãos da geração analógica (2ª onda) até esse momento.

Se você se sente cada vez mais não representado nas eleições, entenda que a política atual é para escolher candidatos com propostas e formas de governos preparados para a onda anterior.

O objetivo desse artigo não foi realizar um review de livros, mas identificar que a matriz tecnológica do que entendemos como Web 2.0 é consequência, e não causa, de movimentos culturais que interagem entre si moldando a sociedade.

Essa estrutura de produzir/consumir feito por todos envolve toda a concepção dessa nova onda, claro que respeitando formas de extrair cultura útil ou não. Evidente que o foco passa do grupo para o indivíduo, daquilo de que se considera algo útil ou não.

O objetivo principal para entender a nova onda que vivemos é compreender que a perspectiva não é mais do grupo e sim do indivíduo e que o choque dessas duas visões é o que molda os novos negócios.

O governo do estado inaugurou essa semana “A Conta do Paciente“, um projeto inédito no Brasil que vai informar ao paciente quanto foi sua despesa desde a entrada no hospital até sua alta. Esse tipo de atuação aproxima o governo da agilidade que a sociedade cobra em relação à transparência nas contas públicas, antes era quase impossível saber o custo real por paciente. Fora que a secretaria vai saber precisamente e em tempo real os custos por unidade, além de facilitar a tomada de decisões que podem salvar vidas.

Esse formulário detalhado com a conta do paciente é possível graças ao ERP especialista em gestão hospitalar pública da empresa Insystem, nosso cliente e parceiro. A Insytem acreditou em nosso trabalho e é um dos maiores Cases, senão o melhor.

O ERP foi construído 100% com base em TDD em Java usando DWR, Hibernate e  Spring basicamente. Alguns requisitos necessários de usabilidade utilizam Reverse Ajax com DWR. O sistema é totalmente ajax e utiliza o Extjs seguindo a filosofia model 3. Fizemos algumas customizações no Extjs para se integrar ao DWR de forma transparente.

Fomos ágeis desde o primeiro momento, mas nunca nos preocupamos em implantação de processo, metodologia ou qualquer coisa que o foco não fosse software saudável. XP foi algo natural, valores e princípios foram assimilados desde o primeiro dia, mas foi e é o software funcionando e livre de erros [o mais livre possível] que nos moveu.

Destaque para o Felipe Andrade, funcionário da Insystem que se tornou especialista em Extjs com DWR e hoje domina e é talvez o maior conhecedor da união desses Frameworks no estado.

Agradecimentos especiais aos diretores Evando Chaves e Marcelo Meirelles que investiram nessa solução e tiveram a sagacidade de sair na frente da concorrência entendendo que software funcionando é mais importante do que processos bonitos e pomposos, afinal o barco não chega na frente por causa do tambor e sim dos remadores. A Insystem está de parabéns por ter enfrentado todas as correntes contrárias e ter chegado a essa vitória investindo e apostando no fator humano como responsável para a vitória.

Esse é um Case que entrou para a história, estamos procurando outra solução semelhante na saúde pública do Brasil e até agora não encontramos nada.

Orgulhoso por participar dessa conquista.

Para suprir essa necessidade de usabilidade tivemos que adotar alguns conceitos, como ser totalmente stateless e modificar a arquitetura MVC2 para o MVC3. No server-side trabalhamos com um domain model baseado em Hibernate, Spring e Facades e Services com DWR. Nada de frameworks MVC2, não nos preocupamos com renderização e sim com a API. No lado cliente usamos Extjs com algumas modificações que fiz para integrar de forma suave com o DWR.

Primeiro precisamos entender como o Extjs trabalha com herança. Basicamente há um método no objeto Ext que faz esse trabalho de extensão dos componentes, funciona da seguinte maneira:

//Formato:
var NovoComponente = Ext.extend(velhoComponente, { 
          /* metodos e propriedades que serão reescritas */ 
});
 
//Exemplo:
var MilfontGridPanel = Ext.extend(Ext.grid.GridPanel, {
        //novo construtor
        constructor: function(config) {
            // Seu preprocessamento vai aqui
        	MilfontGridPanel.superclass.constructor.apply(this, arguments);
            // Seu pos-processamento vai aqui
        },
 
        NovoMethod: function() {
            // algum novo método que você queira criar para o novo componente
        }
    });

Para esse projeto, criei um Ext.data.DataProxy (como visto no artigo passado) especialista para o DWR, criativamente denominado DWRProxy. A idéia é modificar o comportamento de buscar os dados para usar um Creator do DWR.

Definimos primeiro o objeto e suas propriedades necessárias:

Ext.ux.data.DWRProxy = function(dwr_facade, dwr_filter, dwr_errorHandler){
 
    Ext.ux.data.DWRProxy.superclass.constructor.call(this);
 
	/* Propriedade que receberá a classe Java configurada como Creator */
    this.data = dwr_facade;
    /*
	 * Propriedade que receberá uma classe java configurada como converter
	 * que servirá como filtro de busca
	 */
 
	this.dwr_filter = dwr_filter;
 
	/**
	 *
	 * Propriedade para fazer paginação, indica que deve cachear a consulta de
	 * total de elementos o controlador [fachada] deve implementar a logica de
	 * negocios adequada, quando for false consulta o total, quando for true
	 * consulta apenas a listagem e repete o total
	 */
 
	this.dwr_total_cache = false;
 
	this.dwr_errorHandler = dwr_errorHandler;
 
};

Após isso extendemos do Ext.data.DataProxy :

Ext.extend(Ext.ux.data.DWRProxy, Ext.data.DataProxy, {
 
    /**
     * Método Load do Ext.data.DataProxy overrided
     */
 
    load : function(params, reader, callback, scope, arg) {
 
	/**
	 * Escopo "this" mapeado para a variável "s" porque dentro do callback do
	 * DWR o escopo "this" não pertence ao objeto Ext.ux.data.DWRProxy.
	 */
 
	var s = this;
 
        params = params || {};
 
        if(params.cache != undefined) {
		this.dwr_total_cache = params.cache;
	}
 
	if(params.filter != undefined) {
		this.dwr_filter = params.filter;
	}
 
        var result;
 
        try {
		this.data(this.dwr_filter, params.start, params.limit, this.dwr_total_cache, {
			callback:function(response) {
                                //aqui passamos o retorno do DWR 
                               // que chamei de response,  para o extjs
				result = reader.readRecords(response);
				callback.call(scope, result, arg, true);
			},
			errorHandler:function(a, e) {
				scope.fireEvent("loadexception", s, arg, null, e);
				s.dwr_errorHandler(a);
			},
			timeout:100000
		});
 
		this.dwr_total_cache = true;
 
        } catch(e) {
            this.fireEvent("loadexception", this, arg, null, e);
            callback.call(scope, null, arg, false);
            return;
        }
 
    }
 
});

A fachada DWR é uma classe comum, segue um exemplo de uso com Hibernate:

//classe para satisfazer o transporte para o Extjs
public final class DataTransferObject {
    private int total;
    private List<? extends Object> results;
    //sets e gets
}
 
public class AjaxFacade {
    //injeta um repositorio, whatever
    private Repository repository = null;
 
    public DataTransferObject find(Object filter, int start, int limit, boolean cache, HttpSession session) {
        DataTransferObject dto = new DataTransferObject();
        //verifica se o Proxy está passando true 
        // indicando que está paginando
        if (cache) {
            Integer total = (Integer) session.getAttribute("totalObject");
            dto.setTotal(total);
       } else {
            session.removeAttribute("totalObject");
            Integer total = repository.count(filter);
            dto.setTotal(total);
            session.setAttribute("totalObject", total);
        }
        List<Object> retorno = (List<Object>) repository.find(filter, start, limit);
        dto.setResults(retorno);
        return dto;
    }

Para o Grid visto no artigo passado, basta instanciar assim no javscript:

var store = new Ext.data.Store({
    proxy: new Ext.ux.data.DWRProxy(
        AjaxFacade.find, 
        {$dwrClassName:"Project"}, 
        errorHandler
    ),
    reader: new Ext.data.JsonReader({
            root: 'results',totalProperty: 'total',id: 'id'
        }, 
        ['id', 'name', 'manager.name', 'manager.address.country']
    )
});

Para entender o {$dwrClassName:”Project”} visite esse post.

Dessa forma o DWR se torna um proxy para todos os componentes do Extjs.

Código fonte da modificação do javascript eu coloquei aqui no github e uma aplicação demo aqui. No próximo vou integrar o DWR com o Rails, aguardem que sai logo… ou não.

Esse tutorial tem o objetivo de preparar o conhecimento para outros posts que estou escrevendo e achei necessário uma introdução apenas nos conceitos do Extjs para não confundir com as tecnologias que uso em conjunto como DWR ou no modelo REST com o RubyOnRails.

O Extjs é um framework javascript de propósito geral, ou seja, tem um conjunto de funcionalidades que tratam Ajax, um conjunto de Widgets bem elaborados [componentes visuais como Grid e TabPanel], manipulação de DOM [Document Object Model] e BOM [Browser Object Model], tratamento de eventos, animações como Fade In e Fade Out, parser de JSON, entre outras coisas. Seus componentes são construídos com técnicas modernas de orientação a objetos no javascript e manipulação de Scripttag para recursos remotos que não suportam Ajax.

Preparação

Após baixar e descompactar o framework [estou trabalhando na versão 2.x que é estável nessa data], recomendo que deixa a disposição das pastas conforme se encontra e coloque no seu projeto de forma que seja acessível via web, já vem com documentação e exemplos que você deve e vai usar durante o desenvolvimento. Temos a opção de montar o Extjs [marcando a opção "Make build available via CacheFly" ] no CacheFly como um servidor CDN para otimizar o tráfego de sua aplicação principalmente se ela será disponibilizada na internet e não apenas na intranet.

É necessário importar o CSS global, o adapter e o Javascript global conforme mostrado abaixo:

<link rel="stylesheet" type="text/css" href="/javascripts/ext-2.2.1/resources/css/ext-all.css" />
<script src="/javascripts/ext-2.2.1/adapter/ext/ext-base.js" type="text/javascript"></script>
<script src="/javascripts/ext-2.2.1/ext-all.js" type="text/javascript"></script>

Pode usar outros temas para o Extjs, estarão na pasta “resources/css“, assim como podemos internacionalizar os componentes com arquivos que se encontram em “build/locale“. Exemplo com o tema “Gray” e i18n em português do Brasil:

<link rel="stylesheet" type="text/css" href="/javascripts/ext-2.2.1/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="/javascripts/ext-2.2.1/resources/css/xtheme-gray.css">
<script type="text/javascript" src="/javascripts/ext-2.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/javascripts/ext-2.2.1/ext-all.js"></script>
<script type="text/javascript" src="/javascripts/ext-2.2.1/build/locale/ext-lang-pt_BR-min.js"></script>

Internacionalização é algo pensado no Extjs de forma a facilitar a criação de arquivos de linguagem aproveitando a estrutura da linguagem [dinâmica e fracamente tipada], todas as propriedades de mensagens e textos são públicas para facilitar a reescrita como mostrado abaixo na i18n do componente de DataPicker:

if(Ext.DatePicker){
   Ext.apply(Ext.DatePicker.prototype, {
      todayText         : "Hoje",
      minText           : "Esta data é anterior a menor data",
      maxText           : "Esta data é posterior a maior data",
      disabledDaysText  : "",
      disabledDatesText : "",
      monthNames        : Date.monthNames,
      dayNames          : Date.dayNames,
      nextText          : 'Próximo Mês (Control+Direita)',
      prevText          : 'Mês Anterior (Control+Esquerda)',
      monthYearText     : 'Escolha um Mês (Control+Cima/Baixo para mover entre os anos)',
      todayTip          : "{0} (Espaço)",
      format            : "d/m/Y",
      okText            : " OK ",
      cancelText        : "Cancelar",
      startDay          : 0
   });
}

Se você usar o CacheFly gerado pela página do Extjs, ele incluir o adapter e o global em um mesmo arquivo, vai ser algo como:

<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/ext-all.css">
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/xtheme-gray.css">
<script type="text/javascript" src="http://extjs.cachefly.net/builds/ext-cdn-771.js"></script>

Adapter

Quando o Extjs passou a ser um framework independente do YUI, passou a adotar outros frameworks como base para funções básicas de manipulação de DOM e Ajax, hoje suporta trabalhar em conjunto com YUI, JQuery, Prototype e totalmente independente. Se o projeto já tem Jquery ou outro framework que trabalha com o Extjs, a utilização dos dois é muito fácil e indicada, principalmente para usar os widgets que são provavelmente os mais poderosos hoje em dia em um framework opensource.

//Exemplos de adapters permitidos
<script type="text/javascript" src="/javascripts/ext-2.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/javascripts/ext-2.2.1/adapter/jquery/ext-jquery-adapter.js"></script>

Widgets

O principal apelo do Extjs que conquista os desenvolvedores é o layout bem trabalhado dos componentes visuais que são de fácil parametrização. Basicamente todos os componentes funcionam da mesma forma, você o instancia passando um objeto literal de configuração com mostrado abaixo:

//Exemplo do grid
var grid  = new Ext.grid.GridPanel({
autoShow:true, width:750,height:250 //mais parametros 
});
//Exemplo de uma Window
var window = new Ext.Window({
autoShow:true, width:750,height:250 //mais parametros 
});
//Exemplo de um Painel
var panel = new Ext.Panel({
autoShow:true, width:750,height:250 //mais parametros 
});

Vamos usar o GRID para exemplificar como trabalhamos com o Extjs, o mesmo comportamente se repete em todos os componentes.
A documentação do Extjs é muito bem feita e praticamente vai ser a única coisa que você vai precisar depois de entender como os componentes são formados, afinal não vale a pena decorar todas as propriedades de todos os componentes, concentre-se apenas em entender os conceitos.

A GRID é o Widget mais famoso desse framework e é formado basicamente por um objeto “Ext.data.Store” [que é a fonte de dados da GRID] e um objeto “Ext.grid.ColumnModel” [que é a definição das colunas], como mostrado abaixo:

var grid  = new Ext.grid.GridPanel({
    autoShow:true, width:750,height:250, //parametros de configuração de layout
    cm: new Ext.grid.ColumnModel({/*configuração*/}),
    store: new Ext.data.Store({}), //Ou especialização de um Store
    sm: new Ext.grid.RowSelectionModel({singleSelect:true}), //ou outra especialização de um AbstractSelectionModel
});

O objeto ColumnModel é a definição de colunas do Grid, possui propriedades para definição de layout como largura e altura, título da coluna como vai ser exibida e formatação do texto:

var colModel = new Ext.grid.ColumnModel([
    { header: "Ticker", width: 60, sortable: true},
    { header: "Company Name", width: 150, sortable: true},
    { header: "Market Cap.", width: 100, sortable: true},
    { header: "$ Sales", width: 100, sortable: true, renderer: money},
    { header: "Employees", width: 100, sortable: true, resizable: false}
 ]);

A propriedade cm [ColumnModel] pode ser também substituída pela propriedade “columns” que funciona como um “alias”, dessa forma o Grid cria automaticamente um objeto ColumnModel:

var grid = new Ext.grid.GridPanel({
    columns: [
        {id:'id', header: "id", width: 200, sortable: true, dataIndex: 'id'},
        {header: "Nome", width: 120, sortable: true, dataIndex: 'name'}
    ]
});

Caso haja necessidade de formatar o conteúdo da célula, você pode usar uma função como “renderer” para tratar esse conteúdo:

var grid = new Ext.grid.GridPanel({
    columns: [
        {id:'id', header: "id", width: 200, sortable: true, dataIndex: 'id'},
        {header: "Nome", width: 120, sortable: true, dataIndex: 'name'},
        {header: "Criado em", width: 135, sortable: true, renderer: function(value) {
                    return Date.parseDate(value, 'Y-m-d\\TH:i:s\\Z').format('d/m/Y H:i:s');
                    //2009-06-14T12:51:07Z
        }, dataIndex: 'created_at'}
    ]
});

A propriedade “store” da GRID é uma especialização do componente “Ext.data.Store” que é formado basicamente por um “proxy” e um “reader“:

var store = new Ext.data.Store({
    proxy: new Ext.data.DataProxy(), //ou uma especialização
    reader: new Ext.data.DataReader() //ou uma especialização
});

O “proxy” é o componente que obterá os dados e o “reader” o componente que fará a leitura desses dados para um formato comum a todos os componentes do Extjs na forma de um objeto denominado “Ext.data.Record“. O objeto “Record” representa um registro de dados e é usado seja para GRID, para um Form ou qualquer componente que trabalhe com dados editáveis.

Dessa forma podemos usar uma combinação de Proxy e Reader como HttpProxy e JsonReader:

var store = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({
        url: 'projects.json'
    }),
    reader: new Ext.data.JsonReader({
        totalProperty:'total',
        root:'results',id:'id'
    }, Ext.data.Record.create([
        {name:'id', mapping:'id'},
        {name:'name', mapping:'name'},
        {name:'created_at', mapping:'created_at'},
        {name:'updated_at', mapping:'updated_at'}
    ]))
});

Devido o costume do uso do HttpProxy, o componente Store possui uma propriedade chamada “url” que estando presente cria um HttpProxy automaticamente como mostrado abaixo:

var store = new Ext.data.Store({
    url: 'projects.json',
    reader: new Ext.data.JsonReader({
        totalProperty:'total',
        root:'results',id:'id'
    }, Ext.data.Record.create([
        {name:'id', mapping:'id'},
        {name:'name', mapping:'name'},
        {name:'created_at', mapping:'created_at'},
        {name:'updated_at', mapping:'updated_at'}
    ]))
});

O objeto “Reader” é o único que foge um pouco a regra de instanciação por receber dois parâmetros, um similar aos outros com um objeto literal de configuração e outro com o mapeamento dos dados. O objeto de configuração tem duas propriedades de que representam o total e a lista de dados. O objeto de mapeamento usa um método “estático” do objeto Record para criar um link entre a propriedade do json [com a propriedade "mapping"] e o índice interno do Record [pela propriedade "name"].

 new Ext.data.JsonReader({
        totalProperty:'total',
        root:'results',id:'id'
    }, Ext.data.Record.create([
        {name:'id', mapping:'id'},
        {name:'name', mapping:'name'},
        {name:'created_at', mapping:'created_at'},
        {name:'updated_at', mapping:'updated_at'}
    ]))

Dessa forma você tem um link entre o ColumnName pela propriedade dataIndex e o Store por meio do Reader, como abaixo:

Ext.data.Record.create([
         {name:'nome_linkado', mapping:'name'}
    ])
//
 columns: [
        {header: "Nome", width: 120, sortable: true, dataIndex: 'nome_linkado'}
    ]

Para melhorar a navegação da GRID, você pode também acrescentar um componente de Toolbar no header ou no footer:

var grid  = new Ext.grid.GridPanel({
    autoShow:true, width:750,height:250, //parametros de configuração de layout
    cm: new Ext.grid.ColumnModel({/*configuração*/}),
    store: new Ext.data.Store({}), //Ou especialização de um Store
    sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
    bbar: new Ext.Toolbar(), //Bottom Toolbar
    tbar: new Ext.Toolbar() //Top Toolbar
});

A Toolbar mais usada é sua especialização com paginação, a Ext.PagingToolbar que necessita ser linkada com o Store:

new Ext.PagingToolbar({
    pageSize:10, //propriedade opcional, default é 20
    store: store
})

A PagingToolbar é I18n, mas se as mensagens não agradarem você pode mudá-las [eu sempre faço]:

new Ext.PagingToolbar({
    pageSize:10,store: store,
    displayInfo: true,	
    displayMsg: 'Exibindo o resultado: {0} a {1} de {2} registros',
    emptyMsg: "Sem resultados a exibir"
})

Uma coisa bacana nesse componente é que você pode agrupar botões [já que é uma Toolbar] e até padronizar o layout:

new Ext.PagingToolbar({
    pageSize:10,store: store,
    displayInfo: true,	
    displayMsg: 'Exibindo o resultado: {0} a {1} de {2} registros',
    emptyMsg: "Sem resultados a exibir",
    items: ['-', {
        pressed: true,enableToggle: true,text: 'Alterar',
        toggleHandler: function(){}
    }, {
        pressed: true,enableToggle: true,text: 'Excluir',
        toggleHandler: function(){}
	}]
})

Código da GRID inteira:

 
var store = new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({
        url: 'projects.json'
    }),
    reader: new Ext.data.JsonReader({
        totalProperty:'total',
        root:'results',id:'id'
    }, Ext.data.Record.create([
        {name:'id', mapping:'id'},
        {name:'name', mapping:'name'},
        {name:'created_at', mapping:'created_at'},
        {name:'updated_at', mapping:'updated_at'}
    ]))
});
 
var colModel = new Ext.grid.ColumnModel([
    {id:'id', header: "id", width: 200, sortable: true, dataIndex: 'id'},
    {header: "Nome", width: 120, sortable: true, dataIndex: 'name'},
    {header: "Criado em", width: 135, sortable: true, 
        renderer: function(value) {
          return Date.parseDate(value, 'Y-m-d\\TH:i:s\\Z').format('d/m/Y H:i:s');
 
    }, dataIndex: 'created_at'}
 ]);
 
var pagingToolbar = new Ext.PagingToolbar({
    pageSize:10,store: store,
    displayInfo: true,	
    displayMsg: 'Exibindo o resultado: {0} a {1} de {2} registros',
    emptyMsg: "Sem resultados a exibir",
    items: ['-', {
        pressed: true,enableToggle: true,text: 'Alterar',
        toggleHandler: function(){}
    }, {
        pressed: true,enableToggle: true,text: 'Excluir',
        toggleHandler: function(){}
	}]
});
 
var grid  = new Ext.grid.GridPanel({
    autoShow:true, width:750,height:250,
    cm: colModel,
    store: store,
    sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
    bbar: pagingToolbar
});

Como eu falei, todos os componentes possuem o mesmo comportamento, notaram que dá para aproveitar esse código semelhante e reaproveitar em todos os CRUDs?
Vou falando de um por um de acordo com os posts que forem saindo, aguardem que o próximo sai logo… ou não.

O resultado disso foi a catalogação de todos os buracos no Google Maps [como Mashup da ação], um dos problemas e o mais sério que já causou até capotamento de carro e quebrou o próprio carro oficial da prefeita. Crateras são algo comum em Fortaleza.

Os problemas estão piorando com as fortes chuvas que castigam Fortaleza. Há uma cratera na avenida Leste-Oeste que a prefeitura já fechou várias vezes e vários carros já caírem nela, vide imagem abaixo que capturei na terça-feira quando um caminhão ficou com a roda presa e praticamente parou o trânsito.

Em poucas horas que iniciamos a campanha #buracosfortaleza no twitter, os jornais locais deram a notícia da campanha em seus portais, como OPOVO, Jangadeiro [1], Jangadeiro [2] e Diario do Nordeste.

O Emilio Moreno está fazendo uma cobertura completa da campanha que tenta sensibilizar todo mundo para esse sério problema.

[update 05/05/2009]

Rafael Carneiro postou sobre a campanha.

Mário Aragão postou sobre a campanha.

Natanael Pantoja postou sobre a campanha.

[/update]

Programação

• 09:00 – Como participar das comunidades de software livre? – Comunidades
• 10:00 – Desenvolvimento de aplicações sociais com a OpenSocial – Christiano Milfont
• 11:00 – Desenvolvimento de aplicações web com Ruby on Rails – Coutinho Costa

Data: 21 de Março de 2009
Local: Faculdade Lourenço Filho – Rua Barão do Rio Branco, 2101 Centro

Para saber mais: Debian-ce

Nota no BR-Linux

Fotos

Album do JavaRN
Album do Handerson Frota