ensandecer de um computólogo » Programação http://danielmartins.eti.br/blog return 1; Thu, 15 Dec 2011 05:05:07 +0000 en hourly 1 http://wordpress.org/?v=3.3 Bossa Conference ’10 – em Manaus http://danielmartins.eti.br/blog/2010/03/02/bossa-conference-10-em-manaus/ http://danielmartins.eti.br/blog/2010/03/02/bossa-conference-10-em-manaus/#comments Tue, 02 Mar 2010 14:47:36 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=573 Faz algum tempo que estou querendo escrever vários posts técnicos e da minha viagem a sampa que fiz em janeiro, mas realmente o tempo está escasso. Mas não podia deixar passar em branco a divulgação do Bossa Conference que é um evento que sempre tive vontade de participar e que era realizado em Porto de Galinhas. Esse ano o Bossa Conference ’10 será realizado em Manaus – Amazonas. Uma chance dos nerds nortistas poderem participar até onde sabemos deste excelente evento.

]]> http://danielmartins.eti.br/blog/2010/03/02/bossa-conference-10-em-manaus/feed/ 2 Flisol – Manaus – Amazonas http://danielmartins.eti.br/blog/2009/04/27/flisol-manaus-amazonas/ http://danielmartins.eti.br/blog/2009/04/27/flisol-manaus-amazonas/#comments Mon, 27 Apr 2009 13:46:49 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=390 flisol-manaus-logoO flisol em manaus foi um sucesso na minha opnião, graças ao comprometimento dos “pigs” da comunidade de software livre em manaus, pessoas como Antônio Junior, Davyd Smelk, Marcelo Mendes entre outros e a estes pigs deixo aqui postado meus parabéns. houve uma quantidade razoável de participantes, todas as palestras estavam cheias e as oficinas foram também bastante frequentadas.

Tirei algumas fotos do evento apartir do meu E71, a câmera não é boa mas como estava de dia até que as fotos ficaram boas. Segue abaixo algumas fotos.

Oficina de D-Bus

A foto acima é da oficina de D-Bus.

25/04/2009

Coordenação do Flisol indo almoçar.

Mais fotos no meu flickr.

Também não pude deixar de contribuir e fiz uma palestra sobre Python com EFL e ajudei em algumas oficinas. Como prometi na minha palestra que iria postar a minha apresentação no blog, cá estou eu postando.

Slides Python e EFl

Segue abaixo os códigos que fiz de exemplo, mas faltou tempo para comentar linha a linha. Para quem quiser estudar segue código.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
#!/usr/bin/env python2.5
# -*- coding: utf-8 -*-
# Copyleft
#
# @author: Daniel Martins

import ecore
from ecore.evas import SoftwareX11
import evas
import edje

X_DIRECTION, Y_DIRECTION = range(2)


w, h = 800, 480
ee = ecore.evas.SoftwareX11(w=w, h=h)
canvas = ee.evas

states = 0
anime = False
anime_max = 0


bg = canvas.Rectangle(color=(255, 255, 255, 255), size=ee.size)
bg.show()


def change_object(o, e):
    global w, h, states, anime_max
    im_w, im_h = o.image_size
    if states == 0:
        o.pos_set(w-im_w, 0)
    elif states == 1:
        (x, y) = o.pos_get()
        o.pos_set(x, h-im_h)
    elif states == 2:
        (x, y) = o.pos_get()
        o.pos_set(0, y)
    elif states == 3:
        (x, y) = o.pos_get()
        o.pos_set(0, 0)
        states = 0
        return
    states += 1
   


ball_object = canvas.Image(file="Generic_football.png", geometry=(0, 0, 66, 65))
im_w, im_h = ball_object.image_size
ball_object.fill_set(0,0, im_w, im_h)
ball_object.on_mouse_up_add(change_object)
ball_object.show()


# Load and setup UI
ee.title = "Exemplo de Python EFL"


ee.show()
ecore.main_loop_begin()

Exemplo animado:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
#!/usr/bin/env python2.5
# -*- coding: utf-8 -*-
# Copyleft
#
# @author: Daniel Martins


import ecore
from ecore.evas import SoftwareX11
import evas
import edje

X_DIRECTION, X_DIRECTION_NEGATIVE, Y_DIRECTION, Y_DIRECTION_NEGATIVE = range(4)


w, h = 800, 480
ee = ecore.evas.SoftwareX11(w=w, h=h)
canvas = ee.evas

states = 0
anime = False
anime_max = 0


bg = canvas.Rectangle(color=(255, 255, 255, 255), size=ee.size)
bg.show()

def anime_ball(img_obj, direction):
    global anime_max
    (x,y) = img_obj.pos_get()    
    if direction == X_DIRECTION:
        img_obj.pos_set(x+5,y)
        img_obj.pass_events_set(True)
        if x > anime_max:
            img_obj.pass_events_set(False)
            return False
    if direction == X_DIRECTION_NEGATIVE:
        img_obj.pos_set(x-5,y)
        img_obj.pass_events_set(True)
        if x < anime_max:
            img_obj.pass_events_set(False)
            return False
    elif direction == Y_DIRECTION:
        img_obj.pos_set(x,y+5)
        img_obj.pass_events_set(True)
        if y > anime_max:
            img_obj.pass_events_set(False)
            return False
    elif direction == Y_DIRECTION_NEGATIVE:
        img_obj.pos_set(x,y-5)
        img_obj.pass_events_set(True)
        if y < anime_max:
            img_obj.pass_events_set(False)
            return False
    return True
     


def change_object(o, e):
    global w, h, states, anime_max
    im_w, im_h = o.image_size
    if states == 0:
        anime_max = w-im_w
        ecore.animator_add(anime_ball, o, X_DIRECTION)
    elif states == 1:
        anime_max = h-im_h
        ecore.animator_add(anime_ball, o, Y_DIRECTION)
    elif states == 2:
        anime_max = 0
        ecore.animator_add(anime_ball, o, X_DIRECTION_NEGATIVE)
    elif states == 3:
        anime_max = 0
        ecore.animator_add(anime_ball, o, Y_DIRECTION_NEGATIVE)
        states = 0
        return
    states += 1


