Merge pull request #25 from ShawnPavel/feature/configurable-confirm-text

Add ability to change confirmation dialog text

Author: bradmartin

README.md

@@ -1,10 +1,12 @@
 <a align="center" href="https://www.npmjs.com/package/@nstudio/nativescript-camera-plus">
     <h3 align="center">NativeScript Camera Plus</h3>
 </a>
-<h4 align="center">A NativeScript camera with all the bells and whistles which can be embedded inside a view. This plugin was sponsored by <a href="https://liveshopper.com">LiveShopper<a></h4>
+<h4 align="center">A NativeScript camera with all the bells and whistles which can be embedded inside a view. This plugin was sponsored by LiveShopper</h4>
 
 <p align="center">
+<a href="https://liveshopper.com">
     <img align="center" src="./src/logos/liveshopper.png" alt="LiveShopper Logo"/>
+    <a>
 </p>
 
 <p align="center">
@@ -84,6 +86,8 @@ npm run demo.ng.android.device
 | --------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------------- |
 | **debug**             | boolean | If true logs will be output in the console to help debug the Camera Plus events.                                                       |
 | **confirmPhotos**     | boolean | If true the default take picture event will present a confirmation dialog before saving. Default is true.                              |
+| **confirmRetakeText** | string | When confirming capture this text will be presented to the user to retake the photo. Default is 'Retake'                                |
+| **confirmSaveText**   | string | When confirming capture this text will be presented to the user to save the photo. Default is 'Save'                                    |
 | **saveToGallery**     | boolean | If true the default take picture event will save to device gallery. Default is true.                                                   |
 | **galleryPickerMode** | string  | The gallery/library selection mode. 'single' allows one image to be selected. 'multiple' allows multiple images. Default is 'multiple' |
 | **showFlashIcon**     | boolean | If true the default flash toggle icon/button will show on the Camera Plus layout. Default is true.                                     |
@@ -92,6 +96,14 @@ npm run demo.ng.android.device
 | **showGalleryIcon**   | boolean | If true the choose from gallery/library icon/button will show on the Camera Plus layout. Default is true.                              |
 | **enableVideo**       | boolean | If true the CameraPlus instance can record video.                                                                                      |
 
+## Static Properties
+_Note: These properties need set before the initialization of the camera. Users should set these in a component constructor before their view creates the component if the wish to change the default values._
+
+| Name               | Type        | Description                                                                                                                                      |
+| ------------------ | ----------  | ------------------------------------------------------------------------------------------------------------------------------------------------ |
+| **enableVideo**    | boolean     | Video Support (off by default). Can reset it before using in different views if they want to go back/forth between photo/camera and video/camera |
+| **defaultCamera**  | CameraTypes | Defaults the camera correctly on launch. Default `'rear'`. `'front'` or `'rear'`                                                                 |
+
 ## Android Only Properties
 
 | Name                 | Type    | Description                                                                                 |
@@ -117,14 +129,14 @@ npm run demo.ng.android.device
 | **toggleFlash()**                            | Toggles the flash mode on the active camera.                                                                                                                |
 | **toggleCamera()**                           | Toggles the active camera on the device.                                                                                                                    |
 | **chooseFromLibrary(opts?: IChooseOptions)** | Opens the device gallery (image library) for selecting images.                                                                                              |
-| **takePicture()**                            | Takes a picture of the current preview in the CameraPlus.                                                                                                   |
-| **getFlashMode(): string**                   | Android: various strings possible: https://developer.android.com/reference/android/hardware/Camera.Parameters.html#getFlashMode() iOS: either 'on' or 'off' |
+| **takePicture(opts?: ICaptureOptions)**      | Takes a picture of the current preview in the CameraPlus.                                                                                                   |
+| **getFlashMode(): string**                   | Android: various strings possible: https://developer.android.com/reference/android/hardware/Camera.Parameters.html#getFlashMode() iOS: either `'on'` or `'off'` |
 | **record(opts?: IVideoOptions)**             | Starts recording a video.                                                                                                                                   |
 | **stop()**                                   | Stops the video recording, when stopped the `videoRecordingReadyEvent` event will be emitted.                                                               |
 
 ## Android Only Public Methods
 
-| Method                                                  | Description                                                                                                                                         |
+| Method                                                  | Description                                                                                                                                       |
 | ------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
 | **requestCameraPermissions(explanationText?: string)**  | Prompts the user to grant runtime permission to use the device camera. Returns a Promise<boolean>.                                                  |
 | **hasCameraPermission()**                               | Returns true if the application has been granted access to the device camera.                                                                       |
@@ -137,6 +149,41 @@ npm run demo.ng.android.device
 
 | Name                    | Description                                                        |
 | ----------------------- | ------------------------------------------------------------------ |
+| **errorEvent**          | Executes when an error is emitted from CameraPlu                   |
 | **photoCapturedEvent**  | Executes when a photo is taken.                                    |
 | **toggleCameraEvent**   | Executes when the device camera is toggled.                        |
 | **imagesSelectedEvent** | Executes when images are selected from the device library/gallery. |
