purple_ghost

Paint Pro v0.0.1

var canvas, ctx,
    brush = {
        x: 0,
        y: 0,
        color: '#000000',
        size: 1,
        down: false,
    },
    strokes = [],
    currentStroke = null;

function init () {
    canvas = $('#draw');
    canvas.attr({
        width: window.innerWidth,
        height: window.innerHeight,
    });
    ctx = canvas[0].getContext('2d');

function mouseEvent (e) {
        brush.x = e.pageX;
        brush.y = e.pageY;

currentStroke.points.push({
            x: brush.x,
            y: brush.y,
        });

redraw();
    }

canvas.mousedown(function (e) {
        brush.down = true;

currentStroke = {
            color: brush.color,
            size: brush.size,
            points: [],
        };

strokes.push(currentStroke);

mouseEvent(e);
    }).mouseup(function (e) {
        brush.down = false;

mouseEvent(e);

currentStroke = null;
    }).mousemove(function (e) {
        if (brush.down)
            mouseEvent(e);
    });

$('#undo-btn').click(function () {
        strokes.pop();
        redraw();
    });

$('#clear-btn').click(function () {
        strokes = [];
        redraw();
    });

$('#color-picker').on('input', function () {
        brush.color = this.value;
    });

$('#brush-size').on('input', function () {
        brush.size = this.value;
    });
}

$(init);