Howto – Como abrir pop-up com Javascript corretamente

HowTo: Veja como abrir janelas pop-up utilizando JavaScript de maneira correta.

Alguns podem pensar: “que besteira, isso é trivial, qualquer desenvolvedor com o conhecimento mais básico sabe fazer isso”.

Pois bem, acreditem, muitos fazem, mas poucos o fazem de maneira correta. Então vejamos.

———————————————————————————

Muitos usam um método errôneo para abrir um pop-up em suas páginas. Explico:

<a href=”#” mce_href=”#” onClick=”window.open(’/pagina.htm‘,’popup‘,’width=600,height=350‘)”>Abrir</a>

Neste caso, unicamente esta se criando um link com o texto ‘Abrir’, com suas cores pre-definidas e etc… porém a forma de abrir esta incorreta:

  1. As pessoas que não tem javascript ativo não irá ver nada, simplesmente clicam no link e nada irá acontecer.
  2. Os sistemas de buscas não conseguem indexar conteúdo de um link #.
  3. Não sabemos onde nos levará este link, simplesmente olhando na barra de status.
  4. Se pedir para abrir uma nova janela, ou nova aba, veremos a mesma página que estamos, sem nenhum conteúdo novo.
  5. ….

Resumindo, há muitos incovenientes em nossa página para uma coisa tão simples.

Para usarmos 100% o código de um pop-up seria correto usarmos dessa forma:

<a href=”/pagina.htm” target=”_blank” onClick=”window.open(this.href, this.target, ‘width=600,height=350‘); return false;”>Abrir</a>

Se não tiver o javascript ativo, o evento OnClick entra em ação, que vai reconhecer pelo elemento .this é um elemento href, e abrirá em um tamanho determinado.

Se falhar em abrir retornará um false no evento OnClick, e então o elemento <a> executaria sua função, abrindo a pagina.html em uma nova janela.

O que ganhamos com isso?

  1. Os usuários sem javascript terão acesso ao conteúdo.
  2. Os buscadores poderão rastrear a página.htm
  3. Poderemos saber onde o link nos levará, olhando a barra de status.
  4. Ao abrirmos em uma nova janela, se abrirá o conteúdo do link em uma janela de tamanho padrão.

Não custa nada fazer as coisas corretamente né?

Até a próxima.

HowTo: Vídeos do YouTube como proteção de tela

Howto: Transformando vídeos em proteção de telas.

P.S: Desculpe as imagens em espanhol, é de um PC recém comprando na Bolívia e não quis remover e nem traduzir o sistema.

Bem, a idéias é esta, utilizar vídeos, seja do YouTube, Google Vídeo, Meta Café e outros como protetor de telas.

Utilizaremos três aplicações, todas gratuitas, duas online:

1 – Devemos buscar o vídeo desejado no YouTube, por exemplo, copiamos usa URL e vamos até o site Keepvid para baixar o vídeo (Ao baixar, receberá a extensão .FLV):

Descargar video

2 – Depois de ter baixado o vídeo, vamos até Media Convert, fazemos upload do arquivo .FLV e como formato de saída, indicamos SWF. De um OK e espere que o sistema faça o upload e converta o arquivo.

Convertir archivo

3 – Instalamos InstantStorm e abrimos. Esta ferramenta serve para converter qualquer SWF em um protetor de telas. Na primeira aba que aparece, clique para criar um projeto, passo-a-passo:

InstantStorm

4 – Vai abrir o Wizard, ali completamos o título do protetor de telas, e logo teremos o SWF convertido. Também podemos escolher uma imagem que vai aparecer na hora de escolher a proteção de tela.

Wizard

5 – O passo seguinte será clicar em Finish. Próximo passo é exportar o instalador, clique em Create. La damos um nome e selecionamos algum local onde irá ser gerado o .EXE instalador. Automaticamente InstanStorm fará a compilação e em alguns segundos teremos o nosso arquivo.

Ai é só executar o arquivo, e selecionar a proteção de tela.

Howto: Querys mais simples em PHP.

Uma dica do Fábio Vedovelli de como você pode fazer para simplificar suas querys em PHP, vejamos.

Digamos que você tem um formulário extenso, onde diversos valores serão gravados no banco, é fácil se enrolar na recuperação dos valores do form e por algum motivo você acaba deixando algo sem preecher e fica quebrando a cabeça pra debugar qual foi o campo que não passado.

