Hopa. Algum código do Micox já te ajudou?? Chegou a sua vez de retribuir: ajude o Micox!!

No alto da minha modéstia, vendo inúmeros depoimentos de pessoas no Brasil e exterior que foram salvas por meus códigos, ganharam grana, desenvolveram benefícios para a humanidade, tiveram empregos mantidos, casamentos salvos, etc etc etc, resolvi também mendigar uma ajuda pois ninguém é de ferro né? hehehe

Antes que pensem que ganho dinheiro com o blog aqui, gostaria de falar que ele é como um passatempo e guardador de códigos pra mim. Os meus rendimentos com o AdSense aqui são uma piada, não cheguei nem nos 40 dólares. Nada anormal, visto que meu site não é visitado por paraquedistas do Google que clicam sem pensar e sim por gente inteligante que sabe onde está clicando.

Mas você pode me ajudar. "Como" ?

Formas de ajudar o Micox:

1) Design pro El Micox

"Sou designer e quero ajudar. Essa parada sua aqui é muito feia"

Faz um design ae. Bom, a estrutura de links é praticamente a mesma, só que eu quero colocar uns 5 links (um pouco mais importantes) na horizontal. Algo que tenha a ver com primatas e códigos. De fácil leitura. Você vai ganhar um link especial aqui no meu blog, tipo "design feito por fulano".
Todos que mandarem idéias terão elas postadas aqui (se quiserem, é claro) e linkadas para seu site/blog.

2) Facilidades pra cadastro

Muitos dos atuais fiéis daqui já sabem que eu detesto fazer sistema de cadastro, forms, inputs, etc. É um saco ter que mexer com validação, tanto server-side (php+banco de dados) quanto client-side (javascript), criar form, validar form, validar dados e por aí vai.

Andei pesquisando algumas bibliotecas PHP aí, mas muitas são complicadas demais ou só servem pra um tipo específico de site. O que eu quero é simples: facilidade na hora de fazer sistemas de cadastro no BD. Facilidades na validação, na geração do form e inputs, facilidade na hora de testar os tipos dos dados, tanto na parte do javascript quanto na parte do PHP.

Se você souber de algo, vai me ajudar muito.

3) Hospedagem e domínio

Cansei do blogger. É lento, sem recursos, difícil de mexer com comentários, etc etc etc ("etc é coisa de quem não tem neurônios suficientes" - dizia minha mãe). Atualmente já não me importo em perder meu Pagerank 4. É a vida, não posso ficar eternamente nesta lentidão aqui.

Primeiramente gostaria de informar que não tô afim de gastar 30 conto mensais e nem qualquer grana com hospedagem. Eu sei que existem outras empresas aí que fornecem o serviço por até 30 contos anuais e me interesso por isso. Mas já que hoje tô aqui pra pedir, não custa nada pedir ajuda aqui também né. Se você é dono de algum provedor, de alguma empresa que queira patrocinar o El Micox (e ter o devido banner aqui) as portas estão escancaradas.

4) Dinheiro na conta

Bom, se você quiser depositar uns 10 conto, 20 conto, ou quem sabe até uns 300 eu não vou achar ruim te passar os dados pra depósito na Caixa Econômica Federal não. Não custa nada. Lembre-se que eu já posso ter salvado seu emprego hhahehehehe.

Banco: Caixa economica
Operação: 13 (poupança)
Agencia: 1575
Conta: 00669424-3
Fav.: ieu mermo (Náiron JCG)

5) Não me encaixo em nenhum dos ítens acima

Ué então você tem 3 opções:

1. Comentar aí pra me deixar mais feliz em saber que tem gente que lê este blog
2. Reler o terceiro parágrafo desta postagem (abaixo da imagem), mas sem exageros. :assobiando:
3. Deixar um link textual pro El Micox ou fazer uma postagem agradecendo no seu blog/site
4. Colocar meu banner discreto no seu site (sério mesmo)
   

[modéstia off] Em breve, novos códigos pra salvar vossos empregos e vidas profissionais.[modéstia on]
Té mais povo.

Marcadores: bate-papo

Pesquisando sobre uns frameworks de JavaScript aí, achei outra página que considero interessante mostrar aqui.

Neste caso é dentro do site da Adobe (sim, a mesma que atualmente cuida do Flash). Bizarro de louco.

Trata-se de um dos efeitos da biblioteca para JavaScript da Adobe, o Spry. Lá na página deles você vê uma galera de outros efeitos interessantes (muito interessantes por sinal). Realmente dá uma cara de "flash" para as aplicações Web.

Pelo pouco que olhei, parece se tratar de uma biblioteca apenas para efeitos visuais, sem muitas facilidades pra tratamento de eventos, ajax, etc. Pra mim não irá servir muito, talvez algum de vocês se interesse.

