Rectangular Distort

[MerionLial]

Please describe the desired behavior. The free distortion with 4 draggable corners is very cool and obviously the core feature of this plugin. In some cases though, I would prefer a rectangluar distortion as seen in many desktop programs when resizing an image. You know, like this :

Without the resizing which is of course it's own action, but I think you know what I mean. Basically stretching or compressing a rectangle along one axis.

Is this already possible with the current plugin or easily achievable by tweaking an existing Action? Or would this require a completely new implementation?

[jywarren]

We used to allow this by holding the shift key to "lock rotation" -- but the feature wasn't well documented and seems no longer to work. But, we'd gladly accept a PR for this modifier, as long as it could come with a test! Thanks!

[ghost]

@jywarren can i get informations about last commit it was used in ?? i would like to check it's code

[MerionLial]

@Ridaoui02 I did not find the time yet to try and a) find the old code or b) implement a new version. But I would still be very interested if you'd manage to re-implement something like this.

Maybe this can help to find to old code: https://stackoverflow.com/questions/4705517/github-searching-through-older-versions-of-files

[jywarren]

Hi, i'm not sure what the last commit was but it might have used an older event model than the present. What i can help with i hope is showing how to check for the shift key:

https://github.com/publiclab/Leaflet.DistortableImage/blob/20b6633866e7d5e0c2dcd6d33c9428c5dda6a38d/src/edit/handles/LockHandle.js#L52-L56

and for how to simulate shift key in a test, so as to protect and document this feature:

https://github.com/publiclab/Leaflet.DistortableImage/blob/20b6633866e7d5e0c2dcd6d33c9428c5dda6a38d/test/src/DistortableCollectionSpec.js#L58-L62

Ah but I'm realizing i misunderstood, i thought this was a request for 'hold shift key to lock rotation' but apologies i must've been confused somehow - i see this is 'scale in one dimension' --

i think for that we might need a new tool based on the scale tool, which would add new handles; you can see the scale tool handles here:

https://github.com/publiclab/Leaflet.DistortableImage/blob/20b6633866e7d5e0c2dcd6d33c9428c5dda6a38d/src/edit/handles/ScaleHandle.js

and so we'd want to add 4 extras which would work differently; we would also need a variant of scaleBy function here:

https://github.com/publiclab/Leaflet.DistortableImage/blob/20b6633866e7d5e0c2dcd6d33c9428c5dda6a38d/src/DistortableImageOverlay.js#L293-L314

(tested here: https://github.com/publiclab/Leaflet.DistortableImage/blob/20b6633866e7d5e0c2dcd6d33c9428c5dda6a38d/test/src/DistortableImageOverlaySpec.js#L245)

The new version could be called scaleXorY or scaleInOneDimension perhaps? Or scaleByXY(x,y) and allow 2 parameters, maybe?