Para contornar este tipo de problema, basta ler a variável $_POST, que nada mais é do que um array com os nomes dos campos do form e seus valores, inseridos pelo visitante.

Suponhamos que seu form tenha os seguintes campos: nome, email, cidade e estado. Normalmente você faria da seguinte forma:

$query=”INSERT INTO suatabela (nome,email,cidade,estado) VALUES (‘$nome’,’$emai’l,’$cidade’,’$estado’)”;

Se o seu formulário tiver só esses campos, maravilha. Agora imagine um formulário com uns 50 campos? É bota trabalhão nisso… pois podemos facilmente fazer assim:

foreach($_POST AS $k => $v){
$query1[]=$k;
}
foreach($_POST AS $k => $v){
$query2[]=”‘$v'”;
}
$query=”INSERT INTO suatabela (“.implode(“,”,$query1).”) VALUES (“.implode(“,”,$query2).”)”;

Com isso, o nome dos campos do form serão inseridos, todos separados por vírgula dentro dos primeiros parênteses e seus valores inseridos também separados por vírgula dentro dos segundos parênteses.

Alguns cuidados a tomar:

1) Os campos na tabela do banco de dados devem ter o mesmo nome dos campos do formulário
2) Se você tiver algum hidden field cujo valor não deve ser gravado no banco, ou melhor, qualquer campo que não se queira que seja gravado no banco deve-se anular este valor ANTES do primeiro foreach, usando:

unset($_POST[’nome do campo’]).

É muito comum anular o nome do input type submit.

Best Practice: Select lentas, rápidas e super-rápidas.

Infelizmente nos dedicamos tanto na hora de desenvolver, que não nos aprofundamos nas características que oferecem cada ferramenta.

E as melhores práticas entram exatamente ai. Neste primeiro post desta categoria, vamos comentar sobre o uso do comando Select em uma base de dados Mysql, que com algumas otimizações podemos ter resultados bem mais rápidos.

Busca de Palavras

/* Muito rápida */
SELECT * FROM tabela WHERE MATCH (`campo`) AGAINST (‘palavra’)

/* Rápida */
SELECT * FROM tabela WHERE MATCH (`campo`) AGAINST (‘+palavra’ IN BOOLEAN MODE)

/* Lentas */
SELECT * FROM tabela WHERE RLIKE ‘(^| +)palavra($| +)’

/* Super lenta */
SELECT * FROM tabela WHERE RLIKE ‘([[:space:]]|[[:<:]])palavra([[:space:]]|[[:>:]])’

Busca de Conteúdo

/* Muito rápida */
SELECT * FROM tabela WHERE MATCH (`campo`) AGAINST (‘palavra*’ IN BOOLEAN MODE)

/* Rápida */
SELECT * FROM tabela WHERE FIELD LIKE ‘palavra%’

/* Lentas */
SELECT * FROM tabela WHERE MATCH (`campo`) AGAINST (‘*palavra*’ IN BOOLEAN MODE)

/* Super lenta */
SELECT * FROM tabela WHERE campo LIKE ‘%palavra%’

Número de registros

/* Muito rápida */
SELECT SQL_CALC_FOUND_ROWS * FROM tabla WHERE condición LIMIT 0, 10
SELECT FOUND_ROWS()

/* Rápida */
SELECT * FROM tabela WHERE condicao LIMIT 0, 10
SELECT COUNT(chave) FROM TABELA WHERE condicao

Fonte: PHP Mysql tips

Howto: Como fazer backup do Active Directory

Sem dúvida esta ai um assunto que é uma salvação de muitos empregos.

Backup/Restore do Active Directory no Windows 2000/2003

Por Fabiano de Santana, MCP – MCSA 2000 Security – MCSE 2000 Security – MCSA 2003

Quando fazemos o backup do Active Directory, o único tipo de backup suportado é o Normal. Esse tipo de backup faz uma cópia de todos os dados do servidor. Devemos fazer o backup do System State (Estado do Sistema) quando desejarmos fazer o backup do Active Directory.
Read More

Howto: Instalando o PHP 5 no Red Hat Enterprise 4

Mais um howto, agora de como instalar o PHP 5 em uma distribuição do Red Hat Enterprise 4. Note que o PHP 5 não é oficialmente suportado pela Red Hat, então utilize estas dicas por sua conta e risco.
=============================
1º Passo
=============================