Eu vou preferir a jQuery, indicada pelo Vitor Prado em minha postagem anterior. Estou me convertendo a ela. Amém!!

Marcadores: bate-papo, dicas, frameworks

Post rápido pra recomendar a todos que visitem o site do William Grasel.

Surpeendam-se com as potencialidades do JavaScript + CSS.

Teoricamente, JavaScript pode fazer quase tudo que outras linguagens fazem, contanto que não mexa com arquivos locais e nem com recursos de hardware da máquina.

Ainda aguardo o dia em que encontrarei (ou me indicarão) uma biblioteca/framework de javascript para facilidades de programação como efeitos em gráficos, etc. Assim como temos várias em Java e outras linguagens.

PS.: Ah, pra quem não percebeu em minhas postagens com código, eu instalei o Google Code Prettifier. Como eu não tô afim de sair indo em tooodos meus posts e alterando as tags 'pre' para receberem a class 'prettyprint' eu fiz uma pequena alteração e comentei a linha 'if (cs.me && cs.className.indexOf('prettyprint') >= 0)'.

Té logo povo.

Marcadores: acessibilidade, bate-papo, dicas

Hello micofriends.

Hoje vou me ativar um pouco novamente na comundade blogueira.

Há um tempo ae (muito tempo, diga-se de passagem), o brodi Vinicius Krolow me perguntou comé que eu trato meus visitantes. A vida corrida do cotidiano mundano atual da sociedade moderna consumista me impediu de postar a resposta antes ("blá, desculpa esfarrapada mico" heheh). Hoje, finalmente to postando a resposta hehe.

Imagem: a vida corrida do cotidiano.

A Érica Akira também me perguntou recentemente "Como eu blogo" (lá do Japão, olha só). Como eu considero os dois assuntos relacionados (e como sou preguiçoso), resolvi postar os dois memes juntos.

Bora lá mico. (PS.: Esse elemento bonito da foto aí de cima sou eu mesmo em momento de profunda concentração na resolução de um problema de JavaScript)

Como eu trato meus visitantes

Bom, podemos dizer que eu tenho 2 tipos de comentários: os que comentam sobre as postagens e os que perguntam coisas técnicas.

Primeiramente eu já informo que gosto de responder tudo. Se você já comentou alguma vez aí algo importante, pode voltar e olhar que o mico respondeu, agradeceu, etc, etc.

"Segundamente", graças as complicações do novo Blogger, quando alguém comenta, eu não tenho acesso ao email do "comentador", só ao perfil do blogger dele. E ainda tenho que dar sorte se quiser ver o blog da pessoa, pois, por padrão, o perfil do blogger de todo mundo é bloqueado até que seu dono libere. Uma porcaria. Não sai do blogger ainda pra não perder meu querido pagerankzinho.

Daí eu sou obrigado a responder só nos comentários mesmo. A não ser quando a pessoa me informa seu email. Daí eu respondo nos comentários e aviso no email da pessoa.

Quanto às perguntas técnicas, eu procuro redirecionar ao fórum, pois é um saco ter que ficar lendo código em comentário de blog (ou em email). Mas mesmo assim, eu tento acompanhar o desenvolvimento da pessoa até o final. Eu não abandono.

- "Por favor, me ajude com meu script mico"

Como eu blogo

Bom, aí já complica a parada.
Eu sou lento demais nesse negócio de escrever. É por isso que vocês não vêem tantos posts aqui no El Micox. Este post por exemplo, até o momento, está levando 1 hora pra ser escrito. Enfim, não tenho o dom de blogar. Não sei nem qualé a diferença dessas parada de pingbáquio, traquibáquio, crezebéquio, etc.

O motivo inicial (e até hoje) deste blog é eu postar alguns códigos que desenvolvo, tanto para servir para mim mesmo (como um repositório dos meus próprios códigos) quanto pra ajudar as pessoas do mundo em prol da paz mundial (a parte da paz mundial é brincadeira).

Quando eu faço um código muito bão, que sei que o pessoal é cheio de dúvida, que não tem muitas coisas parecidas na net, ou que vá facilitar o progresso da humanidade, eu vou e perco algumas horas minhas blogando aqui.
O mesmo vale pra algumas dicas interessantes e curiosidades que eu vejo na net.

Enfim, é um repositório de código pra mim e pra outros desenvolvedores.

Tenho preguiça de ficar explicando o código. Daí tento colocar bastante comentário nos scripts.

Já chega macaco, cansei de ler

Pra dar continuidadeo pros 2 memes eu chamo uma galera do JavaScript. Não sei se eles já blogaram alguns desses memes, mas tá aí o convite. Não é obrigatório postar, é só um convite hehe:

• Bernardo Rufino
• Julio Greff
• Cau Guanabara
• Leandro Vieira

