Add storage to web chat

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

@@ -59,9 +59,10 @@
         <div>
           <ion-label>{{msg.msg}}</ion-label>
           <div *ngIf="msg.attachments" class="message-attachments">
+            <img *ngIf="msg.image_url" src="{{msg.image_url}}" alt="image">
             <div *ngFor="let file of msg.attachments let i = index">
               <div (click)="openPreview(msg)">
-                <img *ngIf="file.image_url" src="{{file.image_url}}" alt="image">
+                <img *ngIf="msg.image_url" src="{{downloadfile}}" alt="image">
               </div>
               <div>
                 <div>

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

@@ -27,6 +27,7 @@ import { PreviewCameraPage } from 'src/app/modals/preview-camera/preview-camera.
 import { SqliteService } from 'src/app/services/sqlite.service';
 import { elementAt } from 'rxjs-compat/operator/elementAt';
 import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
+import { HttpEventType } from '@angular/common/http';
 
 const IMAGE_DIR = 'stored-images';
 
@@ -76,6 +77,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
   duration = 0;
   @ViewChild('recordbtn', { read: ElementRef }) recordBtn: ElementRef;
   myAudio: any;
+  downloadfile: any;
 
   constructor(
     public popoverController: PopoverController,
@@ -551,6 +553,40 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     });
   }
 
+  /* 
+        this.fileService.downloadFile(element.file.guid).subscribe(async (event) => {
+          var name = element.file.guid;
+          if (event.type === HttpEventType.DownloadProgress) {
+            
+          } else if (event.type === HttpEventType.Response) {
+            var base64 = btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '')
+            );
+
+            console.log('TRY ARRAY BUFFER NAME', name);
+            console.log('TRY ARRAY BUFFER', base64);
+
+            await Filesystem.writeFile({
+              path: `${IMAGE_DIR}/${name}`,
+              data: base64,
+              directory: Directory.Data
+            }).then((foo) => {
+
+              console.log('LSKE FS FILE SAVED', foo)
+
+            }).catch((error) => {
+              console.log('error LAKE FS FILE', error)
+            });
+
+          
+
+          const readFile = await Filesystem.readFile({
+            path: `${IMAGE_DIR}/${name}`,
+            directory: Directory.Data,
+          }); 
+          
+          
+        });*/
+
   getRoomMessageDB(roomId) {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
     } else {
@@ -597,6 +633,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
     } else {
       res.forEach(element => {
+
         let chatmsg = {
           _id: element._id,
           attachments: element.attachments,
@@ -607,10 +644,16 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
           rid: element.rid,
           ts: element.ts,
           u: element.u,
-          _updatedAt: element._updatedAt
+          _updatedAt: element._updatedAt,
+          /* image_url: {
+            name: name,
+            path: `${IMAGE_DIR}/${name}`,
+            data: `data:image/jpeg;base64,${readFile.data}`,
+          }, */
         }
 
         this.sqlservice.addChatMSG(chatmsg)
+
       });
     }