Obter os pacotes:
# cd /tmp
# wget http://www.cyberciti.biz/files/lighttpd/rhel4-php5-fastcgi/php-5.1.4-1.esp1.src.rpm
# rpm -ivh php-5.1.4-1.esp1.src.rpm

OBS: Provalvelmente ao tentar instalar este pacote, reportará alguns erros de dependência como:

aspell-devel >= 0.50.0 is needed by php-5.1.4-1.esp1.i386
httpd-devel >= 2.0.46-1 is needed by php-5.1.4-1.esp1.i386
libstdc++-devel is needed by php-5.1.4-1.esp1.i386
pcre-devel >= 4.5 is needed by php-5.1.4-1.esp1.i386
libtool >= 1.4.3 is needed by php-5.1.4-1.esp1.i386

e outros… neste caso você deve resolver tais pendências antes, utilizando o YUM ou o UP2DATE.

# yum install bzip2-devel aspell-devel …. (todos os pacotes com pendência).

# up2date bzip2-devel aspell-devel …. (todos os pacotes com pendência)

=================================
2º Passo – Rebuild pacote RPM para RHEL – 32 bit
=================================

# cd /usr/src/redhat/SPECS
# rpmbuild -bb php.spec

OBS: no meu caso precisei instalar este pacote do rpm-build

Pacote: rpm-build-4.3.3-22_nonptl.i386.rpm (fácil de achar por ai)
# wget http://afs.caspur1.it/afs/italia/project/bigbox/e4/i386/latest/BigBox/RPMS/rpm-build-4.3.3-22_nonptl.i386.rpm

# rpm -ivh rpm-build-4.3.3-22_nonptl.i386.rpm

Ai sim, depois disso pode executar novamente o:

# rpmbuild -bb php.spec

A recompilação irá demorar alguns minutos…

=================================
3º Passo – Instalando os pacotes
=================================

Os pacotes .rpm estarão dentro do diretório: /usr/src/redhat/RPMS/i386

# cd /usr/src/redhat/RPMS/i386
# rpm -Uvh php*

Provavelmente irá reclamar de um pacote chamado php-pear. O pacote que você terá que localizar é o: php-pear-1.4.9-1.2.noarch.rpm

# wget http://hosting.xoxidemods.com/rpms/php-pear-1.4.9-1.2.noarch.rpm

Ai sim, agora você pode rodar novamente:

# rpm -Uvh php*

Ao terminar você já estará com o PHP instalado e configurado com seu Apache.

Fonte:
http://www.cyberciti.biz/tips/how-to-install-php5-redhat-enterprise-linux4.html
http://hosting.xoxidemods.com/rpms/

Howto: Yum no Red Hat Enterprise Linux 4

Depois de um bom tempo sem postar nada nesta categoria de HowTo, segue um tutorial que tive que implementar esta semana.

HowTo: Instalando o YUM no Red Hat Enterprise Linux 4

YUM significa Yellow dog Updater, Modified, trata-se de um software desenvolvido pela Duke University para ser um instalador, atualizador e removedor de pacotes RPM, semelhante ao apt-get do Debian.

Ele trata automaticamente as dependências de arquivos não sendo necessário ficar buscando e instalando as dependências manualmente, lógico que para ele fazer tudo sozinho todas as dependências tem que estar nos repositórios configurados na maquina.

Por padrão o Red Hat não vem com o YUM e sim o Up2date, que só baixa os arquivos dos repositórios oficiais da Red Hat, mediante ao pagamento é claro. Já com YUM não, você pode colocar diversas bases de pesquisa, ficando assim livre do up2date. Vamos la:

==================================
1º Passo – Instalação:
==================================

Baixe e instale a versão do YUM para Red Hat 4. É fácil de ser encontrado na web, basta procurar por: yum-2.4.2-0.4.el4.rf.noarch.rpm

Para fazer a instalação basta rodar o:
# rpm -hiv yum-2.4.2-0.4.el4.rf.noarch.rpm

Bem, pode acontecer alguns problemas de dependências, como:

Error: Failed dependencies:
python-elementtree is needed by yum-2.4.2-0.4.el4.rf.noarch
python-sqlite is needed by yum-2.4.2-0.4.el4.rf.noarch
urlgrabber is needed by yum-2.4.2-0.4.el4.rf.noarch

Então será necessário instalar estes outros pacotes (que também é fácil achar pela web). Vou colocar aqui uns links da onde eu baixei, mas quando você for fazer, pode não estar ativos, ai você pode localizar pelo google o nome do pacote:

