Category Archives: Javascript

Javascript: libjsx

jsx

Há algum tempo eu reuni alguns exemplos meus de javascript no Google Code com o nome de libjsx, aonde adicionei outras funcionalidades também como por exemplos métodos para Ajax. Separei em componentes visuais (colorpicker, datagrid, etc.), eventos de mouse e teclado, html elements, próprio ajax, e core com algumas funcionalidades básicas.

Mas devido um outro projeto várias funcionalidades novas que fiz não estão presentes, espero que após concluir o projeto eu possa mesclar as modificações e tornar essa bibilioteca realmente usável. Por enquanto vale a pena dar uma lida por curiosidade.

Javascript Benchmark: replaceAll

Há algum tempo escrevi um post contendo um exemplo de método para fazer replace em toda String. No caso o método que escrevi usava while e realmente é muito menos eficiente do que as alternativas apresentadas nos comentários, a primeira usando Expressão Regular (sugerida pelo Almir Mendes) e a segunda utilizando split e join (sugerida pelo Lucas Ferreira).  Então resolvi (depois de muito tempo) fazer um benchmark utilizando os três métodos para poder chegar a uma conclusão sobre qual seria melhor.

Fiquei muito surpreso com os testes, não porque o método utilizando while foi de longe o pior entre os três, mas sim pelo fato do método que consiste em dividir a String em um vetor e depois junta-la novamente (split+join) ter sido mais rápido do que o próprio método de replace do javascript utilizando Expressão Regular (já que o split também utiliza ER).

Outro fato interessante é que tanto utilizando ER quanto split-join os métodos se mostraram bastante escaláveis, enquanto o com while piora consideravelmente conforme o número de ocorrência aumenta.

Lembrando que fiz os testes através desta página que criei utilizando como browser o Firefox 3.0.5. Caso alguém faça os testes e obtenha resultados diferente gostaria de receber feedbacks.

Javascript: Virtual Keyboard

keyboardBaseado no teclado virtual do Banco do Brasil (feito em Java) resolvi simular um com Javascript. Ainda não sei uma utilização eficaz para ele, mas se usarmos um name dinâmico e funcionando com uma senha complementar (porque permite somente números, ou seja, uma senha fraca) pode acabar ajudando contra Keylogger ou algum robô (script) que alguém possa ter implementado para acessar a página.

Enfim, serve como um exemplo de como podemos aplicar o Javascript (com auxílio de CSS) nas páginas, sistemas.

JsCC no Assembla

Eu juntamente com meu amigo Ulysses Rangel (que em breve estará com um blog), a partir de uma idéia dele, resolvemos colocar o JsCC no Assembla e trabalharmos juntos para aprimorarmos e dar suporte a outras linguagens.

Outra novidade é que agora você pode escolher quais tags quer que o script colore. Para acessar o space do JsCC, segue o link abaixo:

http://www.assembla.com/space/jscc

E espero que essa parceria renda outros bons frutos. Já que se depender da gente, vontade não falta.

Javascript: Jump Menu

Uma grande maioria dos desenvolvedores web não gostam cara padrão dos Jump Menus. Então por que não fazer um?

Pensando assim que fiz um script para gerar um Jump Menu, ou ComboBox se prefirir. Ele é composto por uma <div> (para moldura), uma <span> (para servir como rótulo) e uma lista não-ordenada de links (<ul>).

Para usá-lo, a única coisa que devemos fazer, além de linkar o script ou adicioná-lo no corpo da página, é instanciar o Objeto. E passar como parâmetro um array de array, contendo esse último na primeira posição a url e na segunda o texto a ser exibido. Após isso feito, escolha aonde adicioná-lo (pack) através do id da tag.

Ex:

var itens = Array();

for (var i=0; i<15; i++)

 itens[i] = ['https://rogeriolino.wordpress.com/', 'item ' + (i+1)];var jump = new JumpMenu(itens);

jump.setLabel(' + Click Here');

jump.pack('teste');

Para o visual basta usar de todo o potencial do CSS e estilizar como preferir.

Clique aqui para conferir o exemplo contendo o código.

Javascript: Rate this

Rate

Quem nunca viu aquelas “5 estrelas” logo após algum artigo, foto, etc?

Pois então, esse script cria uma sequência de links (<a>) de uma quantidade pré-definida para que o visitante possa taxar, classificar, o conteúdo da página. Seu visual é totalmente customizável através de folhas de estilos (CSS).

O código está contido na própria página do exemplo, e para usá-lo basta instanciar o objeto definindo a quantidade de “estrelas” e adicioná-lo em alguma tag (append):

var r1 = new Rate(5);

r1.onclick = function() {

     // input here your action

     alert(r1.getValue());

}

r1.setDefault(3);

r1.append("example1");

Para visualizar o exemplo clique aqui.