Question

This function builds an NxN grid on a canvas and returns the layer for use. On mouseover, it changes the color of the cells. But what i need is to run mouseover only on mousedown, like a brush. How do I do it?

function buildGrid(config){
    var layer = new Kinetic.Layer(),i, j;
    for(i=0;i<config.y;i++){
        for(j=0;j<config.x;j++){
            (function(i,j){
                var cell = new Kinetic.Rect({
                    x: j * config.width,
                    y: i * config.height,
                    width: config.width,
                    height: config.height,
                    fill: "#00D2FF",
                    stroke: "black",
                    strokeWidth: 1
                })
                cell.on('mouseover',function(){
                    this.setFill('#F00');
                    layer.draw();
                });
                layer.add(cell)
            }(i,j));
        }
    }    
    return layer;
}

Answer 1

have you tried “dragmove” instead of “mouseover”?

---

what about having mousedown set a variable that is checked for by the mouseover code?