Pacote: python-elementtree-1.2.6-7.el4.rf.i386.rpm
wget ftp://194.199.20.114/linux/dag/redhat/el4/en/i386/dag/RPMS/python-elementtree-1.2.6-7.el4.rf.i386.rpm
# rpm -hiv python-elementtree-1.2.6-7.el4.rf.i386.rpm

Pacote: python-sqlite-1.0.1-1.2.el4.rf.i386.rpm
wget ftp://194.199.20.114/linux/dag/redhat/el4/en/i386/dag/RPMS/python-sqlite-1.0.1-1.2.el4.rf.i386.rpm
# rpm -hiv python-sqlite-1.0.1-1.2.el4.rf.i386.rpm

Pacote: python-urlgrabber-2.9.7-1.2.el4.rf.noarch.rpm
wget ftp://194.199.20.114/linux/dag/redhat/el4/en/i386/dag/RPMS/python-urlgrabber-2.9.7-1.2.el4.rf.noarch.rpm
# rpm -hiv python-urlgrabber-2.9.7-1.2.el4.rf.noarch.rpm

Pronto, já está instalado, porém sem repositórios para fazer as buscas.

==================================
2º Passo – Configuração:
==================================

Vamos criar os arquivos a seguir, lembrando que todos dentro do /etc/yum.repo.d
Arquivo com nome dag.repo:

[dag]
name = Dag
enabled = 1
baseurl = http://dag.freshrpms.net/redhat/el4/en/$basearch/dag/
http = //ftp.heanet.ie/pub/freshrpms/pub/dag/redhat/el4/en/$basearch/dag/
gpgcheck = True

Arquivo com nome dries.repo:

[dries]
name=Extra RedHat EL 4 rpms dries – $releasever – $basearch
baseurl=http://apt.sw.be/dries/redhat/el4/en/$basearch/dries/RPMS
gpgcheck=1
enabled=1
gpgkey=http://dries.ulyssis.org/ayo/RPM-GPG-KEY.dries.txt

Arquivo com nome livna.repo:

[livna]
name=Fedora Core 4 – i386 – livna
baseurl=http://rpm.livna.org/fedora/4/i386/RPMS.lvn
failovermethod=priority

E por último o arquivo jpackage.repo:

[jpackage-generic]
name=JPackage (free), generic
mirrorlist=http://www.jpackage.org/jpackage_generic.txt
failovermethod=priority
gpgcheck=1
gpgkey=http://www.jpackage.org/jpackage.asc
enabled=1

Seguindo a mesma linha iremos montar o repositório dos arquivos liberados pela Red Hat e reunidos no projeto CentOS.

Criar um arquivo dentro do /etc/yum.repo.d com o nome de centos.repo:

[base]
name=CentOS-$releasever – Base
baseurl=http://mirror.centos.org/centos/4/os/i386/
gpgcheck=1

[updates]
name=Red Hat Linux $releasever – Updates
baseurl=http://mirror.centos.org/centos/4/os/i386/
gpgcheck=1

Criar um outro arquivo

Vamos rodar:

# yum clean all

Ele irá limpar todas as entradas do “banco de dados” do yum.

# yum check-update

Depois de alguns minutinhos o yum já foi em todos os repositórios, fez as conexões e montou um banco de dados com os arquivos que estão disponíveis para serem baixado da forma como conhecemos o Linux, LIVRE.

Fontes:
http://www.vivaolinux.com.br/artigos/verArtigo.php?codigo=6581
http://www.lupaworld.com/24527/viewspace_3008.html
http://www.sk360.info/wiki/articles/7/1/Install-yum-on-RHEL4/Page1.html
http://maimon-it.blogspot.com/2005/06/install-yum-on-redhat-enterprise-linux.html

Howto – Integrando TinyMCE com FCKEditor em JSP

FCKEditor e TinyMCE são editores HTML (WYSIWYG) muito poderosos. Que permitem serem integrados em sistemas adminstrativos de maneira muito satisfatória.

Entretando, o FCKEditor é muito grande, e o TinyMCE não possui um administrador de uploader livre (Ibrowser só funciona com PHP). Precisei implementar um sistema de notícias com características de upload de imagens na própria edição, foi então que encotrei o TinyFCK, como seu nome mesmo diz, é uma integração do TyneMCE com o admnistrador de upload do FCKEditor.

Realizei a integração com JSP com sucesso. Vamos as etapas:

Read More