Help...

window.addEventListener("load", onLoad);

var canvas;
var context;
var myImage;
var blockSize = 100;
var x;
var y;
var frameCount = 0;

function onLoad(event)
{
    canvas = document.getElementById("mosaicCanvas");
    context = canvas.getContext("2d");
    myImage = document.createElement("img");
    myImage.src = "Mosaic/effect.jpg";

    animate();
}

//This is called 60 times per second, or once every frame.
function animate()
{
    frameCount++;
    blockSize = (frameCount % 64) + 1;
    if(blockSize < 1) blockSize = 1;
    context.fillStyle = "white";
    context.fillRect(0, 0, canvas.width, canvas.height);
    for(x = 0; x <= 799; x++){
        for(y = 0; y <= 599; y++){
            context.drawImage(myImage, x * blockSize, y * blockSize, blockSize, blockSize, x * blockSize, y * blockSize, blockSize, blockSize);
        }
    }

    //This tells us to run the animate() function again on the next frame.

    requestAnimationFrame(animate);
}