+| **videoRecordingStartedEvent** | Executes when video starts recording. |
+| **videoRecordingFinishedEvent** | Executes when video stops recording but has not process yet. |
+| **videoRecordingReadyEvent** | Executes when video has completed processing and is ready to be used. |
+
+
+## Option Interfaces
+```TS
+export interface ICameraOptions {
+  confirm?: boolean;
+  saveToGallery?: boolean;
+  keepAspectRatio?: boolean;
+  height?: number;
+  width?: number;
+  autoSquareCrop?: boolean;
+  confirmRetakeText?: string;
+  confirmSaveText?: string;
+}
+```
+```TS
+export interface IChooseOptions {
+  width?: number;
+  height?: number;
+  keepAspectRatio?: boolean;
+}
+```
+
+```TS
+export interface IVideoOptions {
+  confirm?: boolean;
+  saveToGallery?: boolean;
+  height?: number;
+  width?: number;
+}
+```

demo-ng/app/capture/capture.component.html

@@ -2,29 +2,30 @@
 </ActionBar>
 <ScrollView>
 	<GridLayout rows="250, auto, *">
-
-		<CameraPlus debug="true" 
+		<CameraPlus height="250" debug="true" 
 			galleryPickerMode="single" 
 			showFlashIcon="true" 
 			showToggleIcon="true" 
 			showCaptureIcon="true" 
 			showGalleryIcon="true"
+			confirmSaveText="CONFIRM!"
+			confirmRetakeText="RETAKE!"
 			(loaded)="camLoaded($event)" 
 			(toggleCameraEvent)="toggleCameraEvent($event)" 
 			(photoCapturedEvent)="photoCapturedEvent($event)"
 			(imagesSelectedEvent)="imagesSelectedEvent($event)">
 
-			<!-- OVERLAY CONTENT-->
-			<GridLayout rows="*, auto, *" columns="*, auto, *">
+			<!-- OVERLAY CONTENT -->
+			<!-- <GridLayout rows="*, auto, *" columns="*, auto, *">
 				<GridLayout colSpan="3" class="bg-overlay"></GridLayout>
 				<GridLayout row="1" class="bg-overlay"></GridLayout>
 				<GridLayout row="1" col="2" class="bg-overlay"></GridLayout>
 				<GridLayout row="2" colSpan="3" class="bg-overlay"></GridLayout>
 				<Label row="1" col="1" class="overlay-label" text="📷➕"></Label>
 				<Image src="https://d2odgkulk9w7if.cloudfront.net/images/default-source/default-album/nativescript.png" row="1" col="1" stretch="aspectFill"
-				    class="overlay"></Image>
+				    class="overlay" width="20" height="20"></Image>
 				<Image src="res://nativescript" row="1" col="1" stretch="aspectFill" class="overlay"></Image>
-			</GridLayout>
+			</GridLayout> -->
 
 		</CameraPlus>
 

src/camera-plus.android.ts

@@ -1200,6 +1200,8 @@ export class CameraPlus extends CameraPlusBase {
    */
   private async _finishSavingAndConfirmingPicture(options: ICameraOptions, data) {
     let confirmPic;
+    let confirmPicRetakeText;
+    let confirmPicSaveText;
     let saveToGallery;
     let reqWidth;
     let reqHeight;
@@ -1209,6 +1211,8 @@ export class CameraPlus extends CameraPlusBase {
     const density = utils.layout.getDisplayDensity();
     if (options) {
       confirmPic = options.confirm ? true : false;
+      confirmPicRetakeText = options.confirmRetakeText ? options.confirmRetakeText : this.confirmRetakeText;
+      confirmPicSaveText = options.confirmSaveText ? options.confirmSaveText : this.confirmSaveText;
       saveToGallery = options.saveToGallery ? true : false;
       reqWidth = options.width ? options.width * density : 0;
       reqHeight = options.height ? options.height * density : reqWidth;
@@ -1360,7 +1364,11 @@ export class CameraPlus extends CameraPlusBase {
     CLog('nativeFile', nativeFile);
 
     if (saveToGallery === true && confirmPic === true) {
-      const result = await CamHelpers.createImageConfirmationDialog(data).catch(ex => {
+      const result = await CamHelpers.createImageConfirmationDialog(
+        data,
+        confirmPicRetakeText,
+        confirmPicSaveText
+      ).catch(ex => {
         CLog('Error createImageConfirmationDialog', ex);
       });
 

src/camera-plus.common.ts

@@ -79,6 +79,16 @@ export abstract class CameraPlusBase extends ContentView implements CameraPlusDe
    */
   @GetSetProperty() public confirmPhotos: boolean = true;
 
+  /**
+   * When confirming capture this text will be presented to the user to retake the photo. Default is 'Retake'
+   */
+  @GetSetProperty() public confirmRetakeText?: string;
+
+  /**
+   * When confirming capture this text will be presented to the user to save the photo. Default is 'Save'
+   */
+  @GetSetProperty() public confirmSaveText?: string;
+
   /**
    * If true the default videorecordingready event will present a confirmation dialog. Default is false.
    */
@@ -298,6 +308,8 @@ export interface ICameraOptions {
   height?: number;
   width?: number;
   autoSquareCrop?: boolean;
+  confirmRetakeText?: string;
+  confirmSaveText?: string;
 }
 
 export interface IChooseOptions {