Allow plugging with custom-crop, improvements

Michaël Villeneuve · Michaël Villeneuve · commit cf44ac00cc49 · 2017-08-21T10:00:39.000+02:00
diff --git a/README.md b/README.md
@@ -11,6 +11,11 @@ Features :
  - Flash
  - Easy to use base64 image
 
+ #### Can be easily plugged with [react-native-custom-crop](https://github.com/Michaelvilleneuve/react-native-custom-crop)
+
+
+ ![Demo crop gif](https://camo.githubusercontent.com/0ac887deaa7263172a5fd2759dba3d692e98585a/68747470733a2f2f73332d65752d776573742d312e616d617a6f6e6177732e636f6d2f6d69636861656c76696c6c656e657576652f64656d6f2d63726f702e676966)
+
 ## Getting started
 
 `$ npm install react-native-document-scanner --save`
@@ -34,7 +39,11 @@ class YourComponent extends Component {
     return (
       <View>
         <DocumentScanner
-          onPictureTaken={data => this.setState({ image: data.image })}
+          onPictureTaken={data => this.setState({
+            image: data.image,
+            initialImage: data.initialImage,
+            rectangleCoordinates: data.rectangleCoordinates,
+          })}
           overlayColor="rgba(255,130,0, 0.7)"
           enableTorch={false}
           brightness={0.3}
@@ -89,7 +98,7 @@ Enum (0, 1 or 2) corresponding to the type of rectangle found
 
 | Prop | Params | Type | Description |
 | :----------- |:-------:| :--------:| :----------|
-| onPictureTaken | `data` | `object` | Returns the captured image in an object `{ image: 'BASE64 string'}` |
+| onPictureTaken | `data` | `object` | Returns the captured image in an object `{ image: 'BASE64 string', initialImage: 'BASE64 string', rectangleCoordinates: 'object of coordinates' }` |
 
 
 
diff --git a/ios/DocumentScannerView.h b/ios/DocumentScannerView.h
@@ -1,11 +1,3 @@
-//
-//  DocumentScannerView.h
-//  DocumentScanner
-//
-//  Created by Marc PEYSALE on 22/06/2017.
-//  Copyright © 2017 Snapp'. All rights reserved.
-//
-
 #import "IPDFCameraViewController.h"
 #import <React/RCTViewManager.h>
 
diff --git a/ios/DocumentScannerView.m b/ios/DocumentScannerView.m
@@ -1,11 +1,3 @@
-//
-//  DocumentScannerView.m
-//  DocumentScanner
-//
-//  Created by Marc PEYSALE on 22/06/2017.
-//  Copyright © 2017 Snapp'. All rights reserved.
-//
-
 #import "DocumentScannerView.h"
 #import "IPDFCameraViewController.h"
 
@@ -25,8 +17,6 @@ - (instancetype)init {
         [self setBrightness: self.brightness];
         [self setSaturation: self.saturation];
 
-        NSLog(@"detectionCountBeforeCapture:  %ld", (long)self.detectionCountBeforeCapture);
-        NSLog(@"detectionRefreshRateInMS:  %ld", (long)self.detectionRefreshRateInMS);
 
         [self start];
         [self setDelegate: self];
@@ -50,10 +40,34 @@ - (void) didDetectRectangle:(CIRectangleFeature *)rectangle withType:(IPDFRectan
     }
 
     if (self.stableCounter > self.detectionCountBeforeCapture){
-        [self captureImageWithCompletionHander:^(id data) {
+        [self captureImageWithCompletionHander:^(UIImage *croppedImage, UIImage *initialImage, CIRectangleFeature *rectangleFeature) {
            if (self.onPictureTaken) {
-               NSData *imageData = UIImageJPEGRepresentation(data, self.quality);
-               self.onPictureTaken(@{@"image": [imageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength]});
+               NSData *croppedImageData = UIImageJPEGRepresentation(croppedImage, self.quality);
+
+               if (initialImage.imageOrientation != UIImageOrientationUp) {
+                   UIGraphicsBeginImageContextWithOptions(initialImage.size, false, initialImage.scale);
+                   [initialImage drawInRect:CGRectMake(0, 0, initialImage.size.width
+                                                , initialImage.size.height)];
+                   initialImage = UIGraphicsGetImageFromCurrentImageContext();
+                   UIGraphicsEndImageContext();
+               }
+               NSData *initialImageData = UIImageJPEGRepresentation(initialImage, self.quality);
+
+               /*
+                RectangleCoordinates expects a rectanle viewed from portrait,
+                while rectangleFeature returns a rectangle viewed from landscape, which explains the nonsense of the mapping below.
+                Sorry about that.
+                */
+               self.onPictureTaken(@{
+                                     @"croppedImage": [croppedImageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength],
+                                     @"initialImage": [initialImageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength],
+                                     @"rectangleCoordinates": @{
+                                             @"topLeft": @{ @"y": @(rectangleFeature.bottomLeft.x + 30), @"x": @(rectangleFeature.bottomLeft.y)},
+                                             @"topRight": @{ @"y": @(rectangleFeature.topLeft.x + 30), @"x": @(rectangleFeature.topLeft.y)},
+                                             @"bottomLeft": @{ @"y": @(rectangleFeature.bottomRight.x), @"x": @(rectangleFeature.bottomRight.y)},
+                                             @"bottomRight": @{ @"y": @(rectangleFeature.topRight.x), @"x": @(rectangleFeature.topRight.y)},
+                                             }
+                                     });
                [self stop];
            }
         }];
diff --git a/ios/IPDFCameraViewController.h b/ios/IPDFCameraViewController.h
@@ -43,7 +43,7 @@ typedef NS_ENUM(NSInteger, IPDFRectangeType)
 
 - (void)focusAtPoint:(CGPoint)point completionHandler:(void(^)())completionHandler;
 
-- (void)captureImageWithCompletionHander:(void(^)(id data))completionHandler;
+- (void)captureImageWithCompletionHander:(void(^)(UIImage *data, UIImage *initialData, CIRectangleFeature *rectangleFeature))completionHandler;
 
 @property (nonatomic, strong) UIColor* overlayColor;
 @property (nonatomic, assign) float saturation;
diff --git a/ios/IPDFCameraViewController.m b/ios/IPDFCameraViewController.m
@@ -323,7 +323,7 @@ - (void)focusAtPoint:(CGPoint)point completionHandler:(void(^)())completionHandl
     }
 }
 
-- (void)captureImageWithCompletionHander:(void(^)(id data))completionHandler
+- (void)captureImageWithCompletionHander:(void(^)(id data, id initialData, CIRectangleFeature *rectangleFeature))completionHandler
 {
     if (_isCapturing) return;
 
@@ -377,21 +377,24 @@ - (void)captureImageWithCompletionHander:(void(^)(id data))completionHandler
                  if (rectangleFeature)
                  {
                      enhancedImage = [self correctPerspectiveForImage:enhancedImage withFeatures:rectangleFeature];
+
+                     UIGraphicsBeginImageContext(CGSizeMake(enhancedImage.extent.size.height, enhancedImage.extent.size.width));
+                     [[UIImage imageWithCIImage:enhancedImage scale:1.0 orientation:UIImageOrientationRight] drawInRect:CGRectMake(0,0, enhancedImage.extent.size.height, enhancedImage.extent.size.width)];
+                     UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
+                     UIImage *initialImage = [UIImage imageWithData:imageData];
+                     UIGraphicsEndImageContext();
+
+                     [weakSelf hideGLKView:NO completion:nil];
+                     completionHandler(image, initialImage, rectangleFeature);
                  }
              }
 
-             UIGraphicsBeginImageContext(CGSizeMake(enhancedImage.extent.size.height, enhancedImage.extent.size.width));
-             [[UIImage imageWithCIImage:enhancedImage scale:1.0 orientation:UIImageOrientationRight] drawInRect:CGRectMake(0,0, enhancedImage.extent.size.height, enhancedImage.extent.size.width)];
-             UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
-             UIGraphicsEndImageContext();
-
-             [weakSelf hideGLKView:NO completion:nil];
-             completionHandler(image);
          }
          else
          {
              [weakSelf hideGLKView:NO completion:nil];
-             completionHandler(imageData);
+             UIImage *initialImage = [UIImage imageWithData:imageData];
+             completionHandler(initialImage, initialImage, nil);
          }
 
          _isCapturing = NO;
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
 {
   "name": "react-native-document-scanner",
   "description": "Scan documents, automatic border detection, automatic crop",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

Original file line number	Diff line number	Diff line change
`@@ -323,7 +323,7 @@ - (void)focusAtPoint:(CGPoint)point completionHandler:(void(^)())completionHandl`
`323`	`323`	`}`
`324`	`324`	`}`
`325`	`325`
`326`		`-- (void)captureImageWithCompletionHander:(void(^)(id data))completionHandler`
	`326`	`+- (void)captureImageWithCompletionHander:(void(^)(id data, id initialData, CIRectangleFeature *rectangleFeature))completionHandler`
`327`	`327`	`{`
`328`	`328`	`if (_isCapturing) return;`
`329`	`329`
`@@ -377,21 +377,24 @@ - (void)captureImageWithCompletionHander:(void(^)(id data))completionHandler`
`377`	`377`	`if (rectangleFeature)`
`378`	`378`	`{`
`379`	`379`	`enhancedImage = [self correctPerspectiveForImage:enhancedImage withFeatures:rectangleFeature];`
	`380`	`+`
	`381`	`+ UIGraphicsBeginImageContext(CGSizeMake(enhancedImage.extent.size.height, enhancedImage.extent.size.width));`
	`382`	`+ [[UIImage imageWithCIImage:enhancedImage scale:1.0 orientation:UIImageOrientationRight] drawInRect:CGRectMake(0,0, enhancedImage.extent.size.height, enhancedImage.extent.size.width)];`
	`383`	`+ UIImage *image = UIGraphicsGetImageFromCurrentImageContext();`
	`384`	`+ UIImage *initialImage = [UIImage imageWithData:imageData];`
	`385`	`+ UIGraphicsEndImageContext();`
	`386`	`+`
	`387`	`+ [weakSelf hideGLKView:NO completion:nil];`
	`388`	`+ completionHandler(image, initialImage, rectangleFeature);`
`380`	`389`	`}`
`381`	`390`	`}`
`382`	`391`
`383`		`- UIGraphicsBeginImageContext(CGSizeMake(enhancedImage.extent.size.height, enhancedImage.extent.size.width));`
`384`		`- [[UIImage imageWithCIImage:enhancedImage scale:1.0 orientation:UIImageOrientationRight] drawInRect:CGRectMake(0,0, enhancedImage.extent.size.height, enhancedImage.extent.size.width)];`
`385`		`- UIImage *image = UIGraphicsGetImageFromCurrentImageContext();`
`386`		`- UIGraphicsEndImageContext();`
`387`		`-`
`388`		`- [weakSelf hideGLKView:NO completion:nil];`
`389`		`- completionHandler(image);`
`390`	`392`	`}`
`391`	`393`	`else`
`392`	`394`	`{`
`393`	`395`	`[weakSelf hideGLKView:NO completion:nil];`
`394`		`- completionHandler(imageData);`
	`396`	`+ UIImage *initialImage = [UIImage imageWithData:imageData];`
	`397`	`+ completionHandler(initialImage, initialImage, nil);`
`395`	`398`	`}`
`396`	`399`
`397`	`400`	`_isCapturing = NO;`
Original file line number	Diff line number	Diff line change
`@@ -2,7 +2,7 @@`
`2`	`2`	`{`
`3`	`3`	`"name": "react-native-document-scanner",`
`4`	`4`	`"description": "Scan documents, automatic border detection, automatic crop",`
`5`		`- "version": "1.1.2",`
	`5`	`+ "version": "1.2.0",`
`6`	`6`	`"main": "index.js",`
`7`	`7`	`"scripts": {`
`8`	`8`	`"test": "echo \"Error: no test specified\" && exit 1"`