test apr 1

How does it work? Why Canvas and HTML5 video of course:

PLAIN TEXT

JAVASCRIPT:

1. 
   
    
   
   


2. 
   
       for (var i=0;i<12;i++){
   
   


3. 
   
           var can = document.getElementById('c'+(i+1));
   
   


4. 
   
           var ctx = can.getContext('2d');
   
   


5. 
   
           pieces_can.push(can);
   
   


6. 
   
           pieces_ctx.push(ctx);
   
   


7. 
   
       }
   
   


8. 
   
       i = setInterval(function(){
   
   


9. 
   
           var sWidth = dWidth = 160;
   
   


10. 
    
            var sHeight = dHeight = 120;
    
    


11. 
    
            dx = dy = 0;
    
    


12. 
    
            var source = document.getElementById('puzzle_image');
    
    


13. 
    
            for(var i=0;i<12;i++) {
    
    


14. 
    
                sx = (i*sWidth)%640;
    
    


15. 
    
                sy = ((Math.floor(i/4))*sHeight);
    
    


16. 
    
                pieces_ctx[i].drawImage(source, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);
    
    


17. 
    
            }
    
    


18. 
    
        }, 30);
    
    


19.