Update: Lembrei de mais um brodi do JavaScript: Leandro Vieira.

Té mais micofriends.

Marcadores: bate-papo, meme

Ae, minha assinatura dos feeds do anieto2k tá sempre me trazendo ótimas novidades .

Dessa vez eu trago a vocês 2 coisas muito interessantes:

1. Javascript Developer Tools - Ferramenta online que te permite debugar e pausar seus Javascripts sem instalar nada. Isso é ótimo no desenvolvimento. Ainda te permite comprimir seu código (removendo espaços e enter'es) ou descomprimir (identando e colocando quebras de linha). Muito bom mesmo.
2. Teste de velocidade de seletores - O nome já diz tudo. Visite e veja.

Té a próxima povo.

Marcadores: dicas, javascript

Ae, post emergencial. Navegando em alguns blogs hoje, ví que um brodi blogueiro (leitor aqui do El Micox) tá precisando de help. É o Aldemir.

Se vc mora em São Paulo, o cara tá precisando de sangue.

O nome completo dele é Aldemir Silva Ferreira.

Beneficiência Portuguesa fica na Rua Maestro Cardim, número 769, no bairro do Paraíso.

Pra ver se vc pode doar ou não, dá uma olhada no post do meio-bit.

É a blogosfera fazendo algo bom em vez de só ficar falando mal da Microsoft.

Sem querer ser insensível mas o cara vai tá com um super-pagerank quando sair dessa (e vai sair) heheh. Sorte ae velho.

Marcadores: bate-papo

Olá povo, conforme prometido, tô postando aqui uma função pra você fazer upload bem parecido com ajax (não é ajax!!). Função simples e fácil de usar.
Ela faz um upload assíncrono, ou seja, não recarrega a página toda (assim como o AJAX).
Quem usa alguns serviços do google como o GMail ou o GooglePages já conhece este recurso muito bem.

Editado 14/01/09: Já há uma nova versão disponível.
Veja em webly.com.br/Micox/micoxUpload2.htm (ainda não está muito bem testada).
Veja os exemplos de uso em webly.com.br/Micox/micoxUpload2.htm

Upload usando apenas AJAX não é viável no ambiente da Internet pois, por motivos de segurança, os navegadores por padrão não dão acesso ao sistema de arquivos para o JavaScript (se quiser descobrir como ativar esta característica não padrão, leia aqui, mas acredito não ser muito útil ajax upload dessa forma).

Esta minha função utiliza técnicas que envolvem iframes, mas não vou dar explicações aqui não. Explicações sobre como desenvolvi a função serão dadas em um novo post. Este post aqui é só para o código.

Ah, sim, no próximo post mostrarei também uma função um pouco mais customizável já pra quem entende melhor de JavaScript.

Testado no Firefox 2.0, Internet Explorer 6.0 e Opera 9.1. Pelamordedeus, quem puder testar em outros navegadores aí e quiser citar a experiência, faça este favor à humanidade e cite a experiência nos comentários. Obrigado.

1) Coloque o código abaixo em um arquivo chamado micoxUpload.js

