PaintbrushJS - manipulação de imagens em JavaScript

Utilizando a tag canvas é possivel manipular pixel por pixel da imagem, essa bilbioteca executa funções comuns em manipulação de imagem.

PaintbrushJS

Veja também:
Pixastic - Processamento de imagens em JavaScript

Jisp - Implementação de Lisp em JavaScript

Lisp foi na época de sua criação um grande avanço nas linguagens de computador. Diversos recursos disponíveis nas linguagens recentes foram criados na Lisp.

Uma característica que acho interessante no Lisp é a forma de representação de um programa ser do mesmo tipo de estrutura que é utilizado para os dados. Hoje em dia, toda linguagem possui uma certa analogia na forma de sua escrita (representação do programa) e a estrutura de dados.

Jisp é uma implementação de Lisp em JavaScript. Para quem curte JS, é absurdamente interessante.

Eu realizei que JavaScript é tão parecido com Lisp que poderia ser fácil escrever um Lisp baseado em JavaScript que utiliza o parser de JavaScript do navegador em vez de escrever meu próprio parser. Brian Morearty, criador do Jisp.

http://www.ducklet.com/jisp/

PubNub - JavaScript Push API para apps real-time

PubNub é um serviço que facilita a criação de aplicativos que atualizam constantemente os dados. Além de ofecer infra-estrutura "na cloud" eles oferecem um "client" JavaScript que utiliza de todas capacidades possíveis para entregar os dados rapidamente e com menos overhead.

Se o usuário suportar, até Web Sockets será utilizado.

http://www.pubnub.com/

Node-JS

Node.js é um framework server-side (server-side JavaScript) para produção de aplicativos web que precisam de comunicação de rede leve e alta concorrência. Chats e aplicativos em tempo real que fazem muitas requests ou mantêm a conexão aberta para carregar mais dados são exemplos de um bom uso para o poder do Node.js

Drinking the Node.js Kool-Aid

Pixastic - Processamento de imagens em JS

Recentemente precisei mudar o tamanho de uma imagem antes de enviar para um webservice. Apesar de parecer meio estranho isso é possível graças a tag canvas.

A biblioteca Pixastic facilita não só o redimensionamento mas também incorpora várias outras técnicas utilizadas por editores de imagem. O projeto possui um editor online (muito bem) feito em cima da biblioteca onde é possível aplicar filtros e efeitos nas imagens.

Google Phone

A URL http://google.com/phone é legal. Não só isso é legal no celular do Google.

Finalmente o Android ficou pronto a ponto do Google anunciar publicamente sua marca junto a HTC, fabricante dos aparelhos. Alguns destaques do NexusOne:

Search do Google por voz (GPS + voz, na verdade, o que possibilita você falar "pizza" para o telefone e ele te mostrar no Google Maps o caminho às pizzarias próximas).

Hardware e resolução de tela (800x480) para rodar jogos muito melhor que qualquer PSP e o marketplace para baixar legalmente jogos muito melhores até que jogos de PS2. Tudo pelo 3G.

Marketplace dos modelos anteriores da HTC que rodam Android, com mais de 20 mil apps prontas para rodar no telefone do Google (Android 2.1).

Google Phones

Aparelho fino (1,19cm).

E o mais importante para os devs: SDK simples e publica.

Veja também sobre o Zeebo, um video game da brasileira TecToy que tem um Android dentro e os jogos são baixados pelo 3G.

Widget do Submarino com YQL

Meu último post foi uma tentativa de explicar o funcionamento da Yahoo Query Language. No final falei da possibilidade de se fazer um Widget do Submarino com a YQL e agora volto para implementar o prometido.

YQL


Como eu disse existe um post explicando a YQL, porém aqui vai uma explicação rápida:

A YQL pode ser usada para buscar dados nas APIs do Yahoo (Flickr, Delicious, Placemaker, Maps, ...), nas APIs do DataTables (Twitter, Amazon, GeoLocation, ...) ou em qualquer outro documento da web (página HTML).

Para mostrar como a busca em um documento qualquer da web é feita, escrevi o seguinte código:

[sourcecode lang="sql" gist="123439"]
select * from html where url="http://www.submarino.com.br/busca?q=ipod" and xpath="/html/body/div/div[2]/div/div/div/div/div/div/div[2]/div/div/div/ul/li/div/a[3]"
[/sourcecode]

