Pra quem não conhece, vale a pena dar uma olhada no link abaixo:
http://www.justbewise.net/matrix2.html
Daí eu fiquei pensando “Como será que o kra fez isso heim?” E daí comecei a juntar os conhecimentos (Javascript + ASCII + Ajax) e…. tcharam!!! Fiz um igual..srsr
Para fazer a sua própria animação, você vai precisar do convertor de imagens em ASCII, que pode ser encontrado aqui.
A dinâmica do filme é simplesmente inserir o conteúdo deste ASCII em uma div. No meu caso, eu deixei os arquivos externos e fiz uma função em javascript para ler arquivo por arquivo a cada meio segundo e exibir o conteúdo em uma div.
Se você tem um filme em .wma ou .mpg, o conselho é importá-lo no flash e depois exportar como sequencia de .jpgs. Após isso, para converter todas as imagens em ASCII, vá no menu File > Batch Conversion.
Após isso, insira uma div no seu documento com id=”exibe”.
A função javascript na página é essa:
function exibe(){
var div = document.getElementById(‘exibe’);
aa=n.toString();
if(aa.length==1){
aa=”000″+n.toString();
}else if(aa.length==2){
aa=”00″+n.toString();
}else if(aa.length==3){
aa=”0″+n.toString();
}else{
aa=n.toString();
} ajaxGet(‘ASCII-video’+aa+’.txt’,div,false); //div.innerHTML = replace(div.innerHTML,’n',’<br>’); if(n==220){
clearInterval(intId)
}else{
n++;
}
} intId = setInterval(exibe,90);
Agora, existe só um segredinho no carregamento do ajax para que o conteúdo apareça formatado da maneira correta, no nosso caso, texto é a variável que recebe o responseText do Ajax, devemos fazer um tratamento dele antes de jogá-lo na div, da seguinte maneira:
texto= ‘<pre><font face=”Courier New, Courier, mono” color=#000000 size=1>’+texto+’</font></pre></div>’;É isso aí, vale a pena fazer um filminho desses pra mostrar pra galera.
* A função ajax foi desenvolvida por micoX (http://elmicox.blogspot.com/)
