jQuery resetDefaultValue plugin

Posted on August 1, 2007 by leandro

Desenvolvi um simples plugin para a jQuery, resetDefaultValue, com o intuito de limpar e resgatar o atributo value definido em elementos do tipo input. Embora, o plugin também funciona em elementos do tipo textarea.

Tal plugin foi desenvolvido com duas intenções:

Precisei para um projeto em que estou envolvido;
Decidir compartilhar com quem utiliza a jQuery;

Código do jQuery resetDefaultValue plugin

/**
 * jQuery resetDefaultValue plugin
 * @version 0.9.1
 * @author Leandro Vieira Pinho 
 */
jQuery.fn.resetDefaultValue = function() {
	function _clearDefaultValue() {
		var _$ = $(this);
		if ( _$.val() == this.defaultValue ) { _$.val(''); }
	};
	function _resetDefaultValue() {
		var _$ = $(this);
		if ( _$.val() == '' ) { _$.val(this.defaultValue); }
	};
	return this.click(_clearDefaultValue).focus(_clearDefaultValue).blur(_resetDefaultValue);
}

Forma de uso do jQuery resetDefaultValue plugin

$(function() {
	$('input').resetDefaultValue(); // for all input elements
	$('input.className').resetDefaultValue(); // for some elements
	$('#q').resetDefaultValue(); // for a especific element
	$('input[@type=text]').resetDefaultValue(); // avoid button/reset/submit buttons
	$('textarea').resetDefaultValue(); // work with textarea too
});

Revista iMasters #2

Posted on July 26, 2007 by leandro

Em março deste ano, falei a respeito da Revista iMasters aqui no Blog. Como a edição é trimestral, neste mês de Julho, temos a segunda edição da Revista iMasters.

Meu exemplar já está a caminho, quanta ansiedade. Não só pelo conteúdo da revista, que já comprovou sua excelência na primeira edição, mas também pelo fato da minha contribuição com um artigo. Que fala sobre Desenvolvimento e Padronização Web: A objetividade e preocupação no desenvolvimento de recursos de sistemas web com foco no usuário.

A edição de julho da Revista iMasters traz como matéria de capa uma visita à McCann Erickson para um estudo completo do case Prisma, considerado um divisor de águas em integração de mídias no Brasil.

Suzana Apelbaum, da África, fala tudo na entrevista, enquanto a seção equipe visita a Agência Espalhe, pioneira em Marketing de Guerrilha no Brasil. Acompanhe muito mais nesta edição.

Minha sugestão é que você acesse o site da revista agora, e adquira a sua. Lembre que a edição é limitada.

Um abraço.

jQuery tem me poupado consideráveis linhas de código

Posted on July 25, 2007 by leandro

A biblioteca de JavaScript jQuery, tem me poupando consideráveis linhas de código. Meu tempo, cada dia que passa, se torna mais escasso. Então, quando posso codificar menos e viver mais, a felicidade é tamanha que você nem imagina.

Vou demonstrar o pedaço de um código que eu havia codificado alguns meses utilizando a freeDOM.js, e hoje, resolvi refazê-lo utilizando a jQuery. Observe:

Pedaço de código utilizando a freeDOM.js

...
var arrTagInput, i, tagInput;
arrTagInput = $tags('input');
for (i = 0; i < arrTagInput.length; i++) {
	tagInput = arrTagInput[i];
	if ( (tagInput.getAttribute('id') !== null && tagInput.getAttribute('id') !== '') && tagInput.getAttribute('id').match(/^sbt-cart-update([0-9]+)$/) ) {
		tagInputId = tagInput.getAttribute('id');
		$remove($(tagInputId));
	}
}
...

Pedaço de código utilizando a jQuery.

...
$('input[@id*=sbt-cart-update]').remove();
...

Sim, somente.

Meu objetivo com ambos os códigos é selecionar todos os elementos input da página, com os elementos selecionados, irei filtrá-lo, pegando apenas aqueles que contenham em seu atributo ID o seguinte: "sbt-cart-update".

Satisfeito.

É ímpar ou par? Confira facilmente usando o PHP

Posted on June 1, 2007 by leandro

Utilizando o seguinte código:

$status = (1 & $number) ? 'Ímpar' : 'Par';

Verificamos se o número informado é ímpar ou par, simples ou não?

Leia o original Odd and Even Numbers

Curso de Dreamweaver Avançado

Posted on May 29, 2007 by leandro

Estou ministrando aulas de Dreamweaver no iPED Premier através do Curso de Dreamweaver Avançado.