ball_object = canvas.Image(file="Generic_football.png", geometry=(0, 0, 66, 65))
im_w, im_h = ball_object.image_size
ball_object.fill_set(0,0, im_w, im_h)
ball_object.on_mouse_up_add(change_object)
ball_object.show()


# Load and setup UI
ee.title = "Exemplo de Python EFL Animado"

ee.show()
ecore.main_loop_begin()

Link para baixar tudo, inclusive a imagem. Só não esqueça que para executar é preciso ter instalado as EFL e os python bindings.Para a instalação tenho um post sobre. Confira.

Espero que tenham gostado do evento tanto quanto eu gostei. Qualquer dúvida, crítica e/ou sugestão pode colocar nos comentários.

Até a próxima.

]]> http://danielmartins.eti.br/blog/2009/04/27/flisol-manaus-amazonas/feed/ 3 Instalando o lazarus no ubuntu 8.10 http://danielmartins.eti.br/blog/2008/12/30/instalando-o-lazarus-no-ubuntu-810/ http://danielmartins.eti.br/blog/2008/12/30/instalando-o-lazarus-no-ubuntu-810/#comments Tue, 30 Dec 2008 22:29:27 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=348 Instalando o lazarus no ubuntu 8.10

O lazarus é um IDE RAD Delphi-like cross platform…mas traduzindo para português não-técnico, é um ambiente  de desenvolvimento, provendo ferramentas para desenvolvimento de aplicações de forma rápida, com características de uso semelhantes ao do Delphi, da Code Gear, onde o mesmo código feito no Windows pode ser compilado e executado no Linux e no Mac.

Ainda não entendeu? Dê uma volta no Google J

Você pode achá-lo no site http://www.lazarus.freepascal.org/

Por baixo do lázarus tem o FPC – free pascal compiler. É ele que faz a compilação do código que você monta pelo lazarus. Para que tudo funcione corretamente, é necessário baixar ambos separadamente.

Abaixo os passos para a instalação no Ubuntu 8.10 (Intrepid) e 9.04 (Jaunty):

# de praxe

$ sudo apt-get update

# instalando o free pascal compiler

$ sudo apt-get install fpc

# agora, o IDE

$ sudo apt-get install lazarus

Após tudo instalado, automagicamente é instalado o atalho no menu desenvolvimento, mas são necessários alguns ajustes no lázarus

Execute o lázarus.

Menu Environment -> environment options : guia files

Compiler path: /usr/lib/fpc/2.2.0/ppc386

FPC source directory: /usr/share/fpcsrc/2.2.0/

obs: os sources do FPC são necessários para compilação

Agora é só alegria. Tenham um bom divertimento.

Escrito por Lúcio Ferreira.

]]> http://danielmartins.eti.br/blog/2008/12/30/instalando-o-lazarus-no-ubuntu-810/feed/ 4 Estudando python EFL – edição especial :-P http://danielmartins.eti.br/blog/2008/12/16/estudando-python-efl-edicao-especial-p/ http://danielmartins.eti.br/blog/2008/12/16/estudando-python-efl-edicao-especial-p/#comments Tue, 16 Dec 2008 05:06:38 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=333 Bom, irei participar de um treinamento de python EFL onde o instrutor será o Gustavo Barbiery, tentarei fazer um resumo do curso até mesmo para que me sirva de referência futura e postarei aqui no blog, tenho conhecidos que trabalham e estudam também EFL e python e que ficaram tristes por não poderem participar do treinamento, infelizmente não é possível que todos participem. Mas como sou um cara legal e sempre gostei de compartilhar conhecimento :-) , além de fazer o resumo do curso que conterá muito código de exemplo. Irei também reportar a evolução do curso pelo meu Twitter em tempo real. Para isso instalei um widget no sidebar do wordpress, o qual vocês podem acompanhar ao seu lado direito da tela.

Para quem tem twitter, pode me seguir e fazer perguntas sobre a tecnologia em tempo real, para quem não tiver, pode deixar comentário no blog pois ficarei o tempo todo on line. Não atenderei todas as perguntas, irei filtrar as mais interessantes, portanto caprichem nas perguntas (se houver) que na primeira oportunidade que surgir perguntarei ao Gustavo e postarei no resumo do blog a resposta, sei que muitas das minhas dúvidas são as dúvidas de outros que começaram a trabalhar com EFL a pouco tempo, portanto muita coisa será respondida no resumo que farei do curso e não de forma imediata.

Qualquer coisa, seja sugestão ou crítica comenta ai. :-)

Update: Posts só sairão, no final de semana. Tá cruel, muita coisa pra fazer/estudar. :-|

]]> http://danielmartins.eti.br/blog/2008/12/16/estudando-python-efl-edicao-especial-p/feed/ 3 Estudando python EFL – parte 2 http://danielmartins.eti.br/blog/2008/12/13/estudando-python-efl-parte-2/ http://danielmartins.eti.br/blog/2008/12/13/estudando-python-efl-parte-2/#comments Sat, 13 Dec 2008 19:37:03 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=303 Continuando a série de post sobre a tecnologia EFL , a qual estou estudando e trabalhando.

Este post visa ser uma visão geral do que é e como funciona esta tecnologia e está respectivamente divido em duas seções: O que é ? e Como Funciona ?.

O que é ?

EFL é um conjunto de bibliotecas escrita em C para facilitar o desenvolvimento de um gerenciador de janelas baseado no X, o famoso Enlightenment, o qual possui muitos recursos eye candy sem precisar de gerenciadores de janela com suporte a aceleração através de OpenGL, ex: compiz. E sempre fez um ótimo trabalho sem esse tipo de recurso.

