resizingChatPhotos

src/app/app-routing.module.ts

@@ -207,6 +207,10 @@ const routes = [
   {
     path: 'preview-camera',
     loadChildren: () => import('./modals/preview-camera/preview-camera.module').then( m => m.PreviewCameraPageModule)
+  },
+  {
+    path: 'group-icons',
+    loadChildren: () => import('./modals/group-icons/group-icons.module').then( m => m.GroupIconsPageModule)
   },
 
 

src/app/app.module.ts

@@ -36,6 +36,7 @@ import {MAT_DATE_FORMATS, MAT_DATE_LOCALE} from '@angular/material/core';
 import { NgxMatDateFormats, NGX_MAT_DATE_FORMATS } from '@angular-material-components/datetime-picker';
 import { Network } from '@ionic-native/network/ngx';
 import { File } from '@ionic-native/file/ngx';
+import { ImageCropperModule } from 'ngx-image-cropper';
 
 
 import {
@@ -65,6 +66,7 @@ import { Media } from '@ionic-native/media/ngx';
 import { StreamingMedia } from '@ionic-native/streaming-media/ngx';
 import { PhotoViewer } from '@ionic-native/photo-viewer/ngx';
 
+
 /* import { FCM } from '@ionic-native/fcm/ngx';
 import { FirebaseX } from '@ionic-native/firebase-x/ngx'; */
 //import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx';
@@ -102,6 +104,8 @@ import { FirebaseX } from '@ionic-native/firebase-x/ngx'; */
     //
     PdfViewerModule,
     HammerModule,
+
+   
     ],
   providers: [
     { provide: MAT_DATE_LOCALE, useValue: 'pt' },

src/app/modals/group-icons/group-icons-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { GroupIconsPage } from './group-icons.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: GroupIconsPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class GroupIconsPageRoutingModule {}

src/app/modals/group-icons/group-icons.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { GroupIconsPageRoutingModule } from './group-icons-routing.module';
+
+import { GroupIconsPage } from './group-icons.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    GroupIconsPageRoutingModule
+  ],
+  declarations: [GroupIconsPage]
+})
+export class GroupIconsPageModule {}

src/app/modals/group-icons/group-icons.page.html

@@ -0,0 +1,31 @@
+<ion-card >
+  <ion-card-content > 
+   <ion-row>
+      <ion-col size="3" class="ion-text-center">
+        <ion-button (click)="removerIcone()" fill="clear" color="light">
+          <!-- <ion-icon name="remove" slot="start"></ion-icon> -->
+          <ion-icon class="redla" name="trash-outline"></ion-icon>
+        </ion-button>
+      </ion-col>
+      <ion-col size="3" class="ion-text-center">
+        <ion-button (click)="openGaleria()" fill="clear" color="light">
+          <!-- <ion-icon name="remove" slot="start"></ion-icon> -->
+          <ion-icon class="redla" name="flower-outline"></ion-icon>
+        </ion-button>
+      </ion-col>
+      <ion-col size="3" class="ion-text-center">
+        <ion-button (click)="OpenCamera()" fill="clear" color="light">
+         
+          <ion-icon  class="redla" name="camera-outline"></ion-icon>
+        
+        </ion-button>
+      </ion-col>
+      <ion-col size="3" class="ion-text-center">
+        <ion-button (click)="pesquizarWeb()" fill="clear" color="light">
+          <ion-icon class="redla" name="search-outline"></ion-icon>
+        
+        </ion-button>
+      </ion-col>
+    </ion-row>
+  </ion-card-content>
+</ion-card>