O curso é totalmente on-line, contendo exercícios e exemplos práticos. Criei o curso com uma metodologia voltada para os padrões da web, tableless e o desenvolvimento web em camadas.

Acredito que você, leitor deste blog, tem conhecimento sobre a ferramenta. Sendo assim, ajude-me divulgando o Curso de Dreamweaver Avançado para seus amigos

Conteúdo do Curso:

* Definição de uma página web estática
* Conhecendo o HTML/XHTML
* As diferenças entre o XHTML e o HTML
* O Dreamweaver e a forma como ele trabalha com o HTML e o XHTML
* Funcionamento e a sintaxe da CSS
* Uma visão sobre a web semântica
* Uma visão sobre o desenvolvimento web em camadas
* Explorando a interface do Dreamweaver
* O Painel de preferências do Dreamweaver
* Como Como definir sites e projetos no Dreamweaver
* Criando uma página no Dreamweaver
* Salvando arquivos no Dreamweaver
* As opções de visualização de arquivos do Dreamweaver
* Pré-visualização de páginas
* Visualização de meta-tags e informações de cabeçalho do documento
* Inserindo imagens no Document window
* Inserindo placeholder no Document window
* Como alterar um placeholder por uma imagem
* Edição de imagens com o Dreamweaver
* Inserindo conteúdos do Flash no Dreamweaver
* Sobre a inserção de vídeos Flash no Dreamweaver
* Criando formulários HTML
* Visão geral sobre acessibilidade em formulários web no Dreamweaver
* Compreendendo o caminho das páginas
* Criando mapas de imagens
* Tipos de mídias nas CSS
* Como inter-relacionar a camada de apresentação à camada de conteúdo
* Sobre o painel Behaviors
* Os eventos mais utilizados no desenvolvimento web
* Sobre os padrões da web e a metodologia tableles
* Planejando a criação de um mini-site
* Validando o formulário de contato – camada de comportamento
* Configuração FTP

Como evitar conflitos com a função dólar $() de frameworks JavaScript

Posted on May 23, 2007 by leandro

Praticamente todos os frameworks JavaScript possuem a função dólar $(); e cada um deles com suas peculiaridades. O que significa dizer que em certos momentos conflitos entre essas funções ocorrerão.

Alguns frameworks oferecem soluções para que tal conflito seja evitado; consulte a documentação de cada framework e aplique-a.

Recentemente, precisei utilizar o jQuery para utilizar alguns efeitos que ele oferece, e como desenvolvi todo o projeto utilizando a freeDOM, o conflito entre as funções dólar $() de ambos os frameworks foi inevitável.

Para impedir que a função dólar $() do jQuery entre em conflito com outros frameworks, utilize a seguinte solução:

var $j = jQuery.noConflict();
//ou
var $foo = jQuery.noConflict();
//ou
var $comoQuiser = jQuery.noConflict();

Para quem utiliza o Spry (alguém utiliza?) a indicação é renomear a função $() para Spry.$(); também é possível fazer o processo reverso, ou seja:

var $ = Spry.$;

A freeDOM, ainda não pensei neste aspecto, mas levaremos esse detalhe no próximo release.

Como definir uma categoria padrão no Tasks

Posted on May 10, 2007 by leandro

Através do novo gerenciador de categorias do Tasks é possível definir uma categoria padrão, definir a posição (ordem) de cada categoria, criar uma categoria, atualizar as categorias existentes ou deletá-las. Todo esses recursos estão em uma única tela, e são utilizados de forma simples e intuitiva.

Como definir uma categoria padrão no Tasks

Na opção Gerenciar minhas categoiras, é demonstrado todas as categorias do usuário em questão; possibilitando editar os nomes e posição (ordem) de todas as categorias em uma única vez. Isso facilita a edição múltipla (ou não) das categorias desejadas. Ao lado direito dos campos a um ícone, ilustrado por uma lixeira, que é utilizado para excluir uma categoria.

A ordenação das categorias no Tasks ocorrem através da posição (ordem) e tal ordenação é feita de forma crescente. O que significa dizer que a categoria com o menor número será sua categoria padrão.

A categoria padrão é selecionada, e por conseguinte as listas relacionadas a ela, ao acessar sua conta no Tasks.

Já na opção Criar nova categoria, informamos um nome para a categoria a ser criada. A posição (ordem) dessa nova categoria é criada automaticamente, tendo 0 (zero) como valor.

Tasks acabou de sair do forno

Posted on May 6, 2007 by leandro

Nesses últimos dias, estive envolvido no desenvolvimento do Tasks e como ele acabou de sair do forno, vim contar a novidade para todos.

