Luiz Paulo

[javascript] Jogo da velha em jQuery (tic tac toe)

Sempre quis fazer algum joguinho em javascript, então, resolvi fazer um Jogo da Velha, pois é relativamente simples.
Já havia feito um jogo da velha e um quebra cabeça em flash, mas não tem a mesma graça que em Javascript. hehe

Veja o jogo da velha aqui

Esse joguinho foi feito em jQuery está bem completo.
Com possibilidades de jogar sozinho ou contra o computador.

A inteligência do jogo está dividida em 3 níveis:
Fácil: Nesse nível o computador apenas joga na próxima casa (em ordem crescente).
Médio: No nível médio o computador joga aleatoriamente e bloqueia fechamento de jogos (quando estamos a uma jogada de ganhar o jogo).
Difícil: O difícil utiliza um algoritmo mais complexo com verificações de melhores jogadas, estratégias e etc.

Espero que gostem

Meu objetivo é continuar fazendo jogos, nos próximos farei em Canvas. Mais para refinar a tecnologia, hehe
Talvez até refaça o Jogo da velha nessa tecnologia.
O objetivo principal é fazer um xadrez, mas esse levará bastante tempo.

Categorias: Desenvolvimento web, JavaScript, Jogo
Tags: , exemplo, game, javascript, Jogo, jquery

Javascript – Pegadinha no parseInt()

Já estamos cansados de saber que javascript é totalmente dinâmico e podemos mudar facilmente o tipo das variáveis.

Uma das facilidades em javascript é a conversão de variáveis em inteiro, com a função parseInt().
Só que essa função tem uma pegadinha que pode atrapalhar bastante aos desatentos.

Sua sintaxe é bem simples como segue:

var number = "123456348965";
var integerNumber = parseInt(number);
alert(integerNumber); //123456348965

Nesse caso, tranquilo! Nenhum problema. Mas se, por exemplo, quisermos converter uma string "010" teremos problemas.
Veja o exemplo:

var number = "010";
var integerNumber = parseInt(number);
alert(integerNumber); //8

Isso acontece pois o número é automaticamente detectado como Octal.

Para resolver esse problema, a função parseInt pode receber 2 parâmetros.

parseInt(string, radix)
Onde:
string = String a ser transformada
radix = Numeral que você quer se basear (de 2 a 36)

Veja então como fica a solução para este problema:

var number = "010";
var integerNumber = parseInt(number, 10); //10 = base decimal
alert(integerNumber); //10

Pegadinha desvendada e problema resolvido!

Categorias: Desenvolvimento web, JavaScript, Linguagens
Tags: , code, javascript, pegadinha

CheatSheet – Guia rápido sobre Jquery 1.3.2

O Cheat Sheet é um resumo de um assunto específico que pode ser utilizada como guia rápido. Nele você pode encontrar sintaxes, códigos, exemplos, conceitos e dicas.
Não podemos considerá-lo um manual completo pois é bem compacto, mas quebra bastante o galho! Além de úteis, normalmente são feitos com visual agradável, podendo ser impresso e facilmente colado no seu escritório.

Postei a um tempo atrás o CheatSheet - Guia rápido sobre Jquery mas está desatualizado, então segue a documentação para o jQuery 1.3.2.

Cliquei aqui e baixe de uma vez!

Façam bom proveito!

Categorias: CheatSheet, Desenvolvimento web, JavaScript, Linguagens
Tags: , CheatSheet, jquery

Yahoo! Apresentação sobre eventos Javascript

Acabei de baixar uma ótima apresentação realizada pelo Yahoo sobre eventos javascript, fonte: quirksMode.
A apresentação contém 95 páginas falando apenas sobre eventos javascript.

Resumo da apresentação: Em todos os browsers temos más implementações quando falamos de eventos javascript. "Mó obaoba" rsrs

Se você é fanático em javascript como eu, não deixe de ler.

Categorias: Browser, Desenvolvimento web, JavaScript, Linguagens
Tags: , Browser, javascript

Javascript – Retirando espaços de string (função trim)

Veja abaixo algumas soluções para retirar espaços do início e final de strings.

Exemplos simples

Exemplo curto (funções com expressão regular):

//trim completo
	function trim(str) {
		return str.replace(/^\s+|\s+$/g,"");
	}
 
	//left trim
	function ltrim(str) {
		return str.replace(/^\s+/,"");
	}
 
	//right trim
	function rtrim(str) {
		return str.replace(/\s+$/,"");
	}
 
	alert(trim("           TEXTO          "));

Exemplo curto (métodos da string com expressão regular):
Essa solução é bem mais elegante!

	//trim completo
	String.prototype.trim = function () {
		return this.replace(/^\s+|\s+$/g,"");
	}
 
	//left trim
	String.prototype.ltrim = function () {
		return this.replace(/^\s+/,"");
	}
 
	//right trim
	String.prototype.rtrim = function () {
		return this.replace(/\s+$/,"");
	}
	alert("           TEXTO          ".trim());

Outras soluções

Exemplo longo

	function trim (str)
	{
		var whitespace = ' \n\r\t\f\x0b\xa0\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u200b\u2028\u2029\u3000';
		for (var i = 0; i < str.length; i++) 		{ 			if (whitespace.indexOf(str.charAt(i)) == -1) 			{ 				str = str.substring(i); 				break; 			} 		} 		for (i = str.length - 1; i >= 0; i--)
		{
			if (whitespace.indexOf(str.charAt(i)) == -1)
			{
				str = str.substring(0, i + 1);
				break;
			}
		}
	    return whitespace.indexOf(str.charAt(0)) == -1 ? str : '';
	}

Outro exemplo

	function isWhitespace(charToCheck) {
		var whitespaceChars = " \t\n\r\f";
		return (whitespaceChars.indexOf(charToCheck) != -1);
	}
 
	//left trim
	function ltrim(str) {
		for(var k = 0; k < str.length && isWhitespace(str.charAt(k)); k++); 		return str.substring(k, str.length); 	} 	//right trim 	function rtrim(str) { 		for(var j=str.length-1; j>=0 && isWhitespace(str.charAt(j)) ; j--) ;
		return str.substring(0,j+1);
	}
 
	//trim completo
	function trim(str) {
		return ltrim(rtrim(str));
	}

Caso queira se aprofundar no assunto, aconselho a leitura do artigo Faster JavaScript Trim que mostra vários testes de performance no IE e FF.

Façam bom proveito!

Categorias: Desenvolvimento web, JavaScript, Linguagens
Tags: , code, example, javascript, trim