Segui alguns vídeos coletados no youtube do Enlightenment em ação.

E existem outros mais. É possível implementar funcionalidades muito parecidas com as do iphone, por exemplo:

E olha um teclado virtual feito com EFL baseado no teclado do iPhone, feito pelo Gustavo Barbiery, um dos geeks que trabalha com EFL aqui no Brasil e que por sinal próxima semana estará em Manaus para dar um treinamento de EFL na FPF¸após eu ter tido muitas conversas com o chefinho. :-)

E como o EFL faz muito com pouco processamento, foi portado para outras arquiteturas como ARM, onde roda em dispositivos como o Internet Tablet N810 da Nokia e existem algumas aplicações rodando com EFL, mas a aplicação de referência de uso do EFL no Maemo é o Canola, que é um player para o maemo. Alguns vídeos do canola em ação:

E roda também em celulares, e já está sendo feito uma plataforma completa para dispositivos móveis, o Illumine, e um dos geeks é um dos criadores do EFL, o Rasterman (Carsten Haitzler) e olhem só sua gang que já roda illumine:

Rasterman Gangs

Rasterman Gang's

E tudo isso e muito mais foi desenvolvido primariamente com EFL, Ficou afim de entender melhor e começar a desenvolver ? Bom…. posso guiá-lo pelo caminho que percorri no estudo. :-)

Como funciona ?

Já que na primeira parte instalamos as técnologias básicas(ecore, evas, edje), vamos dá uma olhada em seu funcionamento.

Bem, vamos começar pelo começo. :-)

Arquitetura completa do EFL.

Concentre-se na parte azul da arquitetura, o core EFL.

Evas é o canvas onde tudo é renderizado e também gera sinais para aplicação.

Ecore é o responsável por capturar todos os eventos de uma janela originados do X11 e direcionar esses eventos para os devidos callbacks, possui também um mecanismo de MainLoop e uma série de ferramentas que auxiliam o trabalho com EFL e tarefas comuns de programação.

Alguns componentes do Ecore:

  • Ecore_Con – Comunicação em rede
  • Ecore_IPC – Comunicação entre processos
  • Ecore_Config – Sistema de configuração
  • e outros.

Edje é um meio de separar o código da aplicação do código da interface, basicamente é o responsável por te prover o mecanismo de manipulação de objetos da interface, ou seja, manipular o canvas(evas) de forma descritiva e orientada a estados. Apartir do momento que você faz essa separação ou dividi a aplicação em camadas, você imediatamente ganha vantagens, como por exemplo no Enlightenment e no canola a interface é feita com Edje e por isso possui um mecanismo de Temas(Themes) avançado e flexível de temas, ou seja, você pode mudar toda a interface sem mexer no código da aplicação.

Fazendo uma analogia a arquitetura de desenvolvimento web, seria mais ou menos assim, olhe a figura do MVC abaixo

modelviewcontrollerdiagramSabemos que no desenvolvimento web, o Model é responsável pela lógica de negócio da aplicação, o Controller é responsável por capturar as requisições que vem da View e processa-lás junto a Model e então devolver a resposta a View, a View é a camada de apresentação que no contexto web é o html/css/javascript.

Olhando essa arquitetura MVC podemos fazer a seguinte analogia, que o View é o Edje, o Controller é o Ecore. E o Evas é o browser onde tudo é renderizado. :-)

Consegui explicar alguma coisa ? Se não,  deixe um comentário.

Falei alguma besteira ? Se sim, deixe um comentário corrigindo e colocarei os devidos créditos.

Próximos posts (Aguardem):

Estudando python EFL – parte 3 (Ecore-Evas)

Estudando python EFL – parte 4 (Edje)

]]> http://danielmartins.eti.br/blog/2008/12/13/estudando-python-efl-parte-2/feed/ 1 Lançamento do grupo Web2.0 Manaus com Harald Kirschner http://danielmartins.eti.br/blog/2008/09/15/lancamento-do-grupo-web20-manaus-com-harald-kirschner/ http://danielmartins.eti.br/blog/2008/09/15/lancamento-do-grupo-web20-manaus-com-harald-kirschner/#comments Mon, 15 Sep 2008 15:21:38 +0000 Daniel Elias http://danielmartins.eti.br/blog/?p=208 Na sexta (12/09/08) foi o lançamento do grupo Web2.0 Manaus com o apoio do INdT e contou com um desenvolvedor do core do mootools falando sobre web2.0 e mostrando casos de uso do mootools.

O Evento ocorreu no auditório da UniLasalle de manaus e contou com auditório cheio, eu inclusive que cheguei 15 minutos atrasado tive que sentar no chão :-) .

Bom, o evento foi composto por 2 palestras:

  • Palestra 1:
    • WEB 2.0 Oportunidades, e novas tendências. Álvaro Mota Gonçalves, INdT
    • Open-WEB. Harald Kirschner, WEB 2.0 developer and co-developer Mootools project
  • Palestra 2
    • WEB 2.0 v Overview de Tecnologias WEB 2.0. Harald Kirschner, front-end web developer specialist, core developer of MooTools project

O Álvaro Mota Gonçalves começou falando da estratégia da Nokia que mudou, e agora tem um foco mais aberto para o provimento de serviços web e levar a mesma experiência encontrada no uso de serviços web no pc com browser só que através do celular de forma móvel(mobile), o que é uma tendência hoje em dia de fato. Uma tecnologia que corresponde a este incentivo da Nokia para com a melhor experiencia de serviços web no celular é o WebRunTime(WRT). No quesito provimento de serviços a gente pode ver a investida da Nokia com o lançamento do Ovi.

Foi dito também que o mercado de trabalho estão a procura por profissionais de desenvolvimento web2.0, não lembro qual foi o site que o Álvaro mostrou onde ele fez uma pesquisa e retornou mais de 2000 empregos em aberto para se trabalhar com web2.0, ou seja, oportunidade.

