Initial version complete - iOS verified

Author: dotNetkow

ios/App/App.xcodeproj/project.pbxproj

@@ -345,6 +345,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
+				DEVELOPMENT_TEAM = 9YN2HU59K8;
 				INFOPLIST_FILE = App/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@@ -363,6 +364,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_STYLE = Automatic;
+				DEVELOPMENT_TEAM = 9YN2HU59K8;
 				INFOPLIST_FILE = App/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";

package-lock.json

@@ -26,6 +26,7 @@
     "@ionic-native/splash-screen": "^5.0.0",
     "@ionic-native/status-bar": "^5.0.0",
     "@ionic/angular": "^4.7.1",
+    "@ionic/pwa-elements": "^1.4.1",
     "core-js": "^2.5.4",
     "rxjs": "~6.5.1",
     "tslib": "^1.9.0",

package.json

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Plugins, CameraResultType, Capacitor, FilesystemDirectory } from '@capacitor/core';
+import { Plugins, CameraResultType, Capacitor, FilesystemDirectory, CameraPhoto, CameraSource } from '@capacitor/core';
 
 const { Camera, Filesystem, Storage } = Plugins;
 
@@ -13,47 +13,59 @@ export class PhotoService {
   constructor() { }
 
   async loadSaved() {
+    // Retrieve cached photo array data
     const photos = await Storage.get({ key: this.PHOTO_STORAGE });
     this.photos = JSON.parse(photos.value) || [];
   }
 
-  // Use the device camera to take a photo.
-  // Store the photo data into permanent file storage.
-  // Store a reference to the photo in an array.
-  async takePhoto() {
+  /* Use the device camera to take a photo:
+  // https://capacitor.ionicframework.com/docs/apis/camera
+  
+  // Store the photo data into permanent file storage:
+  // https://capacitor.ionicframework.com/docs/apis/filesystem
+  
+  // Store a reference to all photo filepaths using Storage API:
+  // https://capacitor.ionicframework.com/docs/apis/storage
+  */
+  public async takePhoto() {
     // Take a photo
     const capturedPhoto = await Camera.getPhoto({
-      resultType: CameraResultType.Uri
+      resultType: CameraResultType.Uri, // file-based data; provides best performance
+      source: CameraSource.Camera, // automatically take a new photo with the camera
+      quality: 100 // highest quality (0 to 100)
     });
 
     const savedImageFile = await this.savePicture(capturedPhoto);
 
+    // Add new photo to Photos array
     this.photos.unshift({
       filepath: savedImageFile,
       webviewPath: Capacitor.convertFileSrc(savedImageFile)
     });
 
     // Cache all photo data for future retrieval
-    //this.storage.set(this.PHOTO_STORAGE, this.photos);
+    Storage.set({
+      key: this.PHOTO_STORAGE,
+      value: JSON.stringify(this.photos)
+    });
   }
 
   // Save picture to file on device
-  async savePicture(cameraImage) {
+  private async savePicture(cameraPhoto: CameraPhoto) {
     // Read the file into its base64 version
     const readFile = await Filesystem.readFile({
-      path: cameraImage
+      path: cameraPhoto.path
     });
 
     // Write the file to the data directory (instead of temp storage)
     const fileName = new Date().getTime() + '.jpeg';
-    
     await Filesystem.writeFile({
       path: fileName,
       data: readFile.data,
       directory: FilesystemDirectory.Data
     });
 
-    // Get the full filepath
+    // Get the new, complete filepath
     const fileUri = await Filesystem.getUri({
       directory: FilesystemDirectory.Data,
       path: fileName
@@ -63,14 +75,18 @@ export class PhotoService {
   }
 
   // Delete picture by removing it from reference data and the filesystem
-  async deletePicture(photo, position) {
-    // Remove from our Photos reference data array
+  public async deletePicture(photo: Photo, position: number) {
+    // Remove this photo from the Photos reference data array
     this.photos.splice(position, 1);
-    //await this.storage.set(PHOTO_STORAGE, this.photos);
 
-    // delete photo file
-    const filename = photo.filepath.substr(photo.filepath.lastIndexOf('/') + 1);
+    // Update photos array cache by overwriting the existing photo array
+    Storage.set({
+      key: this.PHOTO_STORAGE,
+      value: JSON.stringify(this.photos)
+    });
 
+    // delete photo file from filesystem
+    const filename = photo.filepath.substr(photo.filepath.lastIndexOf('/') + 1);
     await Filesystem.deleteFile({
       path: filename,
       directory: FilesystemDirectory.Data

src/app/services/photo.service.ts

@@ -3,10 +3,14 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
+import { defineCustomElements } from '@ionic/pwa-elements/loader';
 
 if (environment.production) {
   enableProdMode();
 }
 
 platformBrowserDynamic().bootstrapModule(AppModule)
   .catch(err => console.log(err));
+
+// Call the element loader after the platform has been bootstrapped
+defineCustomElements(window);