/* funçõezinhas padrão pra facilitar */
function $m(quem){
 //apelido só pra não ficar repetindo o document.getElementById
 return document.getElementById(quem)
}
function remove(quem){
 quem.parentNode.removeChild(quem);
}
function addEvent(obj, evType, fn){
 //o velho do elcio.com.br/crossbrowser
    if (obj.addEventListener)
        obj.addEventListener(evType, fn, true)
    if (obj.attachEvent)
        obj.attachEvent("on"+evType, fn)
}
function removeEvent( obj, type, fn ) {
  if ( obj.detachEvent ) {
    obj.detachEvent( 'on'+type, fn );
  } else {
    obj.removeEventListener( type, fn, false ); }
} 
/* a que faz o serviço pesado */
function micoxUpload(form,url_action,id_elemento_retorno,html_exibe_carregando,html_erro_http){
/******
* micoxUpload - Submete um form para um iframe oculto e pega o resultado. Consequentemente pode
*               ser usado pra fazer upload de arquivos de forma assíncrona.
* Use a vontade mas coloque meu nome nos créditos. Licença Creative Commons.
* Versão: 1.0 - 03/03/2007 - Testado no FF2.0 IE6.0 e OP9.1
* Autor: Micox - Náiron JCG - elmicox.blogspot.com - micoxjcg@yahoo.com.br
* Parametros:
* form - o form a ser submetido ou seu ID
* url_action - url pra onde deve ser submetido o form
* id_elemento_retorno - id do elemento que irá receber a informação de retorno
* html_exibe_carregando - Texto (ou imagem) que será exibido enquanto se carrega o upload
* html_erro_http - texto (ou imagem) que será exibido se der erro HTTP.
*******/

 //testando se passou o ID ou o objeto mesmo
 form = typeof(form)=="string"?$m(form):form;
 
 var erro="";
 if(form==null || typeof(form)=="undefined"){ erro += "O form passado no 1o parâmetro não existe na página.\n";}
 else if(form.nodeName!="FORM"){ erro += "O form passado no 1o parâmetro da função não é um form.\n";}
 if($m(id_elemento_retorno)==null){ erro += "O elemento passado no 3o parâmetro não existe na página.\n";}
 if(erro.length>0) {
  alert("Erro ao chamar a função micoxUpload:\n" + erro);
  return;
 }

 //criando o iframe
 var iframe = document.createElement("iframe");
 iframe.setAttribute("id","micox-temp");
 iframe.setAttribute("name","micox-temp");
 iframe.setAttribute("width","0");
 iframe.setAttribute("height","0");
 iframe.setAttribute("border","0");
 iframe.setAttribute("style","width: 0; height: 0; border: none;");
 /* Não usei display:none pra esconder o iframe
    pois tem uma lenda que diz que o NS6 ignora
    iframes que tenham o display:none */
 
 //adicionando ao documento
 form.parentNode.appendChild(iframe);
 window.frames['micox-temp'].name="micox-temp"; //ie sucks
 
 //adicionando o evento ao carregar
 var carregou = function() { 
   removeEvent( $m('micox-temp'),"load", carregou);
   var cross = "javascript: ";
   cross += "window.parent.$m('" + id_elemento_retorno + "').innerHTML = document.body.innerHTML; void(0); ";
   
   $m(id_elemento_retorno).innerHTML = html_erro_http;
   $m('micox-temp').src = cross;
   //deleta o iframe
   setTimeout(function(){ remove($m('micox-temp'))}, 250);
  }
 addEvent( $m('micox-temp'),"load", carregou)
 
 //setando propriedades do form
 form.setAttribute("target","micox-temp");
 form.setAttribute("action",url_action);
 form.setAttribute("method","post");
 form.setAttribute("enctype","multipart/form-data");
 form.setAttribute("encoding","multipart/form-data");
 //submetendo
 form.submit();
 
 //se for pra exibir alguma imagem ou texto enquanto carrega
 if(html_exibe_carregando.length > 0){
  $m(id_elemento_retorno ).innerHTML = html_exibe_carregando;
 }
 
}

2) Inclua (chame) este arquivo no seu HTML

<script type="text/javascript" src="micoxUpload.js"></script>

3) Os parâmetros na hora de chamar a função são:

1. form - o form a ser submetido ou o ID de algum form que queira submeter.
2. url_action - url pra onde deve ser submetido o form. Tem a mesma função do parâmetro "action" de um form.
3. id_elemento_retorno - id do elemento que irá receber a informação de retorno.
4. html_exibe_carregando - Texto (ou imagem) que será exibido enquanto se carrega o upload
5. html_erro_http - Texto (ou imagem) que será exibido se der erro HTTP.

4) Pronto. Agora você várias formas de ativar o upload assíncrono. Vou exemplificar aqui 3 formas dentre as várias possíveis:

4.1) Uso básico. Você chama o upload a partir de um button (ou um input-type-button) em um form qualquer:

<legend>Uso b&aacute;sico</legend>
  <form>
    <input type="file" name="nome_qualquer" />
    <div id="recebe_up_basico" class="recebe">&nbsp;</div>
    <button onClick="micoxUpload(this.form,'upa.php','recebe_up_basico','Carregando...','Erro ao carregar'); return false;" type="button">testa</button>
  </form>
</fieldset>

4.2) Ativando o upload quando o campo file perde o foco (onblur):

<fieldset>
<legend>Uso no blur do input</legend>
  <form>
    <input type="file" name="nome_qualquer" onblur="micoxUpload(this.form,'upa.php','recebe_up_onblur','Carregando...','Erro ao carregar')" />
    <div id="recebe_up_onblur" class="recebe">&nbsp;</div>
  </form>
</fieldset>

4.3) Agora uma forma que deixará seu form/upload acessível mesmo que o javascript esteja desabilitado:

<fieldset>
<legend>Uso não intrusivo</legend>
    <form action="upa.php" target="_blank">
    <input type="file" name="nome_qualquer" onblur="micoxUpload(this.form,'upa.php','recebe_up_3','Carregando...','Erro ao carregar')" />
    <div id="recebe_up_3" class="recebe">&nbsp;</div>
  </form>
</fieldset>

Pronto. Customize aí agora e bora "uploadar". Bugs, erros, comenta ae.
Por favor, DÚVIDAS SOMENTE NO FÓRUM !!

No próximo post, a explicação e uma versão mais customizável pra quem já entende de JavaScript.

Marcadores: ajax, javascript