send image display done

src/app/services/functions/file.service.ts

@@ -13,7 +13,7 @@ import { Camera,  CameraResultType, CameraSource, Photo} from '@capacitor/camera
 import { Filesystem, Directory } from '@capacitor/filesystem';
 import { environment } from 'src/environments/environment';
 import { HttpClient, HttpEventType, HttpHeaders, HttpParams } from '@angular/common/http';
-
+import { Storage } from '@ionic/storage';
 const IMAGE_DIR = 'stored-images';
 
 
@@ -53,6 +53,7 @@ export class FileService {
     private platform: Platform,
     private loadingCtrl: LoadingController,
     private http: HttpClient,
+    private storage: Storage
   ) {
     this.headers = new HttpHeaders();
   }
@@ -354,70 +355,83 @@ export class FileService {
         //loader.remove();
       });
  */  }
+ addPictureToChat(roomId) {
 
-  addPictureToChat(roomId) {
+  console.log('add picture to chat')
 
-    console.log('add picture to chat')
+  const input = this.fileLoaderService.createInput({
-
+    accept: ['image/apng', 'image/jpeg', 'image/png']
-    const input = this.fileLoaderService.createInput({
+  })
-      accept: ['image/apng', 'image/jpeg', 'image/png']
-    })
 
 
-    setInterval(()=>{
+  setInterval(() => {
-      console.log(input.value)
+    console.log(input.value)
-    }, 550)
+  }, 550)
 
 
-    input.onchange = async () => {
+  input.onchange = async () => {
 
-      //alert('Onchange AQUI')
+    //alert('Onchange AQUI')
 
-      const file = this.fileLoaderService.getFirstFile(input)
+    const file = this.fileLoaderService.getFirstFile(input)
 
-      console.log(file);
+    console.log(file);
 
 
-      const formData = new FormData();
+    const formData = new FormData();
-      formData.append("blobFile", file);
+    formData.append("blobFile", file);
-      let guid: any = await this.uploadFile(formData).toPromise()
+    let guid: any = await this.uploadFile(formData).toPromise()
-      console.log('add picture to chat',guid.path);
+    console.log('add picture to chat', guid.path);
+    this.downloadFile(guid.path).subscribe(async (event) => {
 
-      /* const imageData =  await this.fileToBase64Service.convert(file)
+      if (event.type === HttpEventType.DownloadProgress) {
-      this.capturedImage = imageData; */
+        //this.downloadProgess = Math.round((100 * event.loaded) / event.total);
-      this.capturedImageTitle = file.name;
+        //console.log('FILE TYPE 33', msg.file.type)
+      } else if (event.type === HttpEventType.Response) {
+        var fileImage = 'data:image/jpeg;base64,' + btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''));
+        console.log('add picture to chat',fileImage);
+        await this.storage.set(guid, fileImage).then(() => {
+          console.log('add picture to chat IMAGE SAVED')
 
-      let body = {
+          let body = {
-        "message":
+            "message":
-        {
+            {
-          "rid": roomId,
+              "rid": roomId,
-          "msg": "",
+              "msg": "",
-          "attachments": [{
+              "attachments": [{
-            //"title": this.capturedImageTitle ,
+                //"title": this.capturedImageTitle ,
-            //"text": "description",
+                //"text": "description",
-            "title_link_download": false,
+                "title_link_download": false,
-            //"image_url": this.capturedImage,
+                //"image_url": this.capturedImage,
-          }],
+              }],
-          "file":{
+              "file": {
-            "type": "application/img",
+                "type": "application/img",
-            "guid": guid.path,
+                "guid": guid.path,
-            "image_url": ""
+                "image_url": fileImage
+              }
+            }
           }
-        }
+
+          console.log('SELECT PICTURE GALLERY', body)
+          console.log(this.capturedImage)
+
+          this.chatService.sendMessage(body).subscribe(res => {
+
+            console.log('Msg after send image', res);
+          }, (error) => {
+            console.log('Msg after send image error', error);
+          });
+        });
       }
 
-      console.log('SELECT PICTURE GALLERY', body)
+    });
-      console.log(this.capturedImage)
 
-      this.chatService.sendMessage(body).subscribe(res=> {
+    /* const imageData =  await this.fileToBase64Service.convert(file)
+    this.capturedImage = imageData; */
 
-        console.log('Msg after send image',res);
+    //console.log(this.capturedImage)
-      },(error) => {
+  };
-        console.log('Msg after send image error',error);
+}
-      });
-      //console.log(this.capturedImage)
-    };
-  }
 
   addDocumentToChat(roomId:string) {
     const input = this.fileLoaderService.createInput({