Você conhece os bookmarklets ? Eles são pedacinhos de código javascript que, colocados no favoritos, aproveitam a capacidade do navegador de executar estes códigos para fazer coisas bacanas, porque não dizer incríveis até!
Os bookmarklets são un assunto recorrente na web. Leio a respeito deles há anos, e cheguei até a usar alguns por pouco tempo, mas recentemente é que resolvi "revisitar" estas pequenas maravilhas e descobri que poderiam me ser muito úteis na minha rotina diária na web.
Alguns sites especializados no assunto que vale a pena visitar: Marklets, Bookmarklets e HTML Source. Embora muitos bookmarklets estejam associados à atividade de desenvolver sites, isto é apenas uma consequência do fato de que programadores e designers conhecem mais javascript.
Eu, por exemplo, mesmo odiando programar me peguei escrevendo algumas linhas de código javascript (e apanhando bastante, claro!) pra fazer alguns bookmarklets que facilitassem minha vida, e que agora compartilho com vocês. Como sempre digo aos meus alunos, o "mundo da TI" é dos desenvolvedores, afinal são eles que transformam idéias em aplicações práticas.
Abaixo disponibilizo o código dos bookmarklets que achei úteis, adaptei ou mesmo criei, pra me ajudar a blogar, pesquisar ou acessar sites:
- Antes, uma menção ao bookmarklet mais famoso de todos os tempos da última semana: o Readability, que facilita a leitura de páginas, eliminando o lixo (propagandas, etc) e deixando o visual do site mais "clean";
- O PwnYouTube facilita o download de vídeos não apenas do maior site de vídeos do mundo, mas de uma lista considerável de outras fontes também;
- O PrintWhatYouLike permite personalizar qualquer página e deixá-la mais adequada para impressão, de acordo com o que importa pra você, permitindo selecionar partes ou ocultar a imagem de fundo, por exemplo;
- O YouSearch permite buscar um texto selecionado em diversos mecanismos de busca, seja na Amazon ou no WolframAlpha. E é fácil adicionar outros mecanismos a gosto do freguês;
- O Clipr permite selecionar um trecho de uma página e ter, numa nova janela, apenas o trecho selecionado;
A partir destes e de outros bookmarklets, criei os códigos abaixo:
- Pesquisar filmes, música, livros, jogos, software, etc
O código abaixo usa a pesquisa personalizada que criei para "filtrar" apenas as fontes confiáveis de Torrents, buscando a partir do texto selecionado ou solicitando o nome do item a buscar.
javascript:q=""+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text);if(!q)q=prompt("Termos para a busca ? ... ","");if(q!=null){location="http://www.google.com/cse?cx=000230079134078443467%3A1d-dtg1elzi&ie=UTF-8&q="+escape(q).replace(/ /g,"+")+"&sa=Pesquisar";}void 0
- Buscar legendas de filmes
O Open Subtitles é provavelmente a melhor fonte de legendas para filmes na web. O código abaixo faz uma busca no site por legendas em português (do Brasil!) para o filme informado.
javascript:q=""+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text);if(!q)q=prompt("Termos para a busca ? ... ","");if(q!=null){location="http://www.google.com.br/search?q=site%3Awww.opensubtitles.org+"+escape(q).replace(/ /g,"+")+" pb";}void 0
- Pesquisar imagens no blog
Modifique o trecho em negrito de acordo com o site no qual deseja buscar imagens.
javascript:q=""+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text);if(!q)q=prompt("Termos para a busca ? ... ","");if(q!=null){location="http://www.google.com.br/images?q=site%3Ablog.tecnologiaqueinteressa.com+"+escape(q).replace(/ /g,"+");}void 0
Uma mudança mínima no código anterior (veja o destaque), e temos uma pesquisa de termos citados no blog.
javascript:q=""+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text);if(!q)q=prompt("Termos para a busca ? ... ","");if(q!=null){location="http://www.google.com.br/search?q=site%3Ablog.tecnologiaqueinteressa.com+"+escape(q).replace(/ /g,"+");}void 0
- "Limpar" código HTML mantendo apenas os links
Muitas vezes preciso citar trechos de textos de outras fontes, mas ao copiar o texto, vem junto um monte de tags de formatação que às vezes até bagunçam o layout do blog, então criei este código, a partir da função strip_tags disponível no phpjs.org (valeu Roque!).
javascript:function strip_tags (input, allowed) { allowed = (((allowed || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join(''); var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi, commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi; return input.replace(commentsAndPhpTags, '').replace(tags, function ($0, $1) { return allowed.indexOf('<' + $1.toLowerCase() + '>') > -1 ? $0 : ''; }); } var texto=""+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text);if(!texto)texto=prompt("Informe texto HTML... ",""); if(texto!=null){ var form=''; form+='<body><FORM name="form1"><TEXTAREA NAME="TextoFinal" ROWS="50" COLS="100"><\/TEXTAREA><\/form><\/body>'; var jan=window.open(''); jan.focus(); pop=form; jan.document.write(pop); var texto1 = strip_tags(texto,"<a>"); jan.document.form1.TextoFinal.value = texto1; } void 0
Dica: copie o texto daqui e cole num editor com sintax highlight. Vai ficar beeeemmmm melhor!
Atenção! Os códigos aqui disponíveis foram testados apenas no Chrome, embora devam funcionar em qualquer navegador.
Por favor, não deixem de compartilhar comigo as idéias de bookmarklets que tiverem!
Ah! Para adicionar o código aos seus favoritos, basta copiá-los (os códigos têm que estar em apenas uma linha!), criar um novo favorito e colar o código no lugar da URL.
Siga-nos no Twitter!
Receba os textos via e-mail ou RSS!
Confira outros textos sobre o tema!