A palestra mais esperada(pelo menos por mim), era a do Harald a qual pode ser encontrada aqui , achei que ele iria se aprofundar mais na explicação de web2.0 falando sobre microformats, WRT e outros conceitos e tecnologias que ainda não parei para estudar, mais o foco da palestra dele era falar de web2.0 para pessoas que não sabiam ou sabiam pouco o que é web2.0.

O Harald falou um pouco desse “compra-compra” que vemos hoje em dia de grandes empresas comprando as menores que oferecem algum serviço interessante, e ele até comentou “Quer ficar milhionário ? É só fazer um serviço inovador e publicar na web..” e logo depois complementou “só não é tão fácil fazer um..” :-) . Um fato que me chamou atenção foi a compra do GrandCentral pelo google, o qual eu nem fazia idéia que existia, trata-se de um serviço de gerenciamento de ligações, tem muitas funcionalidades interessantes, vale a pena dá uma olhada, é uma pena que o serviço ainda não está disponí­vel para o Brasil, mas vocé pode solicitar uma notificação quando o serviço estiver disponí­vel.

Além disso ele mostrou uma tabela de serviços comparativos, de 1.0 para 2.0

Como por exemplo:

1.0 2.0
DoubleClick

Google AdSense
Ofoto

Flickr
Mp3.com

last.fm
Britannica On line

Wikipedia
Personal Websites

Blogging

E outros como pode ser visto na apresentação dele.

Falou que os princípios da Web2.0 são:

Open Source – Liberação das informações
Communication – Usuários
Design – Nova arquitetura de interfaces com o usuário

Pra mim ficou meio misturado a afirmação de que o relacionamento do OpenSource com a web2.0 seja a liberação de informações no sentido de Content Syndication, Web Feed(RDF, Atom e etc), WebServices e APIs na minha opnião isso tem haver com OpenData e não com OpenSource, de fato há muita semelhança no modelo colaborativo de projetos OpenSource de código aberto para com serviços OpenData de compartilhamento de informações e não dúvido que a web2.0 com a semântica de OpenData tenha se baseado no modelo colaborativo do OpenSource. Eu acredito que um termo melhor seria OpenData.

Mostrou 1 exemplo de como ganhar dinheiro com a web2.0, usando o Amazon Web Service, o qual a cada livro vendido que você indicou em seu site/blog você ganha dinheiro.(O qual estarei botando em breve no meu blog :-P ).

Dando continuidade no quesito oportunidades, segundo Harald o que você precisa saber para arrumar um bom emprego no mercado de web2.0:

  • Content Syndication
  • Web feeds
  • RDF
  • Atom
  • Web services and APIs
  • Communication with XML or JSON
  • REST
  • SOAP(WSDL)

Algumas passagens me chamaram atenção como a do Tim O’Reilly sobre web2.0, resumindo significa que a inteligência coletiva é a base da web2.0, concordo em gênero e grau, você não ?

Houve também slides sobre Folksonomia[1], Comunicação, melhoramento de Design de interfaces com os novos conceitos RIA(Rich Internet Application) e RUE(Rich User Experience). Essa questão de trazer a experiência de uso de softwares desktop para web entre outras coisas.

Não deixou de falar dos padrões e a acessibilidade o que geralmente é ignorada em detrimento a funcionalidades “eye-candy” o que julgo muito importante e que nunca deve ser esquecida, ou seja, sua palestra também incluiu Web standards, W3C, leitores de tela, SEO e o funcionamento de softwares web, como estrutura(xhtml), apresentação(css) e etc.

Casos de uso do uso de JavaScript .

  • Melhorias na interação com os forms;
  • Melhorias na colaboração entre os usuários;
  • Filtros e manipulação de dados
  • Autocomplete (Como o google suggests)

Entrando mais na parte técnica, falou sobre o desenvolvimento, que com essa onda de informações e novos conceitos, por onde se basear , citou padrões utilizados e criados pelo yahoo, o YPatterns e das alternativas como o Ajax Pattern.

Não deixou de falar também para as pessoas com perfil empreendedor, falou sobre modelo de negócios:

  • Vender API
  • Vender serviços
  • Vender informações

Estratégias de expansão para quem já possui serviços:

  • Criar API
  • Distribuir como OpenSource (Citou também meios de o fazer, através do google code)

Vendeu um pouco de jabá falando sobre o MooTools e falou um pouco sobre o porque de frameworks.

Nessa hora tomei a liberdade de lhe fazer uma pergunta tendo em vista que o que ele mostrou de exemplo nada foram diferente dos exemplos encontrados utilizando JQuery , YUI e Ext-js os quais são os que eu uso nos meus projetos.

P: Perguntei quais eram as principais diferenças entre MooTools e Jquery/YUI ?
R: Ele disse que Mootools é melhor para projetos grandes. Disse também JQuery tem mais classes prontas e que o YUI tem uma estrutura menor do que a MooTools. Na opnião dele YUI é para projetos que precisem de namespaces.

O Evento foi de importância para região, quase não se ver eventos desse tipo por aqui em Manaus. Com certeza desenvolvedores web(como eu) sentem falta.

À coordenação, meus parabéns.

[1] Recomendo a leitura deste post sobre Folksonomia pelo Revolução Etc

]]> http://danielmartins.eti.br/blog/2008/09/15/lancamento-do-grupo-web20-manaus-com-harald-kirschner/feed/ 0 YUI + widget DataTable + Ordenação Customizada http://danielmartins.eti.br/blog/2007/07/03/yui-widget-datatable-ordenacao-customizada/ http://danielmartins.eti.br/blog/2007/07/03/yui-widget-datatable-ordenacao-customizada/#comments Tue, 03 Jul 2007 21:27:57 +0000 Daniel Elias http://daniel.jb0.org/2007/07/03/yui-widget-datatable-ordenacao-customizada/ Eu tenho utilizado exaustivamente a biblioteca de componentes YUI (Yahoo User Interface) para re-redesenhar a interface dos sistemas web que desenvolvo no meu atual local de trabalho.

