Improve the demos ensuring permissions requested before taking a picture.

Author: Dimitar Tachev

demo-angular/app/app.component.html

@@ -4,8 +4,5 @@
         <Switch [(ngModel)]="saveToGallery"></Switch>
     </StackLayout>
     <Image row="1" [src]="cameraImage" stretch="fill" margin="10"></Image>
-    <StackLayout orientation="horizontal" row="2" padding="10">
-        <Button text="Take Picture" (tap)='onTakePictureTap($event)'></Button>
-        <Button text="Request Permissions" (tap)='onRequestPermissionsTap()'></Button>
-    </StackLayout>
+    <Button text="Take Picture" (tap)='onTakePictureTap($event)' row="2" padding="10"></Button>
 </GridLayout>

demo-angular/app/app.component.ts

@@ -14,32 +14,30 @@ export class AppComponent {
     public cameraImage: ImageAsset;
 
     onTakePictureTap(args) {
-        takePicture({ width: 180, height: 180, keepAspectRatio: true, saveToGallery: this.saveToGallery })
-        .then((imageAsset: any) => {
-            this.cameraImage = imageAsset;
-
-            // if you need image source
-            let source = new ImageSource();
-            source.fromAsset(imageAsset).then((source) => {
-                let width = source.width;
-                let height = source.height;
-                if (app.android) {
-                    // the android dimensions are in device pixels
-                    width = layout.toDeviceIndependentPixels(width);
-                    height = layout.toDeviceIndependentPixels(height);
-                }
-
-                console.log(`Size: ${width}x${height}`);
-            });
-        }, (error) => {
-            console.log("Error: " + error);
-        });
-    }
-
-    onRequestPermissionsTap() {
         requestPermissions().then(
-            () => console.log('got permissions'),
-            () => console.log('permissions rejected')
+            () => {
+                takePicture({ width: 180, height: 180, keepAspectRatio: true, saveToGallery: this.saveToGallery })
+                    .then((imageAsset: any) => {
+                        this.cameraImage = imageAsset;
+            
+                        // if you need image source
+                        let source = new ImageSource();
+                        source.fromAsset(imageAsset).then((source) => {
+                            let width = source.width;
+                            let height = source.height;
+                            if (app.android) {
+                                // the android dimensions are in device pixels
+                                width = layout.toDeviceIndependentPixels(width);
+                                height = layout.toDeviceIndependentPixels(height);
+                            }
+            
+                            console.log(`Size: ${width}x${height}`);
+                        });
+                    }, (error) => {
+                        console.log("Error: " + error);
+                    });
+            },
+            () => alert('permissions rejected')
         );
     }
 }

demo/app/main-page.ts

@@ -18,35 +18,33 @@ export function navigatingTo(args: EventData) {
     page.bindingContext = fromObject({ cameraImage: picturePath, saveToGallery: true });
 }
 
-export function onRequestPermissionsTap(args: EventData) {
-    requestPermissions().then(
-        () => console.log('got permissions'),
-        () => console.log('permissions rejected')
-    );
-}
-
 export function onTakePictureTap(args: EventData) {
     let page = <Page>(<View>args.object).page;
     let saveToGallery = page.bindingContext.get("saveToGallery");
-    takePicture({ width: 180, height: 180, keepAspectRatio: true, saveToGallery: saveToGallery }).
-        then((imageAsset) => {
-            page.bindingContext.set("cameraImage", imageAsset);
+    requestPermissions().then(
+        () => {
+            takePicture({ width: 180, height: 180, keepAspectRatio: true, saveToGallery: saveToGallery }).
+                then((imageAsset) => {
+                    page.bindingContext.set("cameraImage", imageAsset);
 
-            // if you need image source
-            let source = new imageSourceModule.ImageSource();
-            source.fromAsset(imageAsset).then((source) => {
-                let width = source.width;
-                let height = source.height;
-                if (app.android) {
-                    // the android dimensions are in device pixels
-                    width = layout.toDeviceIndependentPixels(width);
-                    height = layout.toDeviceIndependentPixels(height);
-                }
+                    // if you need image source
+                    let source = new imageSourceModule.ImageSource();
+                    source.fromAsset(imageAsset).then((source) => {
+                        let width = source.width;
+                        let height = source.height;
+                        if (app.android) {
+                            // the android dimensions are in device pixels
+                            width = layout.toDeviceIndependentPixels(width);
+                            height = layout.toDeviceIndependentPixels(height);
+                        }
 
-                console.log(`Size: ${width}x${height}`);
-            });
+                        console.log(`Size: ${width}x${height}`);
+                    });
+                },
+                (err) => {
+                    console.log("Error -> " + err.message);
+                });
         },
-        (err) => {
-            console.log("Error -> " + err.message);
-        });
+        () => alert('permissions rejected')
+    );
 }

demo/app/main-page.xml

@@ -5,9 +5,6 @@
             <Switch checked="{{ saveToGallery }}"/>
         </StackLayout>
         <Image row="1" src="{{ cameraImage }}" id="image" stretch="fill" margin="10"/>
-        <StackLayout orientation="horizontal" row="2" padding="10">
-            <Button text="Take Picture" tap="onTakePictureTap" />
-            <Button text="Request Permissions" tap="onRequestPermissionsTap" />
-        </StackLayout>
+        <Button text="Take Picture" tap="onTakePictureTap"  row="2" padding="10"/>
     </GridLayout>
 </Page>

src/package.json

@@ -1,6 +1,6 @@
 {
     "name": "nativescript-camera",
-    "version": "3.4.0",
+    "version": "3.2.0",
     "description": "Provides API for using device camera",
     "repository": {
         "type": "git",