non-square selections

[chirgwin]

@alexk111 For your consideration, I've made some changes to allow for (non-square) rectangular selections (which I plan on implementing soon, along with some tests). This mostly involved moving geometry getters/setters away from being center-point centric. Behavior of current circle and square selections should be identical.

I've also added a property for binding the image data (RGBa pixel array), since we have a need to further process pixels from the crop selection. The alternative would be to externally convert the existing imageURI back into an RGBa pixel array, which we could live with.

[leveler]

Just curious about this pull request. It would be really helpful.

[mladenplavsic]

I'm planning to use ngImgCrop and allowing selection other than square/circle would be great!

[alexk111]

Sorry for the delayed response.
Thank you for the proposed feature! Tested and it didn't work for me. It produces the error on my side:

Error: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.
    at Error (native)
    at getResultImage (http://localhost:9000/compile/unminified/ng-img-crop.js:1008:57)
    at updateResultImage (http://localhost:9000/compile/unminified/ng-img-crop.js:1271:37)
    at http://localhost:9000/compile/unminified/ng-img-crop.js:1314:11
    at http://localhost:9000/compile/unminified/ng-img-crop.js:1291:15
    at k.$eval (http://localhost:9000/bower_components/angular/angular.min.js:112:319)
    at k.$apply (http://localhost:9000/bower_components/angular/angular.min.js:113:48)
    at http://localhost:9000/compile/unminified/ng-img-crop.js:1290:19
    at http://localhost:9000/bower_components/angular/angular.min.js:123:78
    at e (http://localhost:9000/bower_components/angular/angular.min.js:37:497) 

It shows the crop area, but doesn't allow to get the cropped image (produces that error each time I try to access it).

[levydev]

@jonny2779 . Thanks for this. Its working great now. I'll look for your pull request however installing from bower was painless.
Cheers!

[joncodo]

I've just been swamped. Should have time soon.

Sent from my iPhone

On Apr 8, 2015, at 7:20 PM, dlevy [email protected] wrote:

@jonny2779 . Thanks for this. Its working great now. I'll look for your pull request however installing from bower was painless.
Cheers!

—
Reply to this email directly or view it on GitHub.

[levydev]

Is there any way to configure the rectangle for a fixed ratio This would allow the user to drag the corner but not change the ratio as the relative size changes.

Or perhaps the set a fixed dimension like 1500 by 300 and then only allow the user to move the rectangle around without resizing it.

thanks

[joncodo]

Currently there is not but I promised another girl I would add it in. New baby. Full time work, contracts on the side... You know how it is 😄

[levydev]

Are you referring to maintaining a configured aspect ratio as the rectangle stretches? I suppose the control would perform more like the one for area-type="square" ( resizing maintains aspect ratio)

Can you give a rough estimate? Days/weeks/months out? I'm trying to convince product mgmt to go with your latest solution. I can eyeball the rectangle as I stretch it and easily make it work in our app. However since it is possible for someone to completely mess up the aspect ratio, I'm getting some push back.

Anyway, I think this is a huge improvement nonetheless.

Congrats on the baby!

[joncodo]

@alexk111 Are you still merging PRs? is it worth my time to get this all up to date? IE are you here to merge it in when the time comes?

[levydev]

@jonny2779
Found some regression in js-ng-img-crop that I have not see in the fork from port-chaw.
When using the circular cropper ( suspect the same from square) , not all images keep the 1:1 aspect ratio.

For example, try the attached image. Stretch the cropper to the max. The image gets severely distorted after cropping.

[kavka3]

Hi, are there some news about configuration of the rectangle fixed ratio?

[csvan]

@jodonnell-broadsoft - I am wondering about the maintenance status of this project as well. Since my current employer depends on it, I would be open for a collaborative fork if this is no longer being maintained.

[joncodo]

@csvan I feel like this is the best option out there. Using my fork and the work of the others in this thread, you should be able to get it going. I'm on skype as jon.c.odonnell if you want to chat more about it.

[joncodo]

However, I feel like this repo is no longer maintained. But not sure.

[csvan]

I opened an issue about it, for now I will just go through your fork.

[chirgwin]

@csvan @jodonnell-broadsoft Amen. We've got production software depending on our fork of this repo. I don't have time to own/maintain a fork at present, but I'd gladly contribute to an actively maintained fork.

[uxtx]

I've moved on from this project, and am now using a custom built directive I rolled for https://github.com/fengyuanchen/cropper. Will work to publish it shortly, but it does non square selections.

[CrackerakiUA]

Checkout my fork: https://github.com/CrackerakiUA/ngImgCropFullExtended

[hugomn]

@CrackerakiUA your fork still rendering square results for rectangle crops.
Any news on an active PR or fork with rectangle crops working? Looks like work is disperse here.

[CrackerakiUA]

@hugomn have you checked this codepen? http://codepen.io/Crackeraki/pen/zvWqJM

[hugomn]

@CrackerakiUA yes, this example works. But I need a rectangular area without ratio. In this codepen http://codepen.io/Crackeraki/pen/XmEdPx the result is always square.

[CrackerakiUA]

@hugomn ok, i see your point. I have added it as future fix, if you want subscribe on mine fork, i will fix it as soon as possible.

[hugomn]

@CrackerakiUA cool, I'll do. Have you submitted a PR to alex111/ngImgCrop? I thing it's better for us to concentrate efforts here.

[CrackerakiUA]

i have.

[hugomn]

Great! @alexk111 any updates on any of PR's being merged?

[CrackerakiUA]

@hugomn If you have any other idea that will be useful for this plugin, please tell me.

[evdoks]

@CrackerakiUA -thanks for the fork!
I've noticed, that when I 'hit' the cropping rectangle against the borders of the original image (e.g., drag it to the left till the end), the cropping rectangle reduces its the size.
Also, with images, where the height is significantly larger than the width, I can't move the rectangle all the way to the bottom.

[CrackerakiUA]

@evdoks thanks for your testing and bugs report.
If you speak about rectangle where aspect ratio is not setted, then it has to be this way. I didn't build this but i like it. I will add option to disable it.
About heigher image, i saw the problem and added it to bug list.

[evdoks]

@CrackerakiUA The behaviour with the size of the rectangle being changed when it reaches a bottom/upper/right side of the image is also happening when the aspect-ratio parameter is set - check your Codepen. The original ngImgCrop does not behave like that. This is demo Jsfiddle from the original ngImgCrop.

[CrackerakiUA]

@evdoks crop area get smaller, is how the fork build and want to be. I will add option to disable that.

[NickBogdanov]

Hi guys. Thanks for this module. This work pretty good.
But when you can merge this Pull request. I need this functionality for my project.

[chirgwin]

@NickBogdanov We're using @CrackerakiUA's fork and I'd recommend it to you or anyone who needs this functionality.

[mike-suggitt]

I've moved on to other stuff since this unfortunately but FWIW I can dig out my branch that includes a number of additional features such as both non-square cropping, aspect ratios, and dynamic resizing for responsive websites.