Preview do Tasks

Tasks é um aplicativo web simples e gratuito que irá ajudá-lo a ser mais produtivo em seu dia-a-dia. O objetivo do tasks é que você tenha Produtividade Pessoal; criando listas de tarefas, organizando-as por categorias e gerenciando os itens pendentes e concluídos de cada lista.

O Tasks se encontra em versão BETA e há alguns recursos a serem desenvolvidos, durante os próximos dias definirei as prioridades no desenvolvimento.

Crie sua conta no tasks e lembre-se que toda e qualquer sugestão será muito bem-vinda.

Em outros posts falarei com mais detalhes sobre e alguns recursos utilizados para o desenvolvimento do Tasks.

[update]Lançado o Tasks Blog[/update]

Boas técnicas de SEO garantem 1º lugar no Google, com apenas 2 dias

Posted on April 20, 2007 by leandro

No dia 17 deste mês publiquei o artigo, Função em PHP para exibir datas por extenso, e no dia 19 do mesmo mês, Abril, ele já se posicionou em primeiro lugar no resultado de busca do Google através do termo: php exibir data por extenso e em segundo lugar através do termo: exibir data por extenso.

O que significa dizer que em apenas 2 dias, o artigo que exibe a função se posicionou frente aos 11.500 e 56.000, respectivamente. Bom? Ótimo.

Em resumo, técnicas de SEO quando bem aplicadas são garantia de bom posicionamento. Isto é, boas técnicas de SEO garantem 1º lugar no Google, com apenas 2 dias. E o melhor de tudo é que tal posicionamento foi feito ao acaso, não tive a intenção de me posicionar em tal posição e com tais termos. De qualquer forma, fico feliz com o resultado.

Algumas imagens da página de resultado do Google (não levei os demais buscadores em consideração).

Resultdo da busca por “php exibir data por extenso”

Resultdo da busca por “exibir data por extenso”

Função em PHP para exibir datas por extenso

Posted on April 17, 2007 by leandro

Abaixo há uma função em PHP para exibir datas por extenso no seguinte formato: [Nome do dia da semana], [dia do mês] de [Nome do mês] de [Ano com 4 dígitos]. Um exemplo: Terça-feira, 17 de Abril de 2007.

Para utilizá-la proceda assim:

echo formata_data_extenso('2007-04-17');
echo formata_data_extenso('2007-04-17 15:20:35');

Essa função é muito útil quando se deseja formatar as datas armazenadas em um banco de dados MySQL, por exemplo; em que elas estão armazenadas no formato date, datetime ou timestamp.

Já falhei por aqui sobre Formatar as datas do MySQL com SQL ou PHP. O código da função segue abaixo:

/**
 * Esta função retorna uma data escrita da seguinte maneira:
 * Exemplo: Terça-feira, 17 de Abril de 2007
 * @author Leandro Vieira Pinho [http://leandro.w3invent.com.br]
 * @param string $strDate data a ser analizada; por exemplo: 2007-04-17 15:10:59
 * @return string
 */
function formata_data_extenso($strDate)
{
	// Array com os dia da semana em português;
	$arrDaysOfWeek = array('Domingo','Segunda-feira','Terça-feira','Quarta-feira','Quinta-feira','Sexta-feira','Sábado');
	// Array com os meses do ano em português;
	$arrMonthsOfYear = array(1 => 'Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro');
	// Descobre o dia da semana
	$intDayOfWeek = date('w',strtotime($strDate));
	// Descobre o dia do mês
	$intDayOfMonth = date('d',strtotime($strDate));
	// Descobre o mês
	$intMonthOfYear = date('n',strtotime($strDate));
	// Descobre o ano
	$intYear = date('Y',strtotime($strDate));
	// Formato a ser retornado
	return $arrDaysOfWeek[$intDayOfWeek] . ', ' . $intDayOfMonth . ' de ' . $arrMonthsOfYear[$intMonthOfYear] . ' de ' . $intYear;
}

Comentários para melhoria são bem-vindos.

Leandro Vieira Pinho´s Blog

Just another WordPress weblog

Author Archives: leandro

jQuery resetDefaultValue plugin

Revista iMasters #2

jQuery tem me poupado consideráveis linhas de código

É ímpar ou par? Confira facilmente usando o PHP

Curso de Dreamweaver Avançado

Como evitar conflitos com a função dólar $() de frameworks JavaScript

Como definir uma categoria padrão no Tasks

Tasks acabou de sair do forno

Boas técnicas de SEO garantem 1º lugar no Google, com apenas 2 dias

Função em PHP para exibir datas por extenso