Acredito que há muitas opniões sobre esta nova abordagem de web2.0, desenvolvedores nacionais renomados ja se expressaram sobre esta questão, a web2.0 é boa para diversas situações, mas não tudo. Um exemplo é o Yahoo Mail Beta, é legal e bonito mas é lento demais, sem falar que no firefox qualquer ação o processamento vai para 100% e isso é caos!. É tudo uma questão de bom senso, usar web2.0 para dá um turbinada na aplicação com validações e chamadas assíncronas, melhorar a usabilidade ou ainda aplicar um comportamento para um determinado componente na tela é uma boa opção. Mas usar web2.0 para emular sistemas que rodam no desktop é complicado, por que são muitos eventos, muitos widgets, muitas regras de css(posicionamento, imagens e etc) e acaba que a aplicação fica extremamente lenta e de difícil manutenção, com certeza não é o que queremos.

Para quem não conhece, a YUI é uma biblioteca de componentes reutilizaveis feitos em javascript, dhtml e css para facilitar a construção de RIA (Rich Internet Applications) , a YUI é produzida primariamente pelos yahoo hackers e também pela comunidade. É utilizada extensivamente no portal do Yahoo.com[.br] para os softwares web do Yahoo!, com isso podemos entender que é um projeto amplamente suportado. A YUI! é software livre, cuja a licença é uma variação da licença BSD e pode ser encontrada aqui.

Como eu ainda não postei nada sobre a YUI, neste artigo estarei descrevendo sua utilização básica com um exemplo utilizando o widget DataTable, para o exemplo ficar ainda mais interessante irei também descrever como customizar a ordenação crescente e decrescente. As informações de exemplo que vamos utilizar são informações referentes a veículos, vamos customizar a ordenação por Placa, a YUI já possui funções de ordenação padrões e que trabalham com alguns tipos definidos.

No inicío de cada bloco de código estarei usando a sigla [COD_[1-9]{2}] para identificar o bloco de código quando o estiver referenciando em outros trechos do artigo, para facilitar a localização.

Pré-requisitos:

  1. Conhecimentos básicos em JavaScript.
  2. Você precisa baixar a YUI e carregar os componentes na sua página html ou carregá-las apartir do próprio site do yahoo, para saber mais sobre este serviço entre no site.. No desenrolar deste artigo usarei o serviço de hosting da YUI provido pelo Yahoo.

Primeiramente é preciso incluir os scripts e os estilos no header do html:

  • Estilos: [COD_01]
  • Mais estilo(Sobrecarrega algumas regras css, para fins de personalização): [COD_02]

  • YUI Scripts: [COD_03]
  • JavaScript para criação do DataTable:[COD_04]

    function init()
    {
    /**
    * Configura namespace para não haver conflitos referentes a nomes
    * e para facilitar a organização de objetos e etc.
    */

    YAHOO.namespace(“exemplo”);

    /**
    * Dados que serão usados no DataTable
    */
    YAHOO.exemplo.dados = {
    veiculos: [
    {placa:"JTX-0506", vistoria:new Date(2004, 2, 21), km:110000},
    {placa:"JYZ-0469", vistoria:new Date(2001, 8, 10), km:65000},
    {placa:"JTA-4591", vistoria:new Date(2000, 9, 5), km:45036},
    {placa:"XYZ-4587", vistoria:new Date(2000, 5, 8), km:456978}
    ]
    };

    /**
    * Informações do cabeçalho para o widget.ColumnSet possa retornar
    * um objeto adapter(adaptador) para a renderização do DataTable.
    */
    var Cabecalhos = [
    {key:"placa", title:"Placa", sortable:true},
    {key:"vistoria", type:"date", sortable:true, resizeable:true},
    {key:"km", type:"number", sortable:true, resizeable:true}
    ];

    /**
    * Objeto “configurador” do cabecalho
    */
    var ConfiguraColunas = new YAHOO.widget.ColumnSet(Cabecalhos);

    /**
    * Objeto DataSource é responsável por pegar, tratar e adaptar
    * as informações para que o objeto DataTable possa renderizá-las
    */
    var CapturaInformacoes = new YAHOO.util.DataSource(YAHOO.exemplo.dados.veiculos);
    CapturaInformacoes.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
    CapturaInformacoes.responseSchema = {
    fields: ["placa","vistoria","km"]
    };

    /**
    * Enfim cria o table
    * O primeiro parametros é onde(div) será renderizado o seu DataTable
    */
    var DataTable = new YAHOO.widget.DataTable(“exemplo”,
    ConfiguraColunas, CapturaInformacoes, {caption:”Exemplo básico de DataTable”});
    }

    /**
    * Quando a arvore DOM estiver carregada executa a função!
    * o YAHOO.util.Event é um utilitário do YUI para trabalhar com eventos
    */
    YAHOO.util.Event.onDOMReady(init);

  • Você pode fechar o header do html e então no corpo(body) colocar aonde o DataTable será renderizado, no caso: (Sem isso o DataTable não irá ser renderizado)

Resultado:

Como podemos constatar no resultado acima as duas ordenações que realmente funcionam são as colunas por data e por quilometragem, pois o YUI reconhece os tipos informados nas linhas 28 e 29 do JavaScript , os tipos reconhecidos pela YUI são “string”, “number”, “date”, “currency”, “email” e “link”. Você pode clickar no cabeçalho da coluna “Placa” e você verá que a lógica de ordenação aplicada é a do tipo string, ou seja, pelas letras iniciais, mas precisamos que essa coluna seja ordenada pelo numero final da placa, pois sabemos que o pagamento do ipva de um veículo vence no mês do último número da placa, por exemplo final de placa 1 vence em Janeiro, 2 em Fevereiro e assim sucessivamente e as placas com final 0 vence em outubro.