Para testar use o console da YQL ou veja teste dessa busca. O YQL vai retornar o conteúdo pedido em XML ou JSON.

JSONP

"JSON with Padding" é uma técnica que permite o carregamento assíncrono de informações de um domínio externo.

Toda biblioteca de JavaScript que se preze possui ...

Yahoo! Web Services - apresentação das APIs

No #brhackday08 o foco dos desenvolvedores do Y! já parecia ser o de abrir a sua API.

Parte do Yahoo Open Strategy, SearchMonkey e BOSS foram os destaques das apresentações, mas uma serie de outros serviços da empresa foram apresentados para os desenvolvedores.

API do Yahoo!

O termo é realmente vago para quem nunca olhou a lista de serviços (web services) que a empresa oferece.

Pipes e SearchMonkey são possivelmente os mais conhecidos. Mas outros produtos do Y! para desenvolvedores são interessantes.

Pipes


O serviço permite a criação de mashups entre outras fontes de dados. O fluxo de dados extraídos das paginas pode ser construído usando uma interface visual bem legalzinha.

yahoo pipes screenshot

SearchMonkey


SearchMonkey é a ferramenta que permite modificar o visual da busca do Yahoo!
As informações que aparecerão nos resultados da buscas podem ser extraídas das paginas usando XPath.

Exemplo de resultado da busca com SearchMonkey:

Search Monkey funcionando

BOSS


Busca aberta. API que retorna os resultados da busca do Yahoo! em JSON ou XML.
É possivel facilmente "re-rankear" os resultados antes de mostrar para o usuário adicionando novas regras.

Music


Essa API pouco conhecida abre possibilidades interessantes para criação de ...

Melhore seu jQuery-fu, escreva plugins

Essa é uma tradução de "Improve your jQuery-fu, write plugins" de Tomáš Kramár Trnava.
Escolhi traduzir esse texto pois ele foi o tutorial mais simples que encontrei quando precisei escrever um plugin. No final dele você será capaz de entender como o jQuery trabalha com plugins e poderá escrever os seus próprios.


jQuery é um framework JavaScript simples e poderoso que mudou minha forma de programar JavaScript. Um novo JavaScript dizem alguns com certa razão. O código que você cria é pura elegância.

Você começa com 10 linhas de jQuery que poderiam ter sido 20 linhas do tedioso JavaScript manipulando DOM. No final você acaba ficando com duas ou três linhas.

E esse numero pode ficar ainda menor se você refatorar o código para um plugin do jQuery.

Quando o assunto é escrever plugins, pessoas (tipo eu) normalmente pulam fora com medo. Eu ouvi sobre plugins de jQuery a bastante tempo mas nunca havia tentado escrever um. Quando pensava no assunto algumas idéias vinham na minha cabeça:


  • Deve ser difícil e por isso deixe isso somente para jedis

  • Isso deve precisar de um conhecimento profundo do jQuery

  • O que eu vou ganhar ...

Greasemonkey com jQuery

Greasemonkey é um add-on para o Firefox que permite a instalação de scripts para modificar o funcionamento de páginas da web.

Semana passada eu escrevi um script de Greasemonkey para modificar as páginas da Wikipedia em uma tentativa de acelerar a leitura dos textos. O resultado visual é esse:
Klassic Wikipedia

É interessante para quem pretende fazer scripts de Greasemonkey utilizar a biblioteca jQuery para agilizar o desenvolvimento. Para isso o código comentado a seguir vai ajudar:

[sourcecode lang="js" gist="91527"]
// go jQuery, go!
var GM_JQ = document.createElement('script');
GM_JQ.src = 'http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js';
GM_JQ.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(GM_JQ);

// Verifica se o jQuery pode ser usado
function GM_wait() {
if(typeof unsafeWindow.jQuery == 'undefined') { window.setTimeout(GM_wait,100); }
else { $ = unsafeWindow.jQuery; letsJQuery(); }
}
GM_wait();

function letsJQuery() {
// pode usar o $ aqui ;D
}
[/sourcecode]

Obs: se você utiliza outro navegador existem outras opções para executar "user scripts". Uma delas é o GreaseKit para WebKit (Safari).

About Me