Posted by admin at Março 26th, 2007

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!!

Posted by admin at Março 23rd, 2007

Ae povo,

Vou começando devagar aqui no blog. Tô meio sem tempo por causa do “bendito” TCC, por isso vou postando soluções que eu já desenvolvi lá no fórum Imasters mas que não tiveram a merecida atenção. heheh
Agora o fórum da vez é o iEvolution. Postei esta solução lá. Visitem e tirem suas dúvidas sobre ela lá.

Bom, primeiramente vou postar algo que vai ajudar muito quem deseja parar de se preocupar com ajax.

Com esta minha função você não vai mais ficar se preocupando com instanciar, definir eventos de retorno, e toda aquela baboseira chata de 10 linhas que agente sempre tem que fazer na hora de usar o XMLHttpRequest.

Usem, testem e se tiverem algo a acrescentar, é só falar. Eu testei com sucesso no FF1.5 e no IE6.

Vantagens:

• Versão atual: 1.2
• Atualizações futuras:
  • Melhorar o carregamento de javascripts que vierem pelo ajax usando a solução do pita.
  • Melhorar a parte de enviar caracteres acentuados usando o encodeURI
• Forma de uso:
• Coloque a função em um arquivo javascript e chame ele na página através do <script src="micoxAjax.js">
• Chame a função assim: ajaxGet( sua_pagina [string] , variavel_ou_objeto_que_recebera_o_retorno [string ou object] , exibe_texto_carregando_ou_nao [true ou false])
• Exemplos de uso:
• Em um elemento qualquer:
  ajaxGet(”http://www.suapagina.com/seuarquivo.htm”,document.getElementById(”div1″),true)
• Em uma variável javascript:
  ajaxGet(”http://localhost/lojavirtualfree/optionas.htm”,”document.getElementById(’div2′).innerHTML”,false)
• Em um input text:
  ajaxGet(”http://localhost/lojavirtualfree/optionas.htm”,document.getElementById(”input1″),false)
• Em um select (preenche com options):
  ajaxGet(”http://localhost/lojavirtualfree/optionas.htm?viva”,document.getElementById(”select1″),true)

Enfim, a função. Copiem e colem ela em seu micoxAjax.js:

function ajaxGet(url,elemento_retorno,exibe_carregando){
/******
* ajaxGet - Coloca o retorno de uma url em um elemento qualquer
* Use a vontade mas coloque meu nome nos créditos. Dúvidas, me mande um email.
* A função é grande, coloque-a em um arquivo .js separado.
* Versão: 1.2 - 20/04/2006
* Autor: Micox - Náiron J.C.G - micoxjcg@yahoo.com.br - elmicox.blogspot.com
* Parametros:
* url: string; elemento_retorno: object||string; exibe_carregando:boolean
*  - Se elemento_retorno for um elemento html (inclusive inputs e selects),
*    exibe o retorno no innerHTML / value / options do elemento
*  - Se elemento_retorno for o nome de uma variavel
*    (o nome da variável deve ser declarado por string, pois será feito um eval)
*    a função irá atribuir o retorno à variável ao receber a url.
*******/
    var ajax1 = pegaAjax();
    if(ajax1){
        url = antiCacheRand(url)
        ajax1.onreadystatechange = ajaxOnReady
        ajax1.open("GET", url ,true);
        //ajax1.setRequestHeader("Content-Type", "text/html; charset=iso-8859-1");//"application/x-www-form-urlencoded");
        ajax1.setRequestHeader("Cache-Control", "no-cache");
        ajax1.setRequestHeader("Pragma", "no-cache");
        if(exibe_carregando){ put("Carregando ...")    }
        ajax1.send(null)
        return true;
    }else{
        return false;
    }
    function ajaxOnReady(){
        if (ajax1.readyState==4){
            if(ajax1.status == 200){
                var texto=ajax1.responseText;
                if(texto.indexOf(" ")<0) texto=texto.replace(/\+/g," ");
                //texto=unescape(texto); //descomente esta linha se tiver usado o urlencode no php ou asp
                put(texto);
                extraiScript(texto);
            }else{
                if(exibe_carregando){put("Falha no carregamento. " + httpStatus(ajax1.status));}
            }
            ajax1 = null
        }else if(exibe_carregando){//para mudar o status de cada carregando
                put("Carregando ..." )
        }
    }
    function put(valor){ //coloca o valor na variavel/elemento de retorno
        if((typeof(elemento_retorno)).toLowerCase()=="string"){ //se for o nome da string
            if(valor!="Falha no carregamento"){
                eval(elemento_retorno + '= unescape("' + escape(valor) + '")')
            }
        }else if(elemento_retorno.tagName.toLowerCase()=="input"){
            valor = escape(valor).replace(/\%0D\%0A/g,"")
            elemento_retorno.value = unescape(valor);
        }else if(elemento_retorno.tagName.toLowerCase()=="select"){
            select_innerHTML(elemento_retorno,valor)
        }else if(elemento_retorno.tagName){
            elemento_retorno.innerHTML = valor;
            //alert(elemento_retorno.innerHTML)
        }
    }
    function pegaAjax(){ //instancia um novo xmlhttprequest
        //baseado na getXMLHttpObj que possui muitas cópias na net e eu nao sei quem é o autor original
        if(typeof(XMLHttpRequest)!='undefined'){return new XMLHttpRequest();}
        var axO=['Microsoft.XMLHTTP','Msxml2.XMLHTTP','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.4.0','Msxml2.XMLHTTP.3.0'];
        for(var i=0;i<axO.length;i++){ try{ return new ActiveXObject(axO[i]);}catch(e){} }
        return null;
    }
    function httpStatus(stat){ //retorna o texto do erro http
        switch(stat){
            case 0: return "Erro desconhecido de javascript";
            case 400: return "400: Solicitação incompreensível"; break;
            case 403: case 404: return "404: Não foi encontrada a URL solicitada"; break;
            case 405: return "405: O servidor não suporta o método solicitado"; break;
            case 500: return "500: Erro desconhecido de natureza do servidor"; break;
            case 503: return "503: Capacidade máxima do servidor alcançada"; break;
            default: return "Erro " + stat + ". Mais informações em http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html"; break;
        }
    }
    function antiCacheRand(aurl){
        var dt = new Date();
        if(aurl.indexOf("?")>=0){// já tem parametros
            return aurl + "&" + encodeURI(Math.random() + "_" + dt.getTime());
        }else{ return aurl + "?" + encodeURI(Math.random() + "_" + dt.getTime());}
    }
}
function select_innerHTML(objeto,innerHTML){
/******
* select_innerHTML - altera o innerHTML de um select independente se é FF ou IE
* Corrige o problema de não ser possível usar o innerHTML no IE corretamente
* Veja o problema em: http://support.microsoft.com/default.aspx?scid=kb;en-us;276228
* Use a vontade mas coloque meu nome nos créditos. Dúvidas, me mande um email.
* Versão: 1.0 - 06/04/2006
* Autor: Micox - Náiron J.C.G - micoxjcg@yahoo.com.br - elmicox.blogspot.com
* Parametros:
* objeto(tipo object): o select a ser alterado
* innerHTML(tipo string): o novo valor do innerHTML
*******/
    objeto.innerHTML = ""
    var selTemp = document.createElement("micoxselect")
    var opt;
    selTemp.id="micoxselect1"
    document.body.appendChild(selTemp)
    selTemp = document.getElementById("micoxselect1")
    selTemp.style.display="none"
    if(innerHTML.toLowerCase().indexOf("<option")<0){//se não é option eu converto
        innerHTML = "<option>" + innerHTML + "</option>"
    }
    innerHTML = innerHTML.replace(/<option/g,"<span").replace(/<\/option/g,"</span")
    selTemp.innerHTML = innerHTML
    for(var i=0;i<selTemp.childNodes.length;i++){
        if(selTemp.childNodes[i].tagName){
            opt = document.createElement("OPTION")
            for(var j=0;j<selTemp.childNodes[i].attributes.length;j++){
                opt.setAttributeNode(selTemp.childNodes[i].attributes[j].cloneNode(true))
            }
            opt.value = selTemp.childNodes[i].getAttribute("value")
            opt.text = selTemp.childNodes[i].innerHTML
            if(document.all){ //IEca
                objeto.add(opt)
            }else{
                objeto.appendChild(opt)
            }
        }
    }
    document.body.removeChild(selTemp)
    selTemp = null
}

function extraiScript(texto){
//Maravilhosa função feita pelo SkyWalker.TO do imasters/forum
//http://forum.imasters.com.br/index.php?showtopic=165277&
    // inicializa o inicio ><
    var ini = 0;
    // loop enquanto achar um script
    while (ini!=-1){
        // procura uma tag de script
        ini = texto.indexOf('<script', ini);
        // se encontrar
        if (ini >=0){
            // define o inicio para depois do fechamento dessa tag
            ini = texto.indexOf('>', ini) + 1;
            // procura o final do script
            var fim = texto.indexOf('</script>', ini);
            // extrai apenas o script
            codigo = texto.substring(ini,fim);
            // executa o script
            //eval(codigo);
            /**********************
            * Alterado por Micox - micoxjcg@yahoo.com.br
            * Alterei pois com o eval não executava funções.
            ***********************/
            novo = document.createElement("script")
            novo.text = codigo;
            document.body.appendChild(novo);
        }
    }
}

A função oi postada originalmente aqui, com as devidas discussões e atualizações iniciais.
Agora postei ela aqui, onde devem prosseguir as discussões.

Té mais…

Posted by admin at Março 23rd, 2007

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.

Posted by admin at Março 22nd, 2007

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.

Posted by admin at Março 14th, 2007

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.