Precisamos customizar a ordenação, vamos criar primeiramente as funções para ordenação crescente e decrescente, a YUI possui duas funções utilitárias para ajudar-nos nesta tarefa, são a YAHOO.util.Sort.compareAsc e a YAHOO.util.Sort.compareDesc
, a primeira para comparação crescente e a segunda para comparação decrescente, vejamos sua utilização já aplicando ao problema que nós temos de ordenar os dados pelo final da placa, a seguir: [COD_05]


/**
* Ordenação Crescente
*
*/
var ordByPlacaAsc = function(a,b){
// Pega o final da primeira placa
var finalPlaca1 = a.placa.charAt(a.placa.length – 1);
// Pega o final da segunda placa
var finalPlaca2 = b.placa.charAt(b.placa.length – 1);

var compFnc = YAHOO.util.Sort.compareAsc
// transforma em inteiro multiplicando por 1 e joga para
// a função utilitária de comparação
var resultado = compFnc(finalPlaca1*1,finalPlaca2*1);
return resultado;
}

/**
* Ordenação Decrescente
*
*/
var ordByPlacaDesc = function(a,b){
// Pega o final da primeira placa
var finalPlaca1 = a.placa.charAt(a.placa.length – 1);
// Pega o final da segunda placa
var finalPlaca2 = b.placa.charAt(b.placa.length – 1);

var compFnc = YAHOO.util.Sort.compareDesc

// transforma em inteiro multiplicando por 1 e joga para
// a função utilitária de comparação
var resultado = compFnc(finalPlaca1*1,finalPlaca2*1);
return resultado;
}

Como podemos ver, basicamente temos o mesmo procedimento só que com funções utilitárias diferentes, você pode fazer a comparação nas linhas 11 e 28, as funções utilitárias fazem a comparação e para a YAHOO.util.sort.compareAsc retornam -1 se o primeiro argumento for < (menor que) o segundo argumento, 0 se o primeiro argumento é igual( == ) ao segundo argumento e 1 se o primeiro argumento é >(maior que) o segundo argumento e o inverso para a YAHOO.util.sort.compareDesc, ou seja, -1 se o primeiro argumento for > (maior que) o segundo argumento, 0 se o primeiro argumento é igual( == ) ao segundo argumento e 1 se o primeiro argumento é < (menor que) o segundo argumento e assim a YUI vai ordenando os dados no DataTable, mas você está sentindo falta de algo ?! sim!, aonde parametrizamos para que o YUI utilize estas funções customizadas de ordenação ?!

R: No bloco de código [COD_04] na linha 27 é possível passar um argumento chamado sortOptions contendo as informações referentes a customização da ordenação, veja um exemplo de como fica a linha 27 inserindo as funções de ordenação:


{key:”placa”, title:”Placa”, sortable:true, sortOptions:{ascFunction:ordByPlacaAsc,descFunction:ordByPlacaDesc}},

Como resultado podemos ver a ordenação sendo feita pelo último número da Placa do veículo:

Resultado:

Já me estendi demais, espero que eu tenha conseguido exemplificar o uso básico do widget DataTable da YUI e de como customizar a ordenação, qualquer sugestão, correção ou crítica construtiva é bem vinda. Ajude-me a melhorar a qualidade dos artigos que escrevo.

Links essenciais que me serviram de consulta e para quem deseja exemplos mais ricos:
http://developer.yahoo.com/yui
http://developer.yahoo.com/yui/examples/datatable/
http://developer.yahoo.com/yui/datatable/
http://developer.yahoo.com/yui/docs/module_datatable.html
http://www.quirksmode.org/js/strings.html

]]> http://danielmartins.eti.br/blog/2007/07/03/yui-widget-datatable-ordenacao-customizada/feed/ 3 SPL (Standard PHP Library) – DirectoryIterator http://danielmartins.eti.br/blog/2007/05/14/spl-standard-php-library-directoryiterator-2/ http://danielmartins.eti.br/blog/2007/05/14/spl-standard-php-library-directoryiterator-2/#comments Tue, 15 May 2007 02:58:14 +0000 Daniel Elias http://daniel.jb0.org/2007/05/14/spl-standard-php-library-directoryiterator-2/ Você conhece a SPL(Standard PHP Library) ? É uma biblioteca de componentes inteiramente escritos em PHP5 dentro do paradigma de Orientação a Objetos para lidar com problemas cotidianos na vida dos programadores que trabalham com PHP.

O ambiente onde este artigo foi desenvolvido/testado:

  • PHP 5.2.1 SAPI CLI (Command Line Interface)
  • Ubuntu Feisty Fawn

O que você precisa saber para aprender melhor o conteúdo ?


Um dos problemas que encontramos sempre é a questão de trabalharmos com iteração de diretórios, por exemplo um script para backup, localizar algum determinado tipo de arquivo dentro de um diretório com muitos sub-diretórios, efetuar mudança de nomes de forma recursiva dentre outros. Precisávamos de um solução elegante e legível para efetuarmos manutenção seja corretiva e ou implementativa, isso se torna mais importante quando você trabalha em equipe ou quando você deixa um código para que outro programador seja responsável pela manutenção. Outro ponto forte para a criação e utilização desta biblioteca é a questão de termos um ponto central de soluções(amplamente suportados) para problemas cotidianos assim agilizando o processo de desenvolvimento de software, ou seja, ao invés de termos que criar sempre uma solução para um problema que já tem solução(não seria re-inventar a roda ?!) ou fazer reutilização de software através de CTRL + C e CTRL V ( como era feito e que ainda é muito utilizado ).

Minha contribuição para que possamos melhorar o desenvolvimento de software onde tem como tecnologia de programação PHP5/6 é iniciar uma série de artigos explanando a utilização da SPL, tendo como início uma classe chamada DirectoryIterator.

