Não tenho dúvidas quanto ao poder da biblioteca Prototype, quando combinado com o script.aculo.us então fica melhor ainda!

A idéia deste post é apenas ilustrar como escrever uma classe javascript usando o prototype em uma outra oportunidade falo alguma coisa sobre o script.aculo.us.

A primeira coisa a se fazer é criar a classe, lembre-se estou utilizando Prototype 1.6.0RC1. É importante saber que a função initialize é uma espécie de construtor, ou seja, é onde você pode inicializar os atributos necessários para o funcionamento da sua classe, o exemplo abaixo ilustra a inicialização de um atributo chamado inputField, onde vou armazenar um id para um input type text.

Quando a classe é instanciada, os atributos e métodos devem ser acessados com a palavra this se você tentar acessar sem this o javascript não reconhecerá o seu atributo e/ou método.

var MinhaClasse = Class.create({
    initialize: function(inputField){
        this.inputField = inputField;
    }
});

O próximo passo é definir algum método para nossa classe, o método click vai apenas executar um simples alert,
mas o mais importante deste exemplo é como vamos conectar o nosso inputField com o evento onClick. O prototype extende o DOM (Document Object Model), e adiciona alguns métodos muito úteis como por exemplo o observe.

Primeira coisa a se fazer é registrar o método click como um EventListener, com isso quando o evento for capturado, todos os atributos e métodos serão acessiveis dentro do método que esta sendo executado. Feito isso vamos começar a observar um evento, que em nosso exemplo será o onClick, para isso basta colocar apenas 'click' (o prototype se encarrega de fazer o resto!) e finalmente quando o evento acontecer o que executará, deve-se passar um método ou função, aqui utilizaremos um método chamado this.click. Outro método muito útil do prototype, é o Event.element, quem já utilizou javascript sabe como é complicado ter que ficar se preocupando com todos os browsers, aqui entra o Event.element ele já se preocupa com isso e nos entrega exatamente o que precisamos que é o target (ou o elemento que estamos observando). Finalmente um simples alert em nosso conteúdo!

var MinhaClasse = Class.create({
    initialize: function(inputField){
        this.inputField = inputField;
        // registrando como um EventListener
        this.click = this.click.bindAsEventListener(this);
        // Aqui estamos observando o evento click no nosso inputField
        $(this.inputField).observe('click', this.click);
    },
    click: function(event){
       var element = Event.element(event);
       alert(element.value);
    }
});

Pronto agora é so salvar como MinhaClasse.js ou qualquer nome que você desejar, incluir primeiro o prototype.js e então MinhaClasse.js em sua página. Para utilizar a classe é necessário ter uma instância, você pode colocar dentro da tag body onLoad="" como no exemplo abaixo:

<html>
<head>
<script type='text/javascript' src='prototype.js'></script>
<script type='text/javascript' src='MinhaClasse.js'></script>
</head>
<body onLoad='new MinhaClasse(\'id_input\');'>
<input type='text' id='id_input' />
</body>
</html>

Claro que o exemplo é simples, mas é apenas a idéia do poder e do que é possível fazer, aconselho sempre que estiver desenvolvendo com prototype de uma olhadinha na documentação do prototype que tem muitas informações úteis e pequenos exemplos!

Onde esta o windows.h ?!?

Agosto 21, 2007

Poisé, fazia um bom tempo que eu não encostava no Microsoft Visual C++ … Precisei urgentemente utilizar no trabalho e claro, estava completamente enferrujado! Primeiro problema, o compilador não identificava o tipo DWORD … mas porque? faltava a definição do DWORD que se encontra na biblioteca windows.h … fui faceiro dar um #include “windows.h” …

Não funcionou, o compilador não encontrava a biblioteca windows.h! E agora o que fazer??? Um simples download de 384 Mb do microsoft SDK resolve o problema! Após o download feito e instalado o SDK ainda tem o passo da configuração do ambiente de desenvolvimento, como setar o diretório de executáveis, setar o diretório de bibliotecas e includes, não vou dar o passo a passo, pois se encontra no site da microsoft, da uma passadinha lá para maiores detalhes, basta clicar aqui (Using the Platform SDK)