dfa1234 / ngx-image-compress

Angular library for uploading and compressing images
https://image-library.app
MIT License
86 stars 37 forks source link

Add support for capture="environment" #114

Open e-knaake-covadis opened 1 month ago

e-knaake-covadis commented 1 month ago

I have a usecase where I want to use this library for image compression and my code is already structured around this library. Though now I have a requirement to open the camera from a PWA to upload a new file. HTML is starting to support capture="environment" for this.

Looking at the methods generateUploadInputRenderer and generateUploadInputNative where they both use a flag mutliple to add extra attributes I think it might be as easy as adding another flag for this.

Perhaps it is even possible to take an arbritary list of attributes to add to the input?

Could this library support this feature?

dfa1234 commented 3 weeks ago

That's sound like a good enhancement. However what do you think of this component? Maybe it's already exactly what the capture flag is doing meanwhile Also capture is only available on mobile, and this component is working for desktop as for mobile


<ngx-image-capture (imageCaptured)="getImageFromCamera($event)" (errorCapture)="getError($event)">
    <button openStreamBtn>Open video capture</button>
    <button acquireImageBtn>Take a picture</button>
</ngx-image-capture>```
e-knaake-covadis commented 3 weeks ago

Thanks for your swift reaction.

That could be an option, however I would have to restructure around emitting a file instead of an 'get an image'. (I now use NgxImageCompressService with uploadMultipleFilesOrReject and compressFile) Another downside is this does not use the native camera app, so things like focus and flash don't seem to be supported.

e-knaake-covadis commented 3 weeks ago

I have now decided to use the ngx-image-capture component. Thanks for your support, feel free to close this issue

e-knaake-covadis commented 2 weeks ago

I have looked into the component and noticed two issues:

  1. There is no way to override the facingMode, I would like to have the option to override the video constraints (at least with facingMode: {ideal: 'environment'} Maybe this could be a default parameter, or it could be an paramter which is destructured on top of the default image

  2. There always is a 100ms delay in the video starting to render, could this be shortened? Looking at the code I don't think it is necessary image