Para entendermos melhor o DirectoryIterator precisamos dá uma olhadinha neste diagrama de colaboração, através da figura 1 abaixo:

Figura 1.

Como podemos interpretar esse diagrama de colaboração(Figura 1) o DirectoryIterator é uma classe que implementa a interface Iterator e extende a classe SplFileInfo.
O design da interface Iterator é segundo seu diagrama de colaboração o seguinte:

Figura 2

Basicamente a interface Iterator diz que a classe DirectoryIterator deve obrigatoriamente implementar os métodos current(), key(), next(), rewind(), valid(). Portanto isto quer dizer que um objeto DirectoryIterator pode ser atravessado/iterado/percorrido e que deve ter os controles básico para uma boa iteração de fila como ir para frente( next() ), voltar( rewind() ), atual ( current() ) e controle condicional ( valid() ).

Como ele extende a classe SplFileInfo, isso quer dizer que podemos acessar os métodos públicos desta classe, métodos como isFile(), isDir() , isExecutable()  dentre outros.

Com esse raciocínio básico podemos ir para o código, afinal “Talks is cheap, show me the code”.


$dirName = “/tmp”;
$dirObj = new DirectoryIterator($dirName);

$i = 0;
for(; $dirObj->valid() ; $dirObj->next() )
{
if( !$dirObj->isDot() )
{
print “$i -> {$dirObj->getPathname()} “.” ->; {$dirObj->getType()}\n”;
$i++;
}
}

O código acima mostra os arquivos e diretórios de um determinado diretório informado no construtor do objeto DirectoryIterator.

Basicamente na linha 2 é informado o diretório para ser visualizado e percorrido, na linha 3 é instanciado um objeto DirectoryIterator e o percorremos através de um for conforme visto na linha 5 e nos condicionais deste for podemos ver que estamos utilizando os métodos implementados na classe DirectoryIterator conforme a interface Iterator manda e isso nos dá os condicionais básicos e iteradores para percorrer/iterar este objeto.

Gostou ?! vamos dá um upgrade neste exemplo… vamos criar 2 funções recursivas, uma para guardar o enderecamento dos diretórios, sub-diretórios e seus arquivos em um Array e outra função para imprimir isso de forma recursiva:


/**
* Função para guardar os diretórios/sub-diretórios e seus arquivos
* respectivamente em um vetor(Array) de forma recursiva
*
* @params string $dirName
* @return array $arr
*/
function throughDir($dirName)
{
$dirObj = new DirectoryIterator($dirName);
for(; $dirObj->valid() ; $dirObj->next() )
{
if( $dirObj->isDir() and !$dirObj->isDot() )
{
$arr[$dirObj->getPathname()] = throughDir($dirObj->getPathname());
}
}
return $arr;
}

/**
* Função para imprimir os diretórios/sub-diretórios e seus arquivos
* respectivamente de um vetor(Array) de forma recursiva
*
* @params Array $dirName
* @return void
*/
function printDir($arrDirs)
{
if(is_array($arrDirs))
{
foreach($arrDirs as $dir => $subDir)
{
echo $dir.”\n”;
printDir($subDir);
}
}else{
echo $arrDirs.”\n”;
}
}

$arrDirs = throughDir(“/home/daniel/Desktop/”);
printDir($arrDirs);

Gostaram ?! é muito legal, tudo muito bom e claro perfeito senão tivessemos problemas para serem tratados.

Um dos problemas que podem ocorrer durante a execução de seu script é a falta de permissão para ler e ou abrir diretórios e arquivos, e se isso acontecer irá comprometer a execução de seu programa, ou seja, será finalizado.

No exemplo do código acima você vai conseguir percorrer os diretórios e sub-diretórios que você possuir permissão de leitura mas ao tentar percorrer um sub-diretório onde você não possui permissão para ler, o seu script finalizará a execução.

Um exemplo é você alterar o script anterior para percorrer um diretório que você não tenha permissão, você pode trocar a string “/home/daniel/Desktop” por “/tmp”, geralmente em “/tmp” sempre tem algo que o proprietário é o root e assim não permitindo que você possa ler o conteúdo. No meu caso olha no que deu:

daniel@blackforce:~/Desktop$ php teste2.php

Fatal error: Uncaught exception ‘RuntimeException’ with message ‘DirectoryIterator::__construct(/tmp/gconfd-root): failed to open dir: Permission denied’ in /home/daniel/Desktop/teste2.php:13
Stack trace:
#0 /home/daniel/Desktop/teste2.php(13): DirectoryIterator->__construct(‘/tmp/gconfd-roo…’)
#1 /home/daniel/Desktop/teste2.php(18): throughDir(‘/tmp/gconfd-roo…’)
#2 /home/daniel/Desktop/teste2.php(48): throughDir(‘/tmp’)
#3 {main}
thrown in /home/daniel/Desktop/teste2.php on line 13

Na maioria das vezes é possível fazer com que seu programa saiba com que tipo de erro está lidando e assim fazê-lo executar outros procedimentos para tentar ignorar o problema que o está impedindo de terminar com sucesso a execução.

Para tanto é necessário que você saiba como trabalhar com Exceptions, um exemplo de como capturar exceções no exemplo do código anterior é acrescentando um bloco de try / catch na funcção throughDir() para capturar o erro como no exemplo abaixo:
/**
* Função para guardar os diretórios/sub-diretórios e seus arquivos
* respectivamente em um vetor(Array) de forma recursiva
*
* @params string $dirName
* @return array $arr
*/
function throughDir($dirName)
{
try{
$dirObj = new DirectoryIterator($dirName);
for(; $dirObj->valid() ; $dirObj->next() )
{
if( $dirObj->isDir() and !$dirObj->isDot() )
{
$arr[$dirObj->getPathname()] = throughDir($dirObj->getPathname());
}
}
}catch(RuntimeException $erro){
print $erro;
}
return $arr;
}

