Canvas Animation - Run Through

blur-run-through.js

Blur.prototype.burn_ = function () {
    var time = (new Date()).getTime();
    var width = this.image.width;
    var height = this.image.height;
    if (!this.lastTime) this.lastTime = time;

    if (this.dragging) {
        var points = this.getAndProcessAffected();
        //var edgePoints = [];

        //Start the fire
        for (var i = 0, l = points.length; i < l; i++) {
            var pixel = this.pixels[points[i].x][points[i].y];

            if (!pixel.burned && !pixel.flame) {
                pixel.flame = 1;
                pixel.start = time;
            }
        }
    }

    //Burn
    for (var x = 0; x < width; x++) {
        for (var y = 0; y < height; y++) {
            pixel = this.pixels[x][y];

            if (pixel.flame > 0) {
                this.burnPoint_(pixel, time, width);
                if (!pixel.inactive && pixel.flame < 0.8 && pixel.flame > 0.4) {
                    this.spreadPoint_(pixel, time, width, height);
                }
            }
        }
    }

    this.lastTime = time;
    this.ctx.putImageData(this.blurPixels, 0, 0);
    requestAnimationFrame(this.burn_.bind(this), this.element_);
};