css image animation ascii

by secretgspot

HTML

<pre id="target"></pre>

CSS

#target{
    
    font-family: monospace;
    font-size:5px;
    line-height:0.5;
    letter-spacing: 0em;
}

JavaScript

// forked from demouth's "消えたり現れたり" http://jsdo.it/demouth/jb8w
// forked from demouth's "ASCII Art" http://jsdo.it/demouth/dxX2
setTimeout(function(){
    
    var img = document.createElement("img");
    
    img.onload = function(e){
        
        var aa = new AA();
        aa.init(img);
        aa.random = false;
        setInterval(function(){
            
            var master = [
                ["$","M","@"],
                ["M","W"],
                ["%","#"],
                ["8","9"],
                ["D","S","Q"],
                ["Z","V","E"],
                ["U","O","C"],
                ["b","d","k"],
                ["+","t","y"],
                ["(","/",")"],
                ["[","]"],
                ["i","l"],
                ["^","~"],
                ["`"],
                [" "]
            ];
            var p= Math.sin(new Date().getTime()*0.0015)*0.5+0.5;
            var i = 0, l = master.length;
            var max = ~~(l * p)+1;
            var list = [];
            for(;i<max;i++){
                
                list.push( AA.prototype._pickRandom(master[i+(l-max)]) );
                
            }
            AADot.prototype.stringList = list;
            
            
            
            AALine.prototype.toString = function(){
                
                var i = 0,
                    l = this.dots.length,
                    str = "";
                
                for(;i<l;i++){
                    if(i<p*l){
                    str += this.dots[i].toString();
                    }else{
                    str += (p<i/l-Math.random()*0.4) ? " " : this.dots[i].toString();
                    }
                }
                
                
                str += '\r\n';
                
                return str;
                
            };
            
            var str = aa.getString();
            
            document.getElementById("target").textContent  = str;
            
        },100);
   ...