Apenas com este tratamento de imprimir o erro olha o resultado da execução:

daniel@blackforce:~/Desktop$ php teste2.php
exception ‘RuntimeException’ with message ‘DirectoryIterator::__construct(/tmp/gconfd-root): failed to open dir: Permission denied’ in /home/daniel/Desktop/teste2.php:13
Stack trace:
#0 /home/daniel/Desktop/teste2.php(13): DirectoryIterator->__construct(‘/tmp/gconfd-roo…’)
#1 /home/daniel/Desktop/teste2.php(18): throughDir(‘/tmp/gconfd-roo…’)
#2 /home/daniel/Desktop/teste2.php(48): throughDir(‘/tmp’)
#3 {main}exception ‘RuntimeException’ with message ‘DirectoryIterator::__construct(/tmp/orbit-root): failed to open dir: Permission denied’ in /home/daniel/Desktop/teste2.php:13
Stack trace:
#0 /home/daniel/Desktop/teste2.php(13): DirectoryIterator->__construct(‘/tmp/orbit-root’)
#1 /home/daniel/Desktop/teste2.php(18): throughDir(‘/tmp/orbit-root’)
#2 /home/daniel/Desktop/teste2.php(48): throughDir(‘/tmp’)
#3 {main}/tmp/.tmp
/tmp/.tmp/tcx
/tmp/hsperfdata_daniel
/tmp/.ICE-unix
/tmp/.X11-unix
/tmp/.esd-1000
/tmp/kde-daniel
/tmp/gconfd-root
/tmp/orbit-daniel
/tmp/hsperfdata_root
/tmp/ksocket-daniel
/tmp/orbit-root
/tmp/ssh-KcBsL23144
/tmp/gconfd-daniel
/tmp/gconfd-daniel/lock
/tmp/virtual-daniel.XCv1fR
/tmp/epiphany-daniel-OTEfiF
/tmp/keyring-vrbWn3
/tmp/.exchange-daniel
/tmp/svbd9.tmp
/tmp/plugtmp
daniel@blackforce:~/Desktop$

Como podemos ver, o erro foi impresso mas não gerou nenhum Fatal Error na execução do programa, o script continuou a execução até o fim e se por acaso tivesse ocorrido outro erro por falta de permissão, novamente ele iria imprimir o erro e seguir em diante, tudo isso porque o Fatal Error é gerado porque você não está tratando devidamente as ocilações de comportamento de seu programa de uma forma adequada.

A única exceção que vimos foi a RuntimeException, mas este post já está muito grande e não quero me estender mais para não ficar muito cansativo de ler, além do que este assunto sobre Exceptions geradas pela SPL merece um artigo somente tratando de explanar sua lógica, forma de captura e tratamento.

Com certeza isso é só o início da uma apresentação sobre a SPL. Espero que com essa introdução à classe DirectoryIterator tenha ajudado de alguma forma a tirar dúvidas sobre esta classe.

Qualquer contribuição/sugestão/correção/reclamação será bem vinda.

Comente! ajude a melhorar a qualidade do artigo.. compartilhe conhecimento.

Fontes:

Updates:
Atualizado endereços das imagens para a nova url

]]> http://danielmartins.eti.br/blog/2007/05/14/spl-standard-php-library-directoryiterator-2/feed/ 2 Mais uma vitória do PHP! http://danielmartins.eti.br/blog/2007/02/10/mais-uma-vitoria-do-php/ http://danielmartins.eti.br/blog/2007/02/10/mais-uma-vitoria-do-php/#comments Sat, 10 Feb 2007 18:19:49 +0000 Daniel Elias http://daniel.jb0.org/?p=53 PHP Power !

Notícia não está quente mas está morna! rs…

É hora de criar seu espaço também nos mainframes da IBM!

A Equipe da IBM que desenvolve z/OS acabou de portar o PHP. A versão portada é a 5.1.2 e foi portada para utilização nos 2 ambientes suportados pelo PHP, o CLI (Command Line Interface) e para o ambiente web através de CGI e claro já vem incluída a extensão PDO_ODBC para comunicação com o DB2, mas isso é claro ! :)

Fonte: http://info.abril.com.br/blog/sandra/20070208_listar.shtml

Fonte: http://www.alphaworks.ibm.com/tech/php4zos

]]> http://danielmartins.eti.br/blog/2007/02/10/mais-uma-vitoria-do-php/feed/ 0 Ajax + IE(Ca)che http://danielmartins.eti.br/blog/2006/09/13/ajax-iecache/ http://danielmartins.eti.br/blog/2006/09/13/ajax-iecache/#comments Wed, 13 Sep 2006 20:14:42 +0000 Daniel Elias http://daniel.jb0.org/?p=38 Ao escrever chamadas em Ajax, me deparei com um problema, ao fazer uma requisição de dados do servidor, o IE guarda os dados localmente e isso é extremamente irritante porque estou lidando com dados temporários, portanto na próxima requisição será preciso obter dados atualizados, mas pelo IE(ca) será utilizado os dados da última requisição.
Procurando no google achei um link que explica como enganar o IE para sempre trazer novamente as informações ao invés de usar os dados que estão em cache.

No script Ajax, você irá fazer uma requisição e será preciso passar uma url para então obter os dados, na variável que contém url você acrescentará

+’&dummy=’ + new Date().getTime()

, esta dica só serve para o tipo de requisição GET(eu não testei se funciona com POST):

Exemplo:

var url = ‘automovel.php?placa=JXX-0101′

Acrescente:

var url = ‘automovel.php?veiculo=JXX-0101′+’&dummy=’ + new Date().getTime()

Link: http://weblogs.asp.net/pleloup/archive/2006/06/08/451583.aspx

]]> http://danielmartins.eti.br/blog/2006/09/13/ajax-iecache/feed/ 0