src/app/modals/group-icons/group-icons.page.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { GroupIconsPage } from './group-icons.page';
+
+describe('GroupIconsPage', () => {
+  let component: GroupIconsPage;
+  let fixture: ComponentFixture<GroupIconsPage>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ GroupIconsPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(GroupIconsPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/modals/group-icons/group-icons.page.ts

@@ -0,0 +1,38 @@
+import { Component, OnInit } from '@angular/core';
+import { IonSlides, ModalController, NavParams } from '@ionic/angular';
+
+@Component({
+  selector: 'app-group-icons',
+  templateUrl: './group-icons.page.html',
+  styleUrls: ['./group-icons.page.scss'],
+})
+export class GroupIconsPage implements OnInit {
+
+  constructor( private modalController: ModalController,
+    private navParams:NavParams) { }
+
+  ngOnInit() {
+  }
+
+  removerIcone(){
+
+  }
+  openGaleria(){
+
+  }
+  OpenCamera(){
+    
+  }
+  pesquizarWeb(){
+    
+  }
+
+  dismiss() {
+    // using the injected ModalController this page
+    // can "dismiss" itself and optionally pass back data
+    this.modalController.dismiss({
+      'dismissed': true
+    });
+  }
+}
+

src/app/modals/preview-camera/preview-camera.module.ts

@@ -7,12 +7,14 @@ import { IonicModule } from '@ionic/angular';
 import { PreviewCameraPageRoutingModule } from './preview-camera-routing.module';
 
 import { PreviewCameraPage } from './preview-camera.page';
+import { ImageCropperModule } from 'ngx-image-cropper';
 
 @NgModule({
   imports: [
     CommonModule,
     FormsModule,
     IonicModule,
+    ImageCropperModule,
     PreviewCameraPageRoutingModule
   ],
   declarations: [PreviewCameraPage]

src/app/modals/preview-camera/preview-camera.page.html

@@ -3,21 +3,25 @@
 <ion-card-content >
   <ion-card-header >
     <ion-toolbar>
-      <ion-title>{{username}}   <span>{{_updatedAt}}</span> </ion-title>
+     
+        {{username}}   <span>{{_updatedAt}}</span> 
+      
+      
     </ion-toolbar>
   </ion-card-header>
   
     <img src="{{image}}" />
  
-
-  <!-- <ion-slides #slider [options]="slideOpts">
-    <ion-slide >
-      <div class="swiper-zoom-container">
-        
-      </div>
-    </ion-slide>
-  </ion-slides> -->
 </ion-card-content>
+<!-- <image-cropper [imageBase64]="myimage"
+    [maintainAspectRatio]="true"
+    [aspectRatio]="4 / 3"
+    outputType = "base64"
+    format="png"
+    [resizeToWidth]="true"
+    (imageCropped)="imageCropped($event)"
+  
+></image-cropper> -->
 
 <ion-footer>
   <ion-row>

src/app/modals/preview-camera/preview-camera.page.ts

@@ -1,5 +1,7 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { IonSlides, ModalController, NavParams } from '@ionic/angular';
+import { ImageCroppedEvent } from 'ngx-image-cropper';
+import { GroupIconsPage } from '../group-icons/group-icons.page';
 
 @Component({
   selector: 'app-preview-camera',
@@ -17,6 +19,10 @@ export class PreviewCameraPage implements OnInit {
   username: string
   _updatedAt: string
 
+
+  // myimage: null
+  // croppedImageBase64: any
+
 // @Input('img') img: any
 // @Input() username: string;
 // @Input() date: string;
@@ -31,6 +37,7 @@ ngOnInit() {
   this.username = this.navParams.get('username')
   this._updatedAt = this.navParams.get('_updatedAt')
   console.log(this.image)
+  // this.image = this.myimage
 }
 
 ionViewDidEnter(){
@@ -46,6 +53,20 @@ async zoom(zoomIn: boolean){
 close(){
   this.modalController.dismiss()
     }
+
+// imageCropped(ev: ImageCroppedEvent){
+//     this.croppedImageBase64 = ev.base64
+//   }
+
+
+// async grupo(){
+//   const modal = await this.modalController.create({
+//     component:   GroupIconsPage,
+//     cssClass: 'transparent-modal',
+//   });
+//   modal.present();
+//   }
 }
 
 
+

src/app/pages/chat/chat.module.ts

@@ -29,6 +29,7 @@ import { HeaderPageModule } from 'src/app/shared/header/header.module';
 import { NewEventPageModule } from 'src/app/shared/agenda/new-event/new-event.module';
 import { AttendeeModalPageModule } from 'src/app/shared/event/attendee-modal/attendee-modal.module';
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { ImageCropperModule } from 'ngx-image-cropper';
 
 @NgModule({
   imports: [
@@ -48,6 +49,7 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
     GroupContactsPageModule,
     EmptyChatPageModule,
     NewEventPageModule,
+    ImageCropperModule,
     AttendeeModalPageModule,
   ],
   declarations: [

src/app/pages/chat/group-messages/group-messages.module.ts

@@ -13,6 +13,8 @@ import { ChatPopoverPageModule } from 'src/app/shared/popover/chat-popover/chat-
 import { BtnModalDismissPageModule } from 'src/app/shared/btn-modal-dismiss/btn-modal-dismiss.module';
 
 import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+import { ImageCropperModule } from 'ngx-image-cropper';
+import { AngularCropperjsModule } from 'angular-cropperjs';
 
 @NgModule({
   imports: [
@@ -24,6 +26,9 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
     GroupMessagesPageRoutingModule,
     ChatPopoverPageModule,
     BtnModalDismissPageModule,
+    ImageCropperModule,
+    AngularCropperjsModule
+
   ],
   declarations: [GroupMessagesPage]
 })

src/app/pages/chat/group-messages/group-messages.page.html

@@ -67,7 +67,10 @@
           <div *ngIf="msg.attachments" class="message-attachments">
             <div *ngFor="let file of msg.attachments">
               <img *ngIf="file.image_url" src="{{file.image_url}}" alt="image" >
+
+              
               <div>
+               
                 <div>
                   <div class="file">
                     <!-- <canvas id="pdf_canvas"></canvas> -->
@@ -90,7 +93,9 @@
                   </div>
                 </div>
               </div>
+              
             </div>
+            
           </div>
           {{last ? scrollToBottom() : ''}}
         </div>

src/app/pages/chat/group-messages/group-messages.page.ts

@@ -29,6 +29,7 @@ import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.
 })
 export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
 
+  
 
   showLoader: boolean;
   isGroupCreated:boolean;

src/app/pages/publications/new-publication/new-publication.page.html

@@ -30,7 +30,11 @@
           <ion-thumbnail slot="start">
           
               <ion-img [(ngModel)]="capturedImage" name="image" ngDefaultControl [src]="photo" (click)="openPreview(photo)" ></ion-img>
-           
+              <ion-row>
+                <ion-col>
+                  <img src="" #imageElement/>
+                </ion-col>
+              </ion-row>
           </ion-thumbnail>
           <ion-label>
             <p>{{capturedImageTitle}}</p>
@@ -58,7 +62,7 @@
       </div>
 
       <div class="ion-item-container-no-border">
-        <ion-label (click)="takePictures()">
+        <ion-label (click)="takePicture()">
           <div class="attach-icon">
             <ion-icon  *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-add-photo.svg"></ion-icon>
             <ion-icon  *ngIf="ThemeService.currentTheme == 'gov' " src="assets/images/theme/gov/icons-add-photo.svg"></ion-icon>
@@ -70,7 +74,7 @@
           </ion-label>
       </div>
 
-      <div class="ion-item-container-no-border">
+      <!-- <div class="ion-item-container-no-border">
         <ion-label (click)="selectImage()" class="cursor-pointer">
           <div class="attach-icon">
             <ion-icon *ngIf="ThemeService.currentTheme == 'default' " src="assets/images/icons-add-photos.svg"></ion-icon>
@@ -80,7 +84,7 @@
             <ion-label>Anexar Fotografia</ion-label>
           </div>
       </ion-label> 
-      </div>
+      </div> -->
     </div>
 
   </div>

src/app/pages/publications/new-publication/new-publication.page.ts

@@ -20,6 +20,8 @@ import { Camera, CameraResultType, CameraSource, Photo } from '@capacitor/camera
 
 import { Filesystem, Directory } from '@capacitor/filesystem';
 import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.page';
+import {Photos} from '../new-publication/photos'
+import {Storage}  from '@capacitor/storage'
 
 const IMAGE_DIR = 'stored-images';
 
@@ -37,7 +39,7 @@ export class NewPublicationPage implements OnInit {
   images: LocalFile[] = [];
 
   files: Set<File>;
-  photos: any[] = [];
+
 
   // date picker
   public date: any;
@@ -85,17 +87,19 @@ export class NewPublicationPage implements OnInit {
     private fileLoaderService: FileLoaderService,
     private fileToBase64Service: FileToBase64Service,
     public ThemeService: ThemeService,
-    private platform: Platform,
+  
     private loadingCtrl: LoadingController,
-    private changeDetectorRef: ChangeDetectorRef
+    private changeDetectorRef: ChangeDetectorRef,
+    platform: Platform
   ) {
 
     this.publicationType = this.navParams.get('publicationType');
     this.folderId = this.navParams.get('folderId');
     this.publicationTitle = 'Nova Publicação';
+    this.platform = platform;
   }
 
-  ngOnInit() {
+ngOnInit() {
     this.setTitle();
     console.log(this.folderId);
     Filesystem.mkdir({
@@ -103,55 +107,56 @@ export class NewPublicationPage implements OnInit {
       directory: Directory.Data,
       recursive: true
     });
-    this.loadPicture() 
+    // await this.loadSaved();
+    // this.loadPicture() 
 
     // this.takePicture();
   }
 
-  async takePicture() {
-    const image = await Camera.getPhoto({
-      quality: 90,
-      allowEditing: false,
-      resultType: CameraResultType.Uri,
-      source: CameraSource.Camera // Camera, Photos or Prompt!
-    });
+  // async takePicture() {
+  //   const image = await Camera.getPhoto({
+  //     quality: 90,
+  //     allowEditing: false,
+  //     resultType: CameraResultType.Uri,
+  //     source: CameraSource.Camera // Camera, Photos or Prompt!
+  //   });
 
-    if (image) {
-      this.saveImage(image)
-    }
+  //   if (image) {
+  //     this.saveImage(image)
+  //   }
 
-  }
+  // }
 
-  convertBlobToBase64s = (blob: Blob) => new Promise((resolve, reject) => {
-    const reader = new FileReader;
-    reader.onerror = reject;
-    reader.onload = () => {
-      resolve(reader.result);
-    };
-    reader.readAsDataURL(blob);
-  });
+  // convertBlobToBase64s = (blob: Blob) => new Promise((resolve, reject) => {
+  //   const reader = new FileReader;
+  //   reader.onerror = reject;
+  //   reader.onload = () => {
+  //     resolve(reader.result);
+  //   };
+  //   reader.readAsDataURL(blob);
+  // });
 
 
-  async laodPicture() {
-    const capturedImage = await Camera.getPhoto({
-      resultType: CameraResultType.Uri,
-      source: CameraSource.Photos,
-      quality: 90,
-      width: 1080,
-      height: 720,
-    });
+  // async laodPicture() {
+  //   const capturedImage = await Camera.getPhoto({
+  //     resultType: CameraResultType.Uri,
+  //     source: CameraSource.Photos,
+  //     quality: 90,
+  //     width: 1080,
+  //     height: 720,
+  //   });
 
-    const response = await fetch(capturedImage.webPath!);
-    const blob = await response.blob();
+  //   const response = await fetch(capturedImage.webPath!);
+  //   const blob = await response.blob();
 
-    this.photos.unshift({
-      filepath: "soon...",
-      webviewPath: capturedImage.webPath
-    });
+  //   this.photos.unshift({
+  //     filepath: "soon...",
+  //     webviewPath: capturedImage.webPath
+  //   });
 
-    this.capturedImage = await this.convertBlobToBase64s(blob);
-    this.capturedImageTitle = new Date().getTime() + '.jpeg';
-  }
+  //   this.capturedImage = await this.convertBlobToBase64s(blob);
+  //   this.capturedImageTitle = new Date().getTime() + '.jpeg';
+  // }
 
   /* laodPicture() {
     const input = this.fileLoaderService.createInput({
@@ -419,104 +424,101 @@ private async savePicture(photo: Photo) {
    this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));
  } */
 
+  // async selectImage() {
+  //   const image = await Camera.getPhoto({
+  //     quality: 90,
+  //     allowEditing: false,
+  //     resultType: CameraResultType.Uri,
+  //     source: CameraSource.Photos // Camera, Photos or Prompt!
+  //   });
 
+  //   if (image) {
+  //     this.saveImage(image)
+  //   }
+  // }
 
+  // // Create a new file from a capture image
+  // async saveImage(photo: Photo) {
+  //   const base64Data = await this.readAsBase64(photo);
 
-  async selectImage() {
-    const image = await Camera.getPhoto({
-      quality: 90,
-      allowEditing: false,
-      resultType: CameraResultType.Uri,
-      source: CameraSource.Photos // Camera, Photos or Prompt!
-    });
+  //   const fileName = new Date().getTime() + '.jpeg';
+  //   const savedFile = await Filesystem.writeFile({
+  //     path: `${IMAGE_DIR}/${fileName}`,
+  //     data: base64Data,
+  //     directory: Directory.Data
+  //   });
 
-    if (image) {
-      this.saveImage(image)
-    }
-  }
+  //   this.loadFiles();
+  // }
 
-  // Create a new file from a capture image
-  async saveImage(photo: Photo) {
-    const base64Data = await this.readAsBase64(photo);
+  // private async readAsBase64(photo: Photo) {
+  //   if (this.platform.is('hybrid')) {
+  //     const file = await Filesystem.readFile({
+  //       path: photo.path
+  //     });
 
-    const fileName = new Date().getTime() + '.jpeg';
-    const savedFile = await Filesystem.writeFile({
-      path: `${IMAGE_DIR}/${fileName}`,
-      data: base64Data,
-      directory: Directory.Data
-    });
+  //     return file.data;
+  //   }
+  //   else {
+  //     // Fetch the photo, read as a blob, then convert to base64 format
+  //     const response = await fetch(photo.webPath);
+  //     const blob = await response.blob();
 
-    this.loadFiles();
-  }
+  //     return await this.convertBlobToBase64(blob) as string;
+  //   }
+  // }
 
-  private async readAsBase64(photo: Photo) {
-    if (this.platform.is('hybrid')) {
-      const file = await Filesystem.readFile({
-        path: photo.path
-      });
+  // async loadFiles() {
+  //   this.images = [];
 
-      return file.data;
-    }
-    else {
-      // Fetch the photo, read as a blob, then convert to base64 format
-      const response = await fetch(photo.webPath);
-      const blob = await response.blob();
+  //   const loading = await this.loadingCtrl.create({
+  //     message: 'Loading data...',
+  //   });
+  //   await loading.present();
 
-      return await this.convertBlobToBase64(blob) as string;
-    }
-  }
+  //   Filesystem.readdir({
+  //     path: IMAGE_DIR,
+  //     directory: Directory.Data,
+  //   }).then(result => {
+  //     console.log('ALL RESULTS', result.files[0])
+  //     let lastphoto = result.files[result.files.length - 1]
+  //     this.loadFileData(lastphoto);
+  //   },
+  //     async (err) => {
+  //       console.log('ERROR FILE DOSENT EXIST', err)
+  //       // Folder does not yet exists!
+  //       await Filesystem.mkdir({
+  //         path: IMAGE_DIR,
+  //         directory: Directory.Data,
+  //         recursive: true
+  //       });
+  //     }
+  //   ).then(_ => {
+  //     loading.dismiss();
+  //   });
+  // }
 
-  async loadFiles() {
-    this.images = [];
+  // async loadFileData(fileName: string) {
+  //   console.log('ALL PHOTOT FILE', fileName)
+  //   // for (let f of fileNames) {
+  //   const filePath = `${IMAGE_DIR}/${fileName}`;
 
-    const loading = await this.loadingCtrl.create({
-      message: 'Loading data...',
-    });
-    await loading.present();
+  //   const readFile = await Filesystem.readFile({
+  //     path: filePath,
+  //     directory: Directory.Data,
+  //   });
 
-    Filesystem.readdir({
-      path: IMAGE_DIR,
-      directory: Directory.Data,
-    }).then(result => {
-      console.log('ALL RESULTS', result.files[0])
-      let lastphoto = result.files[result.files.length - 1]
-      this.loadFileData(lastphoto);
-    },
-      async (err) => {
-        console.log('ERROR FILE DOSENT EXIST', err)
-        // Folder does not yet exists!
-        await Filesystem.mkdir({
-          path: IMAGE_DIR,
-          directory: Directory.Data,
-          recursive: true
-        });
-      }
-    ).then(_ => {
-      loading.dismiss();
-    });
-  }
+  //   this.images.push({
+  //     name: fileName,
+  //     path: filePath,
+  //     data: `data:image/jpeg;base64,${readFile.data}`,
+  //   });
 
-  async loadFileData(fileName: string) {
-    console.log('ALL PHOTOT FILE', fileName)
-    // for (let f of fileNames) {
-    const filePath = `${IMAGE_DIR}/${fileName}`;
+  //   console.log('ALL IMAGE', this.images)
 
-    const readFile = await Filesystem.readFile({
-      path: filePath,
-      directory: Directory.Data,
-    });
-
-    this.images.push({
-      name: fileName,
-      path: filePath,
-      data: `data:image/jpeg;base64,${readFile.data}`,
-    });
-
-    console.log('ALL IMAGE', this.images)
-
-    this.capturedImage = this.images[0].data
-    //}
-  }
+  //   this.capturedImage = this.images[0].data
+  //   //}
+  // }
 
   sliderOpts = {
     zoom: false,
@@ -565,7 +567,7 @@ touchStart(card) {
       component:  PreviewCameraPage,
       cssClass: 'transparent-modal',
       componentProps: {
-        image: photo.attachments[0].image_url,
+        image: photo,
         username: photo.u.username,
         _updatedAt: photo._updatedAt
       }
@@ -573,65 +575,102 @@ touchStart(card) {
     modal.present();
   }
 
-  async takePictures() {
-    const capturedImage = await Camera.getPhoto({
-      quality: 90,
-      // allowEditing: true,
-      resultType: CameraResultType.Uri,
-      source: CameraSource.Camera
+//   async takePictures() {
+//     const capturedImage = await Camera.getPhoto({
+//       quality: 90,
+//       // allowEditing: true,
+//       resultType: CameraResultType.Uri,
+//       source: CameraSource.Camera
 
-    });
-    const response = await fetch(capturedImage.webPath!);
-    const blob = await response.blob();
+//     });
+//     const response = await fetch(capturedImage.webPath!);
+//     const blob = await response.blob();
 
-      this.photos.unshift({
-        filepath: "soon...",
-        webviewPath: capturedImage.webPath
-      });
+//       this.photos.unshift({
+//         filepath: "soon...",
+//         webviewPath: capturedImage.webPath
+//       });
 
-      this.capturedImage = await this.convertBlobToBase64(blob);
-      this.capturedImageTitle = new Date().getTime() + '.jpeg';
+//       this.capturedImage = await this.convertBlobToBase64(blob);
+//       this.capturedImageTitle = new Date().getTime() + '.jpeg';
 
-    let data = {
-      image:this.capturedImage,
-      name: this.capturedImageTitle
-    }
+//     let data = {
+//       image:this.capturedImage,
+//       name: this.capturedImageTitle
+//     }
 
-    return data;
-    alert(data)
-  }
+//     return data;
+//     alert(data)
+//   }
+
+//   convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
+//     const reader = new FileReader;
+//     reader.onerror = reject;
+//     reader.onload = () => {
+//         resolve(reader.result);
+//     };
+//     reader.readAsDataURL(blob);
+//   });
+
+//   loadPicture() {
+//     const input = this.fileLoaderService.createInput({
+//       accept: ['image/apng', 'image/jpeg', 'image/png']
+//     })
+
+//     input.onchange = async () => {
+//       const file = this.fileLoaderService.getFirstFile(input)
+
+//       console.log(file);
+
+//       const imageData =  await this.fileToBase64Service.convert(file)
+//       this.capturedImage = imageData;
+//       this.capturedImageTitle = file.name;
+
+//       let data = {
+//         image:this.capturedImage,
+//         name: this.capturedImageTitle
+//       }
+
+//       return data;
+
+//       console.log(data)
+//     };
+//   }
+public photos: Photos[] = [];
+private PHOTO_STORAGE: string = "photos";
+private platform: Platform;
+
+
+async takePicture() {
+  const capturedImage = await Camera.getPhoto({
+    quality: 90,
+    // allowEditing: true,
+    resultType: CameraResultType.Uri,
+    source: CameraSource.Camera
 
-  convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
-    const reader = new FileReader;
-    reader.onerror = reject;
-    reader.onload = () => {
-        resolve(reader.result);
-    };
-    reader.readAsDataURL(blob);
   });
+  const response = await fetch(capturedImage.webPath!);
+  const blob = await response.blob();
 
-  loadPicture() {
-    const input = this.fileLoaderService.createInput({
-      accept: ['image/apng', 'image/jpeg', 'image/png']
-    })
+    this.photos.unshift({
+      filepath: "soon...",
+      webviewPath: capturedImage.webPath
+    });
 
-    input.onchange = async () => {
-      const file = this.fileLoaderService.getFirstFile(input)
-
-      console.log(file);
-
-      const imageData =  await this.fileToBase64Service.convert(file)
-      this.capturedImage = imageData;
-      this.capturedImageTitle = file.name;
-
-      let data = {
-        image:this.capturedImage,
-        name: this.capturedImageTitle
-      }
-
-      return data;
-
-      console.log(data)
-    };
+    this.capturedImage = await this.convertBlobToBase64(blob);
+    this.capturedImageTitle = new Date().getTime() + '.jpeg';
+   
   }
-}
+
+convertBlobToBase64 = (blob: Blob) => new Promise((resolve, reject) => {
+  const reader = new FileReader;
+  reader.onerror = reject;
+  reader.onload = () => {
+      resolve(reader.result);
+  };
+  reader.readAsDataURL(blob);
+});
+
+loadPicture() {
+}}
+