Exact move Raphael

used for groups more than this, but oh well

by Nathan Woods

HTML

<div id="canvas"></div>

JavaScript

var R = Raphael("canvas", 500, 500);    
R.setStart();
R.rect(100, 100, 50, 50).attr({
    fill: "hsb(.8, 1, 1)",
    stroke: "none",
    opacity: .5
});
var c = R.setFinish()
var start = function () {
    // storing original coordinates
    this.o = this.getBBox(); // this for obj
    c.attr({opacity: 1}); // this line does something to fix this method of dragging
},
move = function (dx, dy) {
    // move will be called with dx and dy
    moveExact(this, this.o.x + dx, this.o.y + dy); // pass this for obj
},
up = function () {
    // restoring state
    c.attr({opacity: .5});
    moveExact(this,Math.random()*200,Math.random()*200);
};

c.drag(move, start, up);

// works for sets!!!
function moveExact(obj, x, y) {
    var box = obj.getBBox();
    obj.transform('t'+(x-box.x)+','+(y-box.y) + '...');
}