Ruan Carlos

Projeto de gente Grande | TheWebMind

Ruan Carlos — Wed, 01 Sep 2010 20:43:34 +0000

Olá galera, voltando a falar de projetos, eis aqui um projeto criado por dois Brasileiros (com B maiúsculo). É o TheWebMind.

O que consiste esse projeto?

O projeto é como se fosse um interpretador de linguagem natural. Através da linguagem mais próxima a falada pelos homens ele traduz e gera:

O código DDL

Alguns diagramas

Dicionário de dados

E até o código fonte

E a documentação?

Simplesmente excelente. Os nossos garotinhos estão de parabéns até aqui.

Bom, agora que você já conhece esse maravilhoso projeto, vai lá no site deles e confira o projeto.

Site: The Web Mind

Código: Google Code

Grupo: Google Groups

Doc: Doc

Atores: Felipe Nascimento e Jaydson (Esses garotos vão longe hem….)

Go Back function | Função para voltar página | jQuery

Ruan Carlos — Tue, 17 Aug 2010 20:03:23 +0000

Simples função para fazer a página voltar, funciona como o do JavaScript mas em jQuery:

JavaScript

    window.history.back();

jQuery

    $('.voltar').click(function() {
        history.back()
    });

Demo

Prevent Default Action | Previnindo ação padrão | JavaScript

Ruan Carlos — Thu, 12 Aug 2010 15:09:15 +0000

O preventDefault previne que uma ação ocorra, podemos considerar essa ação como seguir um link em algum , também podemos considerar o checar de um checkbox.

JavaScript

function evita(evento) {
    evento.preventDefault();
}

HTML

Site do Ruan (não segue)

Site do Ruan (segue)

Checkbox (não checa)

Checkbox (checa)

Também podemos usar ele no jQuery

jQuery

$("a").click(function(event) {
    event.preventDefault();
});

Para saber mais acesse:

Demo

Click to animate position | Animações em click | jQuery

Ruan Carlos — Tue, 10 Aug 2010 20:13:49 +0000

Dando início a nossa série de snippets.

jQuery

$(document).ready(function() {
    //evento onclick do a.next
    $('.next').click(function(e) {
        //movimento a div#foobar para a esquerda 1000px
        //left: é a propriedade left do css
        //1000 é o tempo em milisegundos = 1seg
        $('#foobar').animate({left: '-=1000px'}, 200);
        //e é o evento
        //preventDefault == return false | evita que siga o link ou a ação.
        e.preventDefault();
    });
    $('.previous').click(function(e) {
        //movimento a div#foobar para a esquerda 1000px
        $('#foobar').animate({left: '+=1000px'}, 200);
        e.preventDefault();
    });
})

HTML


    
        Coisas
    

    Esquerda - Direita

CSS

#foobar {
    background: black;
    border: 2px solid blue;
    width: 600px;
    height: 150px;
    /* necessário */;
    position: relative;
}

Demo

Novos rumos

Ruan Carlos — Tue, 10 Aug 2010 19:41:16 +0000

