OWOP Brush Script

// ==UserScript==
// @name         OWOP Brush Size
// @version      1
// @description  Adds brush size to OWOP
// @author       DayDun
// @match        http://ourworldofpixels.com/beta/*
// ==/UserScript==

window.addEventListener("load", function() {
    WorldOfPixels.events.onOnce("tools_rendered", function() {
        var brushSize = 1;

        var slider = document.createElement("input");
        slider.type = "number";
        slider.min = 1;
        slider.style.position = "absolute";
        slider.style.top = "280px";
        slider.style.left = "5px";
        slider.style.width = "50px";
        slider.style.boxSizing = "border-box";
        slider.value = 1;
        slider.addEventListener("input", function() {
            brushSize = parseFloat(this.value) || 1;
        });
        document.body.appendChild(slider);

        WorldOfPixels.tools[0].click = function(x, y, buttons, isDrag) {
            var tileX = this.camera.x + (x / this.camera.zoom);
            var tileY = this.camera.y + (y / this.camera.zoom);
            /* White color if right clicking */
            var color = buttons === 2 ? [255, 255, 255] : this.palette[this.paletteIndex];
            var b = brushSize / 2 - 0.5;
            for (var x=Math.floor(tileX - b); x<Math.ceil(tileX + b + 0.01); x++) {
                for (var y=Math.floor(tileY - b); y<Math.ceil(tileY + b + 0.01); y++) {
                    var pixel = this.getPixel(x, y);
                    if (pixel !== null && !(color[0] === pixel[0] && color[1] === pixel[1] && color[2] === pixel[2])) {
                        switch(buttons) {
                            case 1:
                            case 2:
                                this.undoHistory.push([x, y, [pixel[0], pixel[1], pixel[2]]]);
                                this.net.updatePixel(x, y, color);
                                break;
                            case 4:
                                this.addPaletteColor(pixel);
                                break;
                        }
                    }
                }
            }
        }.bind(WorldOfPixels);

        WorldOfPixels.updateClientFx = function(force) {
            var fxtileX = this.clientFx.x;
            var fxtileY = this.clientFx.y;
            var tileX   = this.mouse.worldX / 16;
            var tileY   = this.mouse.worldY / 16;
            var rgb = this.palette[this.paletteIndex];
            rgb = rgb[0] << 16 | rgb[1] << 8 | rgb[2];
            var tool = this.tools[this.toolSelected];
            if (fxtileX !== tileX || fxtileY !== tileY || force) {
                var valid = this.validMousePos(tileX, tileY);
                if (valid) {
                    this.clientFx.update(tool.fxType, tileX, tileY, {color: rgb});
                } else {
                    this.clientFx.update(-1, tileX, tileY, {color: rgb});
                }
                this.renderer.requestRender(1);
                return true;
            }
            return false;
        }.bind(WorldOfPixels);

        WorldOfPixels.renderer.renderFx = function(fx) {
            var camx = this.camera.x;
            var camy = this.camera.y;
            var context = this.renderer.animcontext;
            var cnvs = context.canvas;
            var time = this.renderer.time;
            var zoom = this.camera.zoom;
            var fl = Math.floor;

            var fxx = fl(fx.x * zoom) - camx * zoom;
            var fxy = fl(fx.y * zoom) - camy * zoom;

            if ((fxx < -zoom || fxy < -zoom
                 || fxx > cnvs.width || fxy > cnvs.height) && fx.type != 3) {
                return true;
            }

            switch(fx.type) {
                case 0:
                    context.globalAlpha = 0.8;
                    context.strokeStyle = fx.options.colorhex;
                    if (fx == WorldOfPixels.clientFx) {
                        context.strokeRect((Math.round(fx.x - brushSize / 2) - camx) * zoom, (Math.round(fx.y - brushSize / 2) - camy) * zoom, zoom * brushSize, zoom * brushSize);
                    } else {
                        context.strokeRect(fxx, fxy, zoom, zoom);
                    }
                    break;
                case 1:
                    var alpha = 1 - (time - fx.options.time) / 1000;
                    if (alpha <= 0) {
                        fx.delete();
                        break;
                    }
                    context.globalAlpha = alpha;
                    context.strokeStyle = fx.options.colorhex;
                    context.strokeRect(fxx, fxy, zoom, zoom);
                    return false;
                case 3:
                    var alpha = 1 - (time - fx.options.time) / 1000;
                    if (alpha <= 0) {
                        fx.delete();
                        break;
                    }
                    context.globalAlpha = alpha;
                    context.strokeStyle = "#000000";
                    context.strokeRect((fl(fx.x / 16) * 16 - camx) * zoom,
                                       (fl(fx.y / 16) * 16 - camy) * zoom,
                                       zoom * 16, zoom * 16);
                    return false;
            }
            return true;
        }.bind(WorldOfPixels);
    });
});