Setting a limit for drag

[dhardtke]

Hi,

is it currently possible to limit the drag, i.e. that the user can not drag a rectangle "out of the paper"?

Couldn't find an option.

Great plugin, really! :+1:

[AliasIO]

You're probably looking for the boundary option.

[dhardtke]

Then how do I use boundary? I have absolute no idea of what I should set there. I have no idea what x, y and width, height are doing there. Can you explain that to me / other people?

[AliasIO]

Actually by the default the boundary is the edges of the paper. You shouldn't be able to completely drag an element out of the paper unless you set boundary to false.

A boundary of { x: 0, y: 0, width: 100, height: 100 } keeps the handles within the top-left 100x100 square of the paper.

[dhardtke]

But that isn't even working for me: http://puu.sh/7vvyN.png

this.paper.freeTransform(shape, {
    keepRatio: [ 'axisX', 'axisY', 'bboxCorners', 'bboxSides' ],
    scale: true,
    rotate: false,
    snap: { scale: 10, drag: 20 },
    snapDist: { rotate: 0, scale: 10, drag: 10 },
    boundary: { x: 0, y: 0, width: 100, height: 100 }
});

What am I doing wrong?

UPDATE: Ok, I take that back.. I have no idea why, but it is actually working now.

[AliasIO]

Does this help?

http://jsfiddle.net/VCE2d/

[dhardtke]

Ok, I get it now.. although that is not what I really want. I want to restrict the drag, not the handles... I mean, I don't want to let the user drag my rectangle out of the paper (not even a little bit).

[AliasIO]

Right, there is no option for that. It's possibly using the asynchronous callback function but it's clunky:

http://jsfiddle.net/FvTR9/

[eduardodallmann]

please implement this feature