Olá pessoinhas, conforme anunciado anteriormente voltei =) porém muito atarefado =(. Mal me formei e já estou dando duro novamente. Pois é trabalhando das 8:00 às 22:00 de seg a sex, fora o sábado.

Mas tudo bem, vamos ao que nos interessa.

Queria dizer que agora esse blog terá vários outros focos e não só jQuery (já tinha antes mas não postava sobre esses assuntos), agora iremos ter uma área de Lab, onde eu postarei coisas em laboratório, novas e que ainda não funcionam direito =D você já pode conferir isso, meus experimentos com flush. Como vocês podem ver, eu ainda não consegui fazer o flush funcionar nesse servidor, mas um dia eu irei. Teremos também uma área destinada ao PHP (onde eu irei fazer certificação um dia) ao WordPress e a Snippets.

E ao invés de eu postar meus exemplos aqui nesse blog (diretamente) eu irei postar em um página separada ou no jsbin.com.

Então mãos a obra.

De volta com jQuery

Ruan Carlos — Fri, 16 Jul 2010 19:11:39 +0000

Opaaaaa galera, quanto tempo hem? 7 meses rsrs

Pessoinhas gostaria de agradecer a todos pela compreensão, sei que 7 meses sem uma atualização é muito tempo, mas foi necessário essa pausa.

Para os que não sabem, eu tive que parar esse tempo, pois estava desenvolvendo meu TCC (Otimização de Sites para Mecanismos de Busca) que foi aprovado com nota 9,0 na banca. (Yeap).

Devido a essa nota, terei que fazer algumas mudanças e imprimir em capa dura em letras douradas. Após isso a faculdade irá disponibilizar na biblioteca da faculdade (vou ficar famoso um dia).

Peço que ainda tenham um pouco de paciência que logo estaremos de cara nova e com muito conteúdo também.

Cordialmente

Ruan Carlos =D

jQuery 1.4 é lançado

Ruan Carlos — Thu, 14 Jan 2010 23:24:31 +0000

Ano novo, vida nova e nova versão do jQuery também. Hoje foi o dia do lançamento da nova versão do jQuery. Estamos na versão 1.4 agora.
Para seu lançamento a equipe do jQuery preparou um site 14 Days of jQuery que consiste em falar sobre a nova versão do jQuery em 14 dias. O lançamento foi feito ao vivo (pela internet) da AOL em Dulles, com direito a perguntas e respostas.
O jQuery já está no seu 4º aniversário e esta versão conta com bastante código, testes e documentação. É só ver como ficou o novo site da documentação do jQuery 1.4

Como sempre, existem duas versões:

jQuery Minified (23kb Gzipped)
jQuery Regular (154kb)

Mas você também pode usar o Google, caso não queira incluir a jQuery no seu site (servidor).

http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js

Vou fazer um apanhado das novas características.

Desempenho de métodos populares

Alguns dos métodos populares do jQuery foram reescritos, com isso teve um ganho de performance significante em comparação com a versão anterior.

No jQuery 1.4 foi reduzida a complexidade dos métodos mais populares.

Funções fáceis de setar

Agora algumas funções aceitam outras funções como parâmetro:

.css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .before(), .after(), .replaceWith(), .wrap(), .wrapInner(), .offset(), .addClass(), .removeClass(), e .toggleClass().

Algumas apenas como segundo parametro:

.css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .offset(), .addClass(), .removeClass(), e .toggleClass().

Ex:

// find all ampersands in A's and wrap with a span
$('a').html(function(i,html){
  return html.replace(/&/gi,'&');
});

// Add some information to the title of the anchors
$('a[target]').attr("title", function(i,title){
  return title + " (Opens in External Window)";
});

AJAX

Parametros aninhados (array)

Agora é permitido passar arrays por parâmetro via Ajax (para os programadores PHP e Ruby on Rails. Agora {foo: ["bar", "baz"]} é serelializado assim: “foo[]=bar&foo[]=baz”. No jQuery 1.3 era serelializado assim: “foo=bar&foo=baz”.

Contexto para uma requisição Ajax

jQuery.ajax({
    url: "test.html",
    context: document.body,
    success: function(){
        jQuery(this).addClass("done");
    }
});

Atributos

Performance do `.css()` e do `.attr()`

CORE

Rápida construção de elementos

Quando se cria um elemento com a função jQuery() agora você pode adicionar atributos e eventos algumas vezes.

jQuery("", {
    id: "foo",
    css: {
        height: "50px",
        width: "50px",
        color: "blue",
        backgroundColor: "#ccc"
    },
    click: function() {
       $(this).css("backgroundColor", "red");
    }
}).appendTo("body");

Novos métodos

.first() e .last(), que por conveniência são aliases ao .eq(1) e .eq(-1)
.toArray(), antigamente usava-se .get(), agora se pode usar o .toArray() – o .get() não entrou em desuso, aliás ele continua vivinho da Silva.

Bom este foi apenas um pequeno resumo das novas coisas que vem por ai, vá lá no site do lançamento do jQuery 1.4 e veja o que há de novo.

OBS: Em breve estaremos com o nosso portal de jQuery Brasil.
Faça uma visita em nossa lista. jQuery BR.

Maxlength em textarea com jquery

Ruan Carlos — Wed, 23 Dec 2009 17:39:24 +0000

Aeeee, quanto tempo né, rsrs. Faz parte, talvez este seja o último post deste ano, (caso seja, um feliz ano novo e feliz natal a todos).

A um tempo atrás eu fiz um post sobre como limitar o tamanho de inputs com jquery. Hoje eu irei mostrar como limitar o tamanho de textareas com um simples código jquery.

Sabemos que inputs do tipo text tem a propriedade maxlength e também sabemos que textareas não tem, mas com um código jquery podemos trabalhar como se existisse maxlength em textareas.

Para fazermos isso é simples.

Precisamos de um textarea com maxlength.

Após devemos adicionar no seu javascript o seguinte código:

$("textarea[maxlength]").keypress(function(event){
	var key = event.which;

	//todas as teclas incluindo enter
	if(key >= 33 || key == 13) {
		var maxLength = $(this).attr("maxlength");
		var length = this.value.length;
		if(length >= maxLength) {
			event.preventDefault();
		}
	}
});

Exemplo:

Por hoje é só rsr. Feliz Natal a todos.

limitInput | Limitando o tamanho de inputs | jQuery Plugin

Ruan Carlos — Thu, 19 Nov 2009 15:00:00 +0000

Olá pessoinhas…
Quanto tempo né? Pois é, a coisa anda meio difícil, culpa do TCC. Mas em breve tudo isso acaba, eu viro um Bacharel (ai quero que todo mundo me chame de doutor hauahuahu – zuera).

O limitInput é um plugin jquery desenvolvido pelo meu amigão Djalma Araujo. O cara além de ter uma das melhores hospedagens (pra mim é a melhor) ainda é desenvolvedor.

Mas o que faz isso?

Sabe o maxlength dos inputs (ou do textarea que não existe)? Então, este plugin trata esta “propriedade” com elegância.

Como faz?

Ex 1:

$("#limitInput-eg1").limitInput({
	//tamanho limite
	limit: 10,
	//permite ou nao escrever mais
	blockTyping: true,

	//traducao do texto que aparece quando ainda pode digitar
	charName: 'caracters',
	leftString: 'left',
	//texto que aparece quando passou o limite
	excededString: 'exceded'
});

Este exemplo limita a 10 caracteres digitados e bloqueia para que não seja mais digitado.
Digite:

Ex 2:

$("#limitInput-eg2").limitInput({
	//tamanho limite
	limit: 42,
	//permite ou nao escrever mais
	blockTyping: true,

	//traducao do texto que aparece quando ainda pode digitar
	charName: 'letras',
	leftString: 'restantes',
	//texto que aparece quando passou o limite
	excededString: 'excedidas'
});

Digite:
em pt

Visite o site do Djalma ou do plugin limitInput.

javascript levado a sério | jQuery

Ruan Carlos — Fri, 23 Oct 2009 18:23:18 +0000

Olá galera, a um tempo atrás eu postei aqui sobre uma palestra que o Jaydson do grupo de jquery Brasil iria fazer (Como fazer mais em aplicacoes ria escrevendo menos). Hoje eu venho lhes mostrar o belo trabalho dele. Ele fez uma palestra na data de ontem (22/10/2009) no Senac de Porto Alegre na III Mostra Científica. Ele é o cara (rsrs).

Um resumos segundo o próprio Jaydson:
“…Javascript é a linguagem de script mais popular da internet.
Porém, mesmo com toda essa fama, o Javascript ainda é incompreendido.
Segundo Douglas Crockford, um dos mestres da linguagem, essa incompreensão tem varias origens …”.

“…A palestra conta um pouco da história do Javascript, explicando o porque do prefixo JAVA no nome da linguagem entre outros detalhes. A palestra foca muito no desenvolvimento de Javascript profissional, como sugere o nome…”.

Agora veja os slides.

Javascript levado a serio

View more presentations from jaydson.

Javascript levado a sério.

Ruan Carlos

Projeto de gente Grande | TheWebMind

O que consiste esse projeto?

O código DDL

Alguns diagramas

Dicionário de dados

E até o código fonte

E a documentação?

Go Back function | Função para voltar página | jQuery

JavaScript

jQuery

Prevent Default Action | Previnindo ação padrão | JavaScript

JavaScript

HTML

jQuery

Click to animate position | Animações em click | jQuery

jQuery

HTML

CSS

Novos rumos

De volta com jQuery

jQuery 1.4 é lançado

Desempenho de métodos populares

Funções fáceis de setar

AJAX

Parametros aninhados (array)

Contexto para uma requisição Ajax

Atributos

Performance do .css() e do .attr()

CORE

Rápida construção de elementos

Novos métodos

Maxlength em textarea com jquery

limitInput | Limitando o tamanho de inputs | jQuery Plugin

Mas o que faz isso?

Como faz?

Ex 1:

Ex 2:

javascript levado a sério | jQuery

Performance do `.css()` e do `.attr()`