From 487fe4ae6da562a26fc8a10d2888fa49e3524710 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Eudes=20In=C3=A1cio?= Date: Tue, 16 Nov 2021 13:07:55 +0100 Subject: [PATCH] Take picture added to new publications --- .../new-publication/new-publication.page.html | 2 +- .../new-publication/new-publication.page.ts | 119 +++++++++++++++++- 2 files changed, 118 insertions(+), 3 deletions(-) diff --git a/src/app/pages/publications/new-publication/new-publication.page.html b/src/app/pages/publications/new-publication/new-publication.page.html index 8295b9520..253fd8073 100644 --- a/src/app/pages/publications/new-publication/new-publication.page.html +++ b/src/app/pages/publications/new-publication/new-publication.page.html @@ -56,7 +56,7 @@
- +
diff --git a/src/app/pages/publications/new-publication/new-publication.page.ts b/src/app/pages/publications/new-publication/new-publication.page.ts index a82247f04..51aac11b1 100644 --- a/src/app/pages/publications/new-publication/new-publication.page.ts +++ b/src/app/pages/publications/new-publication/new-publication.page.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { ModalController, NavParams } from '@ionic/angular'; +import { ModalController, NavParams, Platform, LoadingController } from '@ionic/angular'; /* import {Plugins, CameraResultType, CameraSource} from '@capacitor/core'; */ import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; @@ -18,12 +18,22 @@ import { FileToBase64Service } from 'src/app/services/file/file-to-base64.servic import { ThemeService } from 'src/app/services/theme.service'; import { Camera, CameraResultType, CameraSource, Photo} from '@capacitor/camera'; +import { Filesystem, Directory } from '@capacitor/filesystem'; + +const IMAGE_DIR = 'stored-images'; + +interface LocalFile { + name: string; + path: string; + data: string; +} @Component({ selector: 'app-new-publication', templateUrl: './new-publication.page.html', styleUrls: ['./new-publication.page.scss'], }) export class NewPublicationPage implements OnInit { + images: LocalFile[] = []; // date picker public date: any; @@ -70,7 +80,9 @@ export class NewPublicationPage implements OnInit { private toastService: ToastService, private fileLoaderService: FileLoaderService, private fileToBase64Service: FileToBase64Service, - public ThemeService: ThemeService + public ThemeService: ThemeService, + private platform: Platform, + private loadingCtrl: LoadingController, ) { this.publicationType = this.navParams.get('publicationType'); @@ -81,6 +93,11 @@ export class NewPublicationPage implements OnInit { ngOnInit() { this.setTitle(); console.log(this.folderId); + Filesystem.mkdir({ + path: IMAGE_DIR, + directory: Directory.Data, + recursive: true + }); // this.takePicture(); } @@ -369,4 +386,102 @@ async takePicture() { this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl)); } */ + + + +async selectImage() { + const image = await Camera.getPhoto({ + quality: 90, + allowEditing: false, + resultType: CameraResultType.Uri, + source: CameraSource.Camera // 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); + + const fileName = new Date().getTime() + '.jpeg'; + const savedFile = await Filesystem.writeFile({ + path: `${IMAGE_DIR}/${fileName}`, + data: base64Data, + directory: Directory.Data + }); + + this.loadFiles(); +} + + private async readAsBase64(photo: Photo) { + if (this.platform.is('hybrid')) { + const file = await Filesystem.readFile({ + path: photo.path + }); + + 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(); + + return await this.convertBlobToBase64(blob) as string; + } +} + +async loadFiles() { + this.images = []; + + const loading = await this.loadingCtrl.create({ + message: 'Loading data...', + }); + await loading.present(); + + 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 loadFileData(fileName: string) { + console.log('ALL PHOTOT FILE', fileName) + // for (let f of fileNames) { + const filePath = `${IMAGE_DIR}/${fileName